@tesouro/embedded-components-react 0.11.14 → 0.11.17

package/dist/experimental/QuickViewWidget.d.ts

@@ -662,10 +662,16 @@ interface InvoicesQuickViewWidgetLabels extends InvoicesQuickViewTileLabels {
     /** Line under the total when nothing is overdue, e.g. "5 open invoices". */
     openInvoiceCount: (count: number) => string;
     /**
-     * Line under the total when something is overdue, e.g.
-     * "$6,450.00 overdue · 3 invoices". `amount` is already formatted.
+     * Start of the line under the total when something is overdue, e.g.
+     * "$6,450.00 overdue", in the destructive tone. `amount` is already
+     * formatted.
      */
-    overdueSummary: (amount: string, count: number) => string;
+    overdueAmount: (amount: string) => string;
+    /**
+     * Rest of the overdue line, muted, e.g. " · 3 invoices". It follows
+     * `overdueAmount` directly, so it carries its own separator.
+     */
+    overdueInvoiceCount: (count: number) => string;
     /** The overdue line as a screen reader hears it, without the separator. */
     overdueDescription: (amount: string, count: number) => string;
     /**

package/dist/experimental/index.d.ts

@@ -662,10 +662,16 @@ interface InvoicesQuickViewWidgetLabels extends InvoicesQuickViewTileLabels {
     /** Line under the total when nothing is overdue, e.g. "5 open invoices". */
     openInvoiceCount: (count: number) => string;
     /**
-     * Line under the total when something is overdue, e.g.
-     * "$6,450.00 overdue · 3 invoices". `amount` is already formatted.
+     * Start of the line under the total when something is overdue, e.g.
+     * "$6,450.00 overdue", in the destructive tone. `amount` is already
+     * formatted.
      */
-    overdueSummary: (amount: string, count: number) => string;
+    overdueAmount: (amount: string) => string;
+    /**
+     * Rest of the overdue line, muted, e.g. " · 3 invoices". It follows
+     * `overdueAmount` directly, so it carries its own separator.
+     */
+    overdueInvoiceCount: (count: number) => string;
     /** The overdue line as a screen reader hears it, without the separator. */
     overdueDescription: (amount: string, count: number) => string;
     /**

package/dist/libs/tesouro-embedded-components-react/quick-view-widget/invoices/feature/dist/lib/InvoicesQuickViewWidget/InvoicesQuickViewWidgetFeature.js

@@ -43,9 +43,12 @@ function S(e, t, n) {
 	if (e.overdueCount > 0) {
 		let n = x(e.overdueAmountDue);
 		return {
-			subtext: t.overdueSummary(n, e.overdueCount),
+			subtext: [{
+				text: t.overdueAmount(n),
+				tone: "destructive"
+			}, { text: t.overdueInvoiceCount(e.overdueCount) }],
 			description: t.overdueDescription(n, e.overdueCount),
-			subtextTone: "destructive",
+			subtextTone: "muted",
 			callToAction: "viewInvoices"
 		};
 	}

package/dist/libs/tesouro-embedded-components-react/quick-view-widget/invoices/feature/dist/lib/InvoicesQuickViewWidget/labels.js

@@ -9,7 +9,8 @@ var t = (e, t = "") => `${e.toLocaleString("en-US")} ${t}${e === 1 ? "invoice" :
 	noOpenInvoices: "No open invoices",
 	noOpenInvoicesInCurrency: (e) => `No open ${e} invoices`,
 	openInvoiceCount: (e) => t(e, "open "),
-	overdueSummary: (e, n) => `${e} overdue · ${t(n)}`,
+	overdueAmount: (e) => `${e} overdue`,
+	overdueInvoiceCount: (e) => ` · ${t(e)}`,
 	overdueDescription: (e, n) => `${e} overdue across ${t(n)}`,
 	accessibleName: ({ title: e, value: t, detail: n, action: r }) => `${e}, ${t}, ${n}. ${r}.`
 };

package/dist/libs/tesouro-embedded-components-react/shared/feature/dist/lib/analytics/build-info.js

@@ -1,5 +1,5 @@
 // ../../libs/tesouro-embedded-components-react/shared/feature/dist/lib/analytics/build-info.js
-var e = "@tesouro/embedded-components-react", t = "0.11.14", n = "37fc2003ec693b516d4055ee9523ffa1821e586b", r = Object.freeze({
+var e = "@tesouro/embedded-components-react", t = "0.11.17", n = "6e5e635a91c9de25e8da7214a9a83a4bac240f08", r = Object.freeze({
 	library_name: e,
 	library_version: t,
 	library_sha: n

package/dist/libs/tesouro-embedded-components-react/shared/quick-view/ui/dist/index3.js

@@ -10,7 +10,10 @@ function u({ title: u, value: d, subtext: f, subtextTone: p = "muted", linkText:
 	let w = {
 		...i,
 		...b
-	}, T = !!h && !_ && !v, E = /* @__PURE__ */ s("span", {
+	}, T = typeof f == "string" ? f ? [{
+		text: f,
+		tone: p
+	}] : [] : f ?? [], E = !!h && !_ && !v, D = /* @__PURE__ */ s("span", {
 		className: "ttw:flex ttw:items-center ttw:justify-between ttw:gap-2",
 		children: [/* @__PURE__ */ o(t, {
 			component: "span",
@@ -18,7 +21,7 @@ function u({ title: u, value: d, subtext: f, subtextTone: p = "muted", linkText:
 			color: "muted",
 			className: "ttw:font-semibold",
 			children: u
-		}), T ? /* @__PURE__ */ o(c, {
+		}), E ? /* @__PURE__ */ o(c, {
 			className: "ttw:size-4 ttw:shrink-0 ttw:text-muted-foreground",
 			"aria-hidden": !0
 		}) : null]
@@ -27,7 +30,7 @@ function u({ title: u, value: d, subtext: f, subtextTone: p = "muted", linkText:
 		className: n(l, S),
 		style: C,
 		"data-testid": x?.tile,
-		children: [E, /* @__PURE__ */ s("div", {
+		children: [D, /* @__PURE__ */ s("div", {
 			role: "status",
 			"aria-busy": !0,
 			className: "ttw:flex ttw:flex-col ttw:gap-2",
@@ -54,7 +57,7 @@ function u({ title: u, value: d, subtext: f, subtextTone: p = "muted", linkText:
 		className: n(l, S),
 		style: C,
 		"data-testid": x?.tile,
-		children: [E, /* @__PURE__ */ o(r, {
+		children: [D, /* @__PURE__ */ o(r, {
 			title: w.loadErrorTitle,
 			retryLabel: w.loadErrorRetry,
 			onRetry: y,
@@ -62,39 +65,42 @@ function u({ title: u, value: d, subtext: f, subtextTone: p = "muted", linkText:
 			testId: x?.error
 		})]
 	});
-	let D = /* @__PURE__ */ s(a, { children: [
-		E,
+	let O = /* @__PURE__ */ s(a, { children: [
+		D,
 		/* @__PURE__ */ o(t, {
 			component: "span",
 			variant: "h6",
 			className: "ttw:block ttw:text-3xl ttw:font-semibold ttw:leading-tight",
 			children: d
 		}),
-		f ? /* @__PURE__ */ o(t, {
-			component: "span",
-			variant: "body2",
-			color: p,
-			className: n("ttw:block", p !== "muted" && "ttw:font-medium"),
-			children: f
+		T.length > 0 ? /* @__PURE__ */ o("span", {
+			className: "ttw:block ttw:text-sm ttw:leading-6",
+			children: T.map(({ text: e, tone: r = "muted" }, i) => /* @__PURE__ */ o(t, {
+				component: "span",
+				variant: "body2",
+				color: r,
+				className: n(r !== "muted" && "ttw:font-medium"),
+				children: e
+			}, i))
 		}) : null,
-		T && m ? /* @__PURE__ */ o("span", {
+		E && m ? /* @__PURE__ */ o("span", {
 			className: "ttw:mt-3 ttw:text-sm ttw:font-medium ttw:text-primary ttw:group-hover:underline",
 			children: m
 		}) : null
 	] });
-	return T ? /* @__PURE__ */ o("button", {
+	return E ? /* @__PURE__ */ o("button", {
 		type: "button",
 		onClick: h,
 		"aria-label": g,
 		"data-testid": x?.tile,
 		style: C,
 		className: n(l, "ttw:group ttw:cursor-pointer ttw:transition-colors ttw:hover:bg-accent/40 ttw:focus-visible:outline-none ttw:focus-visible:ring-2 ttw:focus-visible:ring-ring ttw:focus-visible:ring-offset-2", S),
-		children: D
+		children: O
 	}) : /* @__PURE__ */ o("div", {
 		className: n(l, S),
 		style: C,
 		"data-testid": x?.tile,
-		children: D
+		children: O
 	});
 }
 export { u as QuickViewTile };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tesouro/embedded-components-react",
-  "version": "0.11.14",
+  "version": "0.11.17",
   "license": "Apache-2.0",
   "type": "module",
   "sideEffects": [