@tesouro/embedded-components-react 0.2.252 → 0.2.254

package/dist/libs/tesouro-embedded-components-react/shared/feature/dist/lib/WidgetProvider/RootWidgetProvider.js

@@ -1,3 +1,7 @@
+"use client";
+"use client";
+"use client";
+"use client";
 import { registerQueryClient as e, unregisterQueryClient as t } from "../../../../data-access/dist/lib/clientRegistry.js";
 import { createEmbeddedClient as ee } from "../../../../data-access/dist/lib/createEmbeddedClient.js";
 import { EmbedApiProvider as n } from "../../../../data-access/dist/lib/EmbedApiContext.js";

package/dist/libs/tesouro-embedded-components-react/shared/feature/dist/lib/WidgetProvider/WidgetProvider.js

@@ -1,3 +1,7 @@
+"use client";
+"use client";
+"use client";
+"use client";
 import { registerQueryClient as e, unregisterQueryClient as t } from "../../../../data-access/dist/lib/clientRegistry.js";
 import { createEmbeddedClient as n } from "../../../../data-access/dist/lib/createEmbeddedClient.js";
 import { EmbedApiProvider as ee, useEmbedApi as te } from "../../../../data-access/dist/lib/EmbedApiContext.js";

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

@@ -1,5 +1,5 @@
 //#region ../../libs/tesouro-embedded-components-react/shared/feature/dist/lib/analytics/build-info.js
-var e = "@tesouro/embedded-components-react", t = "0.2.252", n = "564dda023d90103959a7f30ad006c2dbdfeb4f44", r = Object.freeze({
+var e = "@tesouro/embedded-components-react", t = "0.2.254", n = "c1c7c5e52df18c550e730176711a1949f6c73ea5", r = Object.freeze({
 	library_name: e,
 	library_version: t,
 	library_sha: n

package/dist/libs/tesouro-embedded-components-react/shared/ui/dist/lib/UIContext/UIProvider.js

@@ -1,3 +1,7 @@
+"use client";
+"use client";
+"use client";
+"use client";
 import { DefaultLinkComponent as e, UIContext as t, resolveUIFramework as n } from "./UIContext.js";
 import { useContext as r, useMemo as i } from "react";
 import { jsx as a } from "react/jsx-runtime";

package/dist/libs/tesouro-embedded-components-react/widget-suite/feature/dist/index.js

@@ -1,3 +1,6 @@
-import { WidgetSuiteStyleProbe as e } from "../../ui/dist/index3.js";
+import { WIDGET_SUITE_SECTION_LABELS_EN as e } from "./index3.js";
+import { WidgetSuiteSectionId as t } from "./index4.js";
+import { WIDGET_SUITE_SHELL_LABELS_EN as n } from "../../ui/dist/index2.js";
 import "../../ui/dist/index.js";
-export { e as WidgetSuiteStyleProbe };
+import { WidgetSuite as r } from "./index5.js";
+export { e as WIDGET_SUITE_SECTION_LABELS_EN, n as WIDGET_SUITE_SHELL_LABELS_EN, r as WidgetSuite, t as WidgetSuiteSectionId };

package/dist/libs/tesouro-embedded-components-react/widget-suite/feature/dist/index2.js

@@ -0,0 +1,4 @@
+//#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index2.js
+var e = { Mounted: "widget_suite.mounted" }, t = "widget_suite";
+//#endregion
+export { t as WIDGET_NAME, e as WidgetSuiteAnalyticsEvent };

package/dist/libs/tesouro-embedded-components-react/widget-suite/feature/dist/index3.js

@@ -0,0 +1,8 @@
+//#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index3.js
+var e = {
+	accounts: "Accounts",
+	cards: "Cards",
+	settings: "Settings"
+};
+//#endregion
+export { e as WIDGET_SUITE_SECTION_LABELS_EN };

package/dist/libs/tesouro-embedded-components-react/widget-suite/feature/dist/index4.js

@@ -0,0 +1,34 @@
+"use client";
+"use client";
+"use client";
+"use client";
+import { hasAnyScope as e } from "../../../shared/data-access/dist/lib/hasAnyScope.js";
+import { Scope as t } from "../../../shared/data-access/dist/lib/scopes.js";
+import "../../../shared/data-access/dist/index.js";
+import { CardProgram as n } from "../../../shared/feature/dist/lib/card/cardProgram.js";
+import "../../../shared/feature/dist/index.js";
+import { BankAccountsWidget as r } from "../../../bank-accounts-widget/feature/dist/index8.js";
+import "../../../bank-accounts-widget/feature/dist/index.js";
+import { CardsWidget as i } from "../../../cards-widget/feature/dist/index8.js";
+import "../../../cards-widget/feature/dist/index.js";
+import { SettingsWidget as a } from "../../../settings-widget/feature/dist/index5.js";
+import "../../../settings-widget/feature/dist/index.js";
+import { jsx as o } from "react/jsx-runtime";
+//#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index4.js
+var s = {
+	Accounts: "accounts",
+	Cards: "cards",
+	Settings: "settings"
+}, c = {
+	[s.Accounts]: {
+		anyOfScopes: [t.BankAccountReadOrg, t.ExternalBankAccountReadOrg],
+		render: () => /* @__PURE__ */ o(r, {})
+	},
+	[s.Cards]: {
+		anyOfScopes: [t.CreditCardReadOrg, t.DebitCardReadOrg],
+		render: (r) => /* @__PURE__ */ o(i, { cardProgram: e(r, [t.CreditCardReadOrg]) ? n.Credit : n.Debit })
+	},
+	[s.Settings]: { render: () => /* @__PURE__ */ o(a, {}) }
+};
+//#endregion
+export { c as WIDGET_SUITE_SECTIONS, s as WidgetSuiteSectionId };

package/dist/libs/tesouro-embedded-components-react/widget-suite/feature/dist/index5.js

@@ -0,0 +1,59 @@
+"use client";
+"use client";
+"use client";
+"use client";
+import { hasAnyScope as e } from "../../../shared/data-access/dist/lib/hasAnyScope.js";
+import "../../../shared/data-access/dist/index.js";
+import { useAnalyticsTrack as t } from "../../../shared/feature/dist/lib/analytics/hooks.js";
+import { WidgetProvider as n } from "../../../shared/feature/dist/lib/WidgetProvider/WidgetProvider.js";
+import { useWidgetConfig as r } from "../../../shared/feature/dist/lib/WidgetProvider/hooks.js";
+import "../../../shared/feature/dist/index.js";
+import { WIDGET_SUITE_SECTION_LABELS_EN as i } from "./index3.js";
+import { WIDGET_SUITE_SECTIONS as a } from "./index4.js";
+import { WIDGET_NAME as o, WidgetSuiteAnalyticsEvent as s } from "./index2.js";
+import { WidgetSuiteShell as c } from "../../ui/dist/index3.js";
+import "../../ui/dist/index.js";
+import { useEffect as l, useState as u } from "react";
+import { jsx as d } from "react/jsx-runtime";
+//#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index5.js
+function f({ sections: n, labels: o, sectionLabels: f }) {
+	let p = t();
+	l(() => {
+		p(s.Mounted);
+	}, [p]);
+	let m = {
+		...i,
+		...f
+	}, { initResponse: h } = r(), g = h?.scopes, _ = n.flatMap((t) => {
+		let n = a[t];
+		return !n || n.anyOfScopes && !e(g, n.anyOfScopes) ? [] : [{
+			id: t,
+			label: m[t],
+			content: n.render(g)
+		}];
+	}), [v, y] = u(n[0] ?? ""), b = _.some((e) => e.id === v) ? v : _[0]?.id ?? "";
+	return /* @__PURE__ */ d(c, {
+		sections: _,
+		selectedSectionId: b,
+		onSectionChange: y,
+		labels: o
+	});
+}
+function p({ baseUrl: e, widgetToken: t, organizationId: r, configClient: i, linkComponent: a, implementation: s, uiFramework: c, errorFallback: l, onError: u, analytics: p, ...m }) {
+	return /* @__PURE__ */ d(n, {
+		widgetName: o,
+		baseUrl: e,
+		widgetToken: t,
+		organizationId: r,
+		configClient: i,
+		linkComponent: a,
+		implementation: s,
+		uiFramework: c,
+		errorFallback: l,
+		onError: u,
+		analytics: p,
+		children: /* @__PURE__ */ d(f, { ...m })
+	});
+}
+//#endregion
+export { p as WidgetSuite, p as default };

package/dist/libs/tesouro-embedded-components-react/widget-suite/ui/dist/index.js

@@ -1,3 +1,3 @@
-import "./index2.js";
-import { WidgetSuiteStyleProbe as e } from "./index3.js";
-export { e as WidgetSuiteStyleProbe };
+import { WIDGET_SUITE_SHELL_LABELS_EN as e } from "./index2.js";
+import { WidgetSuiteShell as t } from "./index3.js";
+export { e as WIDGET_SUITE_SHELL_LABELS_EN, t as WidgetSuiteShell };

package/dist/libs/tesouro-embedded-components-react/widget-suite/ui/dist/index2.js

@@ -1,7 +1,10 @@
 //#region ../../libs/tesouro-embedded-components-react/widget-suite/ui/dist/index2.js
 var e = {
-	title: "Widget suite styling is wired",
-	body: "This box is 364px tall and uses theme tokens. If it is unstyled, this library is missing from the generated Tailwind @source block."
+	navAriaLabel: "Sections",
+	emptyState: {
+		title: "Nothing available here",
+		body: "This account doesn't have access to any of this page's sections."
+	}
 };
 //#endregion
-export { e as WIDGET_SUITE_STYLE_PROBE_LABELS_EN };
+export { e as WIDGET_SUITE_SHELL_LABELS_EN };

package/dist/libs/tesouro-embedded-components-react/widget-suite/ui/dist/index3.js

@@ -1,25 +1,77 @@
-import { Typography as e } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
-import { WIDGET_SUITE_STYLE_PROBE_LABELS_EN as t } from "./index2.js";
-import { useMemo as n } from "react";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
+"use client";
+"use client";
+"use client";
+"use client";
+import { Typography as e, cn as t } from "../../../../../packages/shared-ui-shadcn/dist/index.js";
+import { WIDGET_SUITE_SHELL_LABELS_EN as n } from "./index2.js";
+import { useRef as r } from "react";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
 //#region ../../libs/tesouro-embedded-components-react/widget-suite/ui/dist/index3.js
-var a = ({ labels: a }) => {
-	let o = n(() => ({
-		...t,
-		...a
-	}), [a]);
-	return /* @__PURE__ */ i("div", {
-		"data-testid": "widget-suite-style-probe",
-		className: "ttw:flex ttw:min-h-[364px] ttw:flex-col ttw:items-center ttw:justify-center ttw:gap-2 ttw:rounded-lg ttw:border ttw:border-border ttw:bg-muted ttw:p-6 ttw:text-center",
-		children: [/* @__PURE__ */ r(e, {
+function o({ sections: o, selectedSectionId: s, onSectionChange: c, labels: l }) {
+	let u = {
+		...n,
+		...l,
+		emptyState: {
+			...n.emptyState,
+			...l?.emptyState
+		}
+	}, d = r([]), f = o.find((e) => e.id === s), p = (e, t) => {
+		let n = o.length - 1, r;
+		switch (e.key) {
+			case "ArrowRight":
+				r = t === n ? 0 : t + 1;
+				break;
+			case "ArrowLeft":
+				r = t === 0 ? n : t - 1;
+				break;
+			case "Home":
+				r = 0;
+				break;
+			case "End":
+				r = n;
+				break;
+			default: return;
+		}
+		e.preventDefault(), d.current[r]?.focus();
+	};
+	return o.length === 0 ? /* @__PURE__ */ a("section", {
+		className: "ttw:flex ttw:w-full ttw:flex-col ttw:items-center ttw:justify-center ttw:gap-2 ttw:rounded-lg ttw:border ttw:border-border ttw:p-10 ttw:text-center",
+		children: [/* @__PURE__ */ i(e, {
 			variant: "h5",
-			children: o.title
-		}), /* @__PURE__ */ r(e, {
+			children: u.emptyState.title
+		}), /* @__PURE__ */ i(e, {
 			variant: "body2",
 			color: "muted",
-			children: o.body
+			children: u.emptyState.body
+		})]
+	}) : /* @__PURE__ */ a("section", {
+		className: "ttw:flex ttw:w-full ttw:flex-col ttw:gap-6",
+		children: [/* @__PURE__ */ i("nav", {
+			"aria-label": u.navAriaLabel,
+			children: /* @__PURE__ */ i("ul", {
+				className: "ttw:flex ttw:flex-wrap ttw:items-center ttw:gap-1 ttw:border-b ttw:border-border",
+				children: o.map((e, n) => {
+					let r = e.id === s;
+					return /* @__PURE__ */ i("li", { children: /* @__PURE__ */ i("button", {
+						type: "button",
+						ref: (e) => {
+							d.current[n] = e;
+						},
+						"aria-current": r ? "page" : void 0,
+						onClick: () => c(e.id),
+						onKeyDown: (e) => p(e, n),
+						className: t("ttw:-mb-px ttw:cursor-pointer ttw:border-b-2 ttw:px-4 ttw:py-2.5 ttw:text-sm ttw:font-medium ttw:whitespace-nowrap ttw:focus-visible:outline-2 ttw:focus-visible:outline-offset-2 ttw:focus-visible:outline-ring", r ? "ttw:border-primary ttw:text-primary" : "ttw:border-transparent ttw:text-muted-foreground ttw:hover:border-border ttw:hover:text-foreground"),
+						children: e.label
+					}) }, e.id);
+				})
+			})
+		}), /* @__PURE__ */ i("div", {
+			role: "region",
+			"aria-label": f?.label,
+			className: "ttw:min-h-[432px] ttw:min-w-0",
+			children: f?.content
 		})]
 	});
-};
+}
 //#endregion
-export { a as WidgetSuiteStyleProbe };
+export { o as WidgetSuiteShell };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tesouro/embedded-components-react",
-  "version": "0.2.252",
+  "version": "0.2.254",
   "license": "Apache-2.0",
   "type": "module",
   "packageDepSync": {

package/dist/libs/tesouro-embedded-components-react/settings-widget/ui/dist/index4.js

@@ -1,2 +0,0 @@
-import "./index2.js";
-import "./index3.js";