@tesouro/embedded-components-react 0.2.286 → 0.2.288

package/dist/experimental/WidgetSuite.d.ts

@@ -739,6 +739,110 @@ declare const WIDGET_SUITE_SECTION_TITLE_LABELS_EN: WidgetSuiteSectionTitleLabel
 declare const WIDGET_SUITE_CONTENT_LABELS_EN: WidgetSuiteContentLabels;
 declare const WIDGET_SUITE_DISCLOSURE_LABELS_EN: WidgetSuiteDisclosureLabels;
 
+interface CardsWidgetPaginationInput {
+    paginationToken?: string;
+    pageSize?: number;
+}
+
+/**
+ * The sections this widget renders itself. These ids are the public vocabulary
+ * a host uses to deep-link into a section, so they are part of the package's
+ * API surface — renaming one is a breaking change.
+ */
+declare const SettingsSection: {
+    readonly Profile: "profile";
+    readonly Team: "team";
+    readonly Invoice: "invoice";
+    readonly Expense: "expense";
+    readonly BillPay: "bill-pay";
+    readonly Accounting: "accounting";
+    readonly Tags: "tags";
+    readonly Help: "help";
+};
+type SettingsSection = (typeof SettingsSection)[keyof typeof SettingsSection];
+/**
+ * A selectable section id: one of the built-ins, or the id of a host-supplied
+ * {@link SettingsWidgetAdditionalSection}. The `string & {}` arm keeps the
+ * built-in literals visible to editor autocomplete while still accepting a
+ * host's own id.
+ */
+type SettingsWidgetSectionId = SettingsSection | (string & {});
+
+interface WidgetSuiteAccountsSelection {
+    /** The account whose details are open. `null` is the list. */
+    accountId?: string | null;
+}
+interface WidgetSuiteCardsSelection {
+    /** The card whose details panel is open. `null` closes it. */
+    cardId?: string | null;
+    /**
+     * The list's cursor and page size. Forwarded to the widget's own `pagination`
+     * and `defaultPagination`, so the suite holds no cursor of its own: leaving
+     * the section and coming back restarts the walk unless a host drives it.
+     */
+    pagination?: CardsWidgetPaginationInput;
+}
+interface WidgetSuiteSettingsSelection {
+    /**
+     * The settings section on screen. Controlled only: the suite never supplies a
+     * value of its own, because `SettingsWidget` substitutes another section when
+     * this one is not available to the user and reports nothing when it does
+     * (EMBD-4980 adds the `defaultSelectedSection` that would make an initial
+     * value safe).
+     */
+    section?: SettingsWidgetSectionId;
+}
+/**
+ * Where the suite is pointed, grouped by section.
+ *
+ * One object rather than a prop per key: it is the value a host mirrors into its
+ * URL, and it groups the same way `contentLabels` does. Every key resolves
+ * independently, so `selection={{ section: 'accounts' }}` drives the menu and
+ * leaves the account to `defaultSelection`.
+ *
+ * Credit and debit cards get separate groups because the Cards section mounts
+ * two `CardsWidget` instances against two endpoints, so one card id cannot
+ * address both. There is no `invoicing` group: that section renders the Monite
+ * `<Receivables />`, whose tab is internal state (EMBD-2171 replaces it,
+ * EMBD-4979 makes the native tab controllable).
+ */
+interface WidgetSuiteSelection {
+    section?: WidgetSuiteSectionId;
+    accounts?: WidgetSuiteAccountsSelection;
+    creditCards?: WidgetSuiteCardsSelection;
+    debitCards?: WidgetSuiteCardsSelection;
+    settings?: WidgetSuiteSettingsSelection;
+}
+/**
+ * Where the suite can *open*, which is not everything it can be driven to:
+ * `SettingsWidget` takes no initial section, so naming one here would be a
+ * silent no-op (EMBD-4980 adds the prop that makes it work).
+ *
+ * Derived rather than hand-written, so each key stays in exactly one of the two
+ * types as the widgets behind them gain the props they are missing.
+ */
+type WidgetSuiteDefaultSelection = Omit<WidgetSuiteSelection, 'settings'>;
+interface WidgetSuiteCardsSelectionSnapshot {
+    cardId: string | null;
+    pagination: CardsWidgetPaginationInput | undefined;
+}
+/**
+ * The selection as the suite reports it: every key carries a value, so a host
+ * reading one needs no optional chaining. Assignable to
+ * {@link WidgetSuiteSelection}, so a host can hand a snapshot straight back.
+ */
+interface WidgetSuiteSelectionSnapshot {
+    section: WidgetSuiteSectionId | undefined;
+    accounts: {
+        accountId: string | null;
+    };
+    creditCards: WidgetSuiteCardsSelectionSnapshot;
+    debitCards: WidgetSuiteCardsSelectionSnapshot;
+    settings: {
+        section: SettingsWidgetSectionId | undefined;
+    };
+}
+
 interface WidgetSuiteProps extends WidgetProviderProps {
     /**
      * Which sections the suite offers, in menu order.
@@ -753,6 +857,34 @@ interface WidgetSuiteProps extends WidgetProviderProps {
      * this is the host's ceiling rather than a promise of what renders.
      */
     sections: readonly WidgetSuiteSectionId[];
+    /**
+     * Where the suite is pointed, for a host that owns navigation — a URL, a
+     * router, its own state. Every key resolves on its own, so driving one leaves
+     * the rest to the suite.
+     *
+     * A key here puts the widget behind it in controlled mode for the lifetime of
+     * the mount, so supply it with `onSelectionChange` or the surface will not
+     * move when the user clicks.
+     */
+    selection?: WidgetSuiteSelection;
+    /**
+     * Where the suite opens, for a host that wants a deep link but not ownership.
+     * Read once per mount, and ignored per key when `selection` names that key.
+     *
+     * Carries every key `selection` does bar `settings` — see
+     * {@link WidgetSuiteDefaultSelection}.
+     */
+    defaultSelection?: WidgetSuiteDefaultSelection;
+    /**
+     * The whole selection after a person moved the suite: a menu click, a row, a
+     * card, a settings tab, a page of a card list. Every key carries a value, and
+     * the object can be handed straight back as `selection`.
+     *
+     * Never fired for the entitlement fallback, and never fired on mount, so a
+     * host mirroring this into its URL cannot overwrite the deep link it was just
+     * handed. A move that touches two keys reports once.
+     */
+    onSelectionChange?: (selection: WidgetSuiteSelectionSnapshot) => void;
     /** Overrides for the shell's own copy — the nav landmark name, empty state. */
     labels?: PartialDeep<WidgetSuiteShellLabels>;
     /** Overrides for the section names in the menu. */
@@ -779,8 +911,8 @@ interface WidgetSuiteProps extends WidgetProviderProps {
      * heading reads as a fragment of someone else's. Set `false` when the host
      * already renders a heading of its own above the suite.
      *
-     * Sections whose widget heads itself (Accounts, Settings) never get one, at
-     * any setting — see `rendersOwnTitle` in `sections.tsx`.
+     * Sections whose widget heads itself (Accounts, Cards, Settings) never get
+     * one, at any setting — see `rendersOwnTitle` in `sections.tsx`.
      */
     showSectionTitle?: boolean;
 }
@@ -801,15 +933,17 @@ interface WidgetSuiteProps extends WidgetProviderProps {
  * init fails before answering the disclosure flags, the acceptance surface
  * alone when the session owes the bank's disclosures, or the nav over its
  * sections. States rather than an overlay over a mounted shell — see
- * `WidgetSuiteInner` for why each boundary sits where it does.
+ * `WidgetSuiteSurface` for why each boundary sits where it does.
  *
- * The active section is held here rather than taken as a prop, matching
- * `BillPayWidgetNative` and `SettingsWidget`. A host-controlled
- * `selectedSectionId` / `onSectionChange` pair is the natural next step for
- * deep-linking, and is deliberately not invented on an experimental export
- * before a host asks for it.
+ * Navigation is one `selection` object a host can drive key by key, published to
+ * the sections through `WidgetSuiteProvider`. Only the open panel is mounted, so
+ * a key the suite holds survives leaving a section and coming back and a key it
+ * does not hold is lost: today Accounts remembers its open account and Cards its
+ * open card, while Bill Pay forgets its tab, Settings its section and each card
+ * list its cursor. That split is the widgets' current shape rather than a
+ * decision — see `WidgetSuiteSelection` for the ticket behind each gap.
  */
 declare function WidgetSuite({ baseUrl, widgetToken, organizationId, configClient, gatewayRouting, linkComponent, implementation, uiFramework, errorFallback, onError, analytics, disclosuresAcceptance, ...innerProps }: WidgetSuiteProps): React.JSX.Element;
 
 export { WIDGET_SUITE_CONTENT_LABELS_EN, WIDGET_SUITE_DEFAULT_SECTIONS, WIDGET_SUITE_DISCLOSURE_LABELS_EN, WIDGET_SUITE_SECTION_LABELS_EN, WIDGET_SUITE_SECTION_TITLE_LABELS_EN, WIDGET_SUITE_SHELL_LABELS_EN, WidgetSuite, WidgetSuiteSectionId };
-export type { PartialDeep, WidgetSuiteContentLabels, WidgetSuiteDisclosureLabels, WidgetSuiteProps, WidgetSuiteSectionLabels, WidgetSuiteSectionTitleLabels, WidgetSuiteShellLabels };
+export type { PartialDeep, WidgetSuiteAccountsSelection, WidgetSuiteCardsSelection, WidgetSuiteCardsSelectionSnapshot, WidgetSuiteContentLabels, WidgetSuiteDefaultSelection, WidgetSuiteDisclosureLabels, WidgetSuiteProps, WidgetSuiteSectionLabels, WidgetSuiteSectionTitleLabels, WidgetSuiteSelection, WidgetSuiteSelectionSnapshot, WidgetSuiteSettingsSelection, WidgetSuiteShellLabels };

package/dist/experimental/WidgetSuite.js

@@ -1,6 +1,6 @@
 import { WIDGET_SUITE_CONTENT_LABELS_EN as e, WIDGET_SUITE_DISCLOSURE_LABELS_EN as t, WIDGET_SUITE_SECTION_LABELS_EN as n, WIDGET_SUITE_SECTION_TITLE_LABELS_EN as r } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index4.js";
-import { WIDGET_SUITE_DEFAULT_SECTIONS as i, WidgetSuiteSectionId as a } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index5.js";
+import { WIDGET_SUITE_DEFAULT_SECTIONS as i, WidgetSuiteSectionId as a } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index7.js";
 import { WIDGET_SUITE_SHELL_LABELS_EN as o } from "../libs/tesouro-embedded-components-react/widget-suite/ui/dist/index2.js";
-import { WidgetSuite as s } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index6.js";
+import { WidgetSuite as s } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index8.js";
 import "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index.js";
 export { e as WIDGET_SUITE_CONTENT_LABELS_EN, i as WIDGET_SUITE_DEFAULT_SECTIONS, t as WIDGET_SUITE_DISCLOSURE_LABELS_EN, n as WIDGET_SUITE_SECTION_LABELS_EN, r as WIDGET_SUITE_SECTION_TITLE_LABELS_EN, o as WIDGET_SUITE_SHELL_LABELS_EN, s as WidgetSuite, a as WidgetSuiteSectionId };

package/dist/experimental/index.d.ts

@@ -739,6 +739,110 @@ declare const WIDGET_SUITE_SECTION_TITLE_LABELS_EN: WidgetSuiteSectionTitleLabel
 declare const WIDGET_SUITE_CONTENT_LABELS_EN: WidgetSuiteContentLabels;
 declare const WIDGET_SUITE_DISCLOSURE_LABELS_EN: WidgetSuiteDisclosureLabels;
 
+interface CardsWidgetPaginationInput {
+    paginationToken?: string;
+    pageSize?: number;
+}
+
+/**
+ * The sections this widget renders itself. These ids are the public vocabulary
+ * a host uses to deep-link into a section, so they are part of the package's
+ * API surface — renaming one is a breaking change.
+ */
+declare const SettingsSection: {
+    readonly Profile: "profile";
+    readonly Team: "team";
+    readonly Invoice: "invoice";
+    readonly Expense: "expense";
+    readonly BillPay: "bill-pay";
+    readonly Accounting: "accounting";
+    readonly Tags: "tags";
+    readonly Help: "help";
+};
+type SettingsSection = (typeof SettingsSection)[keyof typeof SettingsSection];
+/**
+ * A selectable section id: one of the built-ins, or the id of a host-supplied
+ * {@link SettingsWidgetAdditionalSection}. The `string & {}` arm keeps the
+ * built-in literals visible to editor autocomplete while still accepting a
+ * host's own id.
+ */
+type SettingsWidgetSectionId = SettingsSection | (string & {});
+
+interface WidgetSuiteAccountsSelection {
+    /** The account whose details are open. `null` is the list. */
+    accountId?: string | null;
+}
+interface WidgetSuiteCardsSelection {
+    /** The card whose details panel is open. `null` closes it. */
+    cardId?: string | null;
+    /**
+     * The list's cursor and page size. Forwarded to the widget's own `pagination`
+     * and `defaultPagination`, so the suite holds no cursor of its own: leaving
+     * the section and coming back restarts the walk unless a host drives it.
+     */
+    pagination?: CardsWidgetPaginationInput;
+}
+interface WidgetSuiteSettingsSelection {
+    /**
+     * The settings section on screen. Controlled only: the suite never supplies a
+     * value of its own, because `SettingsWidget` substitutes another section when
+     * this one is not available to the user and reports nothing when it does
+     * (EMBD-4980 adds the `defaultSelectedSection` that would make an initial
+     * value safe).
+     */
+    section?: SettingsWidgetSectionId;
+}
+/**
+ * Where the suite is pointed, grouped by section.
+ *
+ * One object rather than a prop per key: it is the value a host mirrors into its
+ * URL, and it groups the same way `contentLabels` does. Every key resolves
+ * independently, so `selection={{ section: 'accounts' }}` drives the menu and
+ * leaves the account to `defaultSelection`.
+ *
+ * Credit and debit cards get separate groups because the Cards section mounts
+ * two `CardsWidget` instances against two endpoints, so one card id cannot
+ * address both. There is no `invoicing` group: that section renders the Monite
+ * `<Receivables />`, whose tab is internal state (EMBD-2171 replaces it,
+ * EMBD-4979 makes the native tab controllable).
+ */
+interface WidgetSuiteSelection {
+    section?: WidgetSuiteSectionId;
+    accounts?: WidgetSuiteAccountsSelection;
+    creditCards?: WidgetSuiteCardsSelection;
+    debitCards?: WidgetSuiteCardsSelection;
+    settings?: WidgetSuiteSettingsSelection;
+}
+/**
+ * Where the suite can *open*, which is not everything it can be driven to:
+ * `SettingsWidget` takes no initial section, so naming one here would be a
+ * silent no-op (EMBD-4980 adds the prop that makes it work).
+ *
+ * Derived rather than hand-written, so each key stays in exactly one of the two
+ * types as the widgets behind them gain the props they are missing.
+ */
+type WidgetSuiteDefaultSelection = Omit<WidgetSuiteSelection, 'settings'>;
+interface WidgetSuiteCardsSelectionSnapshot {
+    cardId: string | null;
+    pagination: CardsWidgetPaginationInput | undefined;
+}
+/**
+ * The selection as the suite reports it: every key carries a value, so a host
+ * reading one needs no optional chaining. Assignable to
+ * {@link WidgetSuiteSelection}, so a host can hand a snapshot straight back.
+ */
+interface WidgetSuiteSelectionSnapshot {
+    section: WidgetSuiteSectionId | undefined;
+    accounts: {
+        accountId: string | null;
+    };
+    creditCards: WidgetSuiteCardsSelectionSnapshot;
+    debitCards: WidgetSuiteCardsSelectionSnapshot;
+    settings: {
+        section: SettingsWidgetSectionId | undefined;
+    };
+}
+
 interface WidgetSuiteProps extends WidgetProviderProps {
     /**
      * Which sections the suite offers, in menu order.
@@ -753,6 +857,34 @@ interface WidgetSuiteProps extends WidgetProviderProps {
      * this is the host's ceiling rather than a promise of what renders.
      */
     sections: readonly WidgetSuiteSectionId[];
+    /**
+     * Where the suite is pointed, for a host that owns navigation — a URL, a
+     * router, its own state. Every key resolves on its own, so driving one leaves
+     * the rest to the suite.
+     *
+     * A key here puts the widget behind it in controlled mode for the lifetime of
+     * the mount, so supply it with `onSelectionChange` or the surface will not
+     * move when the user clicks.
+     */
+    selection?: WidgetSuiteSelection;
+    /**
+     * Where the suite opens, for a host that wants a deep link but not ownership.
+     * Read once per mount, and ignored per key when `selection` names that key.
+     *
+     * Carries every key `selection` does bar `settings` — see
+     * {@link WidgetSuiteDefaultSelection}.
+     */
+    defaultSelection?: WidgetSuiteDefaultSelection;
+    /**
+     * The whole selection after a person moved the suite: a menu click, a row, a
+     * card, a settings tab, a page of a card list. Every key carries a value, and
+     * the object can be handed straight back as `selection`.
+     *
+     * Never fired for the entitlement fallback, and never fired on mount, so a
+     * host mirroring this into its URL cannot overwrite the deep link it was just
+     * handed. A move that touches two keys reports once.
+     */
+    onSelectionChange?: (selection: WidgetSuiteSelectionSnapshot) => void;
     /** Overrides for the shell's own copy — the nav landmark name, empty state. */
     labels?: PartialDeep<WidgetSuiteShellLabels>;
     /** Overrides for the section names in the menu. */
@@ -779,8 +911,8 @@ interface WidgetSuiteProps extends WidgetProviderProps {
      * heading reads as a fragment of someone else's. Set `false` when the host
      * already renders a heading of its own above the suite.
      *
-     * Sections whose widget heads itself (Accounts, Settings) never get one, at
-     * any setting — see `rendersOwnTitle` in `sections.tsx`.
+     * Sections whose widget heads itself (Accounts, Cards, Settings) never get
+     * one, at any setting — see `rendersOwnTitle` in `sections.tsx`.
      */
     showSectionTitle?: boolean;
 }
@@ -801,15 +933,17 @@ interface WidgetSuiteProps extends WidgetProviderProps {
  * init fails before answering the disclosure flags, the acceptance surface
  * alone when the session owes the bank's disclosures, or the nav over its
  * sections. States rather than an overlay over a mounted shell — see
- * `WidgetSuiteInner` for why each boundary sits where it does.
+ * `WidgetSuiteSurface` for why each boundary sits where it does.
  *
- * The active section is held here rather than taken as a prop, matching
- * `BillPayWidgetNative` and `SettingsWidget`. A host-controlled
- * `selectedSectionId` / `onSectionChange` pair is the natural next step for
- * deep-linking, and is deliberately not invented on an experimental export
- * before a host asks for it.
+ * Navigation is one `selection` object a host can drive key by key, published to
+ * the sections through `WidgetSuiteProvider`. Only the open panel is mounted, so
+ * a key the suite holds survives leaving a section and coming back and a key it
+ * does not hold is lost: today Accounts remembers its open account and Cards its
+ * open card, while Bill Pay forgets its tab, Settings its section and each card
+ * list its cursor. That split is the widgets' current shape rather than a
+ * decision — see `WidgetSuiteSelection` for the ticket behind each gap.
  */
 declare function WidgetSuite({ baseUrl, widgetToken, organizationId, configClient, gatewayRouting, linkComponent, implementation, uiFramework, errorFallback, onError, analytics, disclosuresAcceptance, ...innerProps }: WidgetSuiteProps): React.JSX.Element;
 
 export { WIDGET_SUITE_CONTENT_LABELS_EN, WIDGET_SUITE_DEFAULT_SECTIONS, WIDGET_SUITE_DISCLOSURE_LABELS_EN, WIDGET_SUITE_SECTION_LABELS_EN, WIDGET_SUITE_SECTION_TITLE_LABELS_EN, WIDGET_SUITE_SHELL_LABELS_EN, WidgetSuite, WidgetSuiteSectionId };
-export type { PartialDeep, WidgetSuiteContentLabels, WidgetSuiteDisclosureLabels, WidgetSuiteProps, WidgetSuiteSectionLabels, WidgetSuiteSectionTitleLabels, WidgetSuiteShellLabels };
+export type { PartialDeep, WidgetSuiteAccountsSelection, WidgetSuiteCardsSelection, WidgetSuiteCardsSelectionSnapshot, WidgetSuiteContentLabels, WidgetSuiteDefaultSelection, WidgetSuiteDisclosureLabels, WidgetSuiteProps, WidgetSuiteSectionLabels, WidgetSuiteSectionTitleLabels, WidgetSuiteSelection, WidgetSuiteSelectionSnapshot, WidgetSuiteSettingsSelection, WidgetSuiteShellLabels };

package/dist/experimental/index.js

@@ -1,6 +1,6 @@
 import { WIDGET_SUITE_CONTENT_LABELS_EN as e, WIDGET_SUITE_DISCLOSURE_LABELS_EN as t, WIDGET_SUITE_SECTION_LABELS_EN as n, WIDGET_SUITE_SECTION_TITLE_LABELS_EN as r } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index4.js";
-import { WIDGET_SUITE_DEFAULT_SECTIONS as i, WidgetSuiteSectionId as a } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index5.js";
+import { WIDGET_SUITE_DEFAULT_SECTIONS as i, WidgetSuiteSectionId as a } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index7.js";
 import { WIDGET_SUITE_SHELL_LABELS_EN as o } from "../libs/tesouro-embedded-components-react/widget-suite/ui/dist/index2.js";
-import { WidgetSuite as s } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index6.js";
+import { WidgetSuite as s } from "../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index8.js";
 import "./WidgetSuite.js";
 export { e as WIDGET_SUITE_CONTENT_LABELS_EN, i as WIDGET_SUITE_DEFAULT_SECTIONS, t as WIDGET_SUITE_DISCLOSURE_LABELS_EN, n as WIDGET_SUITE_SECTION_LABELS_EN, r as WIDGET_SUITE_SECTION_TITLE_LABELS_EN, o as WIDGET_SUITE_SHELL_LABELS_EN, s as WidgetSuite, a as WidgetSuiteSectionId };

package/dist/index.css

@@ -4489,8 +4489,8 @@
     outline-style: var(--tw-outline-style);
     outline-width: 2px;
   }
-  .ttw\:focus-visible\:outline-offset-2:focus-visible {
-    outline-offset: 2px;
+  .ttw\:focus-visible\:-outline-offset-2:focus-visible {
+    outline-offset: calc(2px * -1);
   }
   .ttw\:focus-visible\:outline-ring:focus-visible {
     outline-color: var(--ttw-ring);

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.286", n = "13d727fbf5445ff7c8e70597a9d993fcd25f0d77", r = Object.freeze({
+var e = "@tesouro/embedded-components-react", t = "0.2.288", n = "75f226753e2f5616b2725736a77388cbc3466f98", r = Object.freeze({
 	library_name: e,
 	library_version: t,
 	library_sha: n

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

@@ -1,6 +1,6 @@
 import { WIDGET_SUITE_CONTENT_LABELS_EN as e, WIDGET_SUITE_DISCLOSURE_LABELS_EN as t, WIDGET_SUITE_SECTION_LABELS_EN as n, WIDGET_SUITE_SECTION_TITLE_LABELS_EN as r } from "./index4.js";
-import { WIDGET_SUITE_DEFAULT_SECTIONS as i, WidgetSuiteSectionId as a } from "./index5.js";
+import { WIDGET_SUITE_DEFAULT_SECTIONS as i, WidgetSuiteSectionId as a } from "./index7.js";
 import { WIDGET_SUITE_SHELL_LABELS_EN as o } from "../../ui/dist/index2.js";
 import "../../ui/dist/index.js";
-import { WidgetSuite as s } from "./index6.js";
+import { WidgetSuite as s } from "./index8.js";
 export { e as WIDGET_SUITE_CONTENT_LABELS_EN, i as WIDGET_SUITE_DEFAULT_SECTIONS, t as WIDGET_SUITE_DISCLOSURE_LABELS_EN, n as WIDGET_SUITE_SECTION_LABELS_EN, r as WIDGET_SUITE_SECTION_TITLE_LABELS_EN, o as WIDGET_SUITE_SHELL_LABELS_EN, s as WidgetSuite, a as WidgetSuiteSectionId };

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

@@ -2,96 +2,89 @@
 "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 { BillPayWidget as i } from "../../../bill-pay-widget/feature/dist/index34.js";
-import "../../../bill-pay-widget/feature/dist/index.js";
-import { CardsWidget as a } from "../../../cards-widget/feature/dist/index8.js";
-import "../../../cards-widget/feature/dist/index.js";
-import { BalancesWidget as o } from "../../../balances-widget/feature/dist/index5.js";
-import "../../../balances-widget/feature/dist/index.js";
-import { InsightsWidget as s } from "../../../insights-widget/feature/dist/index11.js";
-import "../../../insights-widget/feature/dist/index.js";
-import { InvoicingWidget as c } from "../../../invoicing-widget/feature/dist/index3.js";
-import "../../../invoicing-widget/feature/dist/index.js";
-import { SettingsWidget as l } from "../../../settings-widget/feature/dist/index6.js";
-import "../../../settings-widget/feature/dist/index.js";
-import { TransfersWidget as u } from "../../../transfers-widget/feature/dist/index6.js";
-import "../../../transfers-widget/feature/dist/index.js";
-import { jsx as d, jsxs as f } from "react/jsx-runtime";
+import { useCallback as e, useMemo as t } from "react";
+import { useControllableState as n } from "@radix-ui/react-use-controllable-state";
 //#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index5.js
-var p = ({ children: e }) => /* @__PURE__ */ d("div", {
-	className: "ttw:rounded-md ttw:border ttw:border-dashed ttw:border-border ttw:p-8 ttw:text-sm ttw:text-muted-foreground",
-	children: e
-}), m = {
-	Dashboard: "dashboard",
-	Accounts: "accounts",
-	Cards: "cards",
-	Transfers: "transfers",
-	BillPay: "bill-pay",
-	Invoicing: "invoicing",
-	Expenses: "expenses",
-	Settings: "settings"
-}, h = [
-	m.Dashboard,
-	m.Accounts,
-	m.Cards,
-	m.Transfers,
-	m.BillPay,
-	m.Invoicing,
-	m.Expenses,
-	m.Settings
-], g = {
-	[m.Dashboard]: { render: ({ grantedScopes: n }) => {
-		let r = e(n, [t.BankAccountReadOrg]);
-		return /* @__PURE__ */ f("div", {
-			className: r ? "ttw:grid ttw:gap-4 ttw:md:grid-cols-2" : "ttw:grid ttw:gap-4",
-			children: [r && /* @__PURE__ */ d(o, {}), /* @__PURE__ */ d(s, {})]
-		});
-	} },
-	[m.Accounts]: {
-		anyOfScopes: [t.BankAccountReadOrg, t.ExternalBankAccountReadOrg],
-		rendersOwnTitle: !0,
-		render: () => /* @__PURE__ */ d(r, {})
-	},
-	[m.Cards]: {
-		anyOfScopes: [t.CreditCardReadOrg, t.DebitCardReadOrg],
-		render: ({ grantedScopes: r, labels: i }) => /* @__PURE__ */ f("div", {
-			className: "ttw:grid ttw:gap-8",
-			children: [e(r, [t.CreditCardReadOrg]) && /* @__PURE__ */ d(a, {
-				cardProgram: n.Credit,
-				labels: i.creditCards
-			}), e(r, [t.DebitCardReadOrg]) && /* @__PURE__ */ d(a, {
-				cardProgram: n.Debit,
-				labels: i.debitCards
-			})]
-		})
-	},
-	[m.Transfers]: {
-		anyOfScopes: [t.BankAccountReadOrg],
-		render: () => /* @__PURE__ */ d(u, {})
-	},
-	[m.BillPay]: {
-		anyOfScopes: [t.PayableReadOrg],
-		render: () => /* @__PURE__ */ d(i, {})
-	},
-	[m.Invoicing]: {
-		anyOfScopes: [t.InvoiceReadOrg],
-		render: () => /* @__PURE__ */ d(c, {})
-	},
-	[m.Expenses]: {
-		anyOfScopes: [t.ExpenseReadOrg, t.ExpenseReadSelf],
-		render: ({ labels: e }) => /* @__PURE__ */ d(p, { children: e.expensePlaceholders.expensesUnavailable })
-	},
-	[m.Settings]: {
-		rendersOwnTitle: !0,
-		render: () => /* @__PURE__ */ d(l, {})
-	}
-};
+var r = "WidgetSuite";
+function i(e, t) {
+	return {
+		cardId: t && "cardId" in t ? t.cardId ?? null : e.cardId,
+		pagination: t && "pagination" in t ? t.pagination : e.pagination
+	};
+}
+function a(e, t) {
+	return {
+		section: "section" in t ? t.section : e.section,
+		accounts: { accountId: t.accounts && "accountId" in t.accounts ? t.accounts.accountId ?? null : e.accounts.accountId },
+		creditCards: i(e.creditCards, t.creditCards),
+		debitCards: i(e.debitCards, t.debitCards),
+		settings: { section: t.settings && "section" in t.settings ? t.settings.section : e.settings.section }
+	};
+}
+function o({ selection: i, defaultSelection: a, sections: o }) {
+	let [s, c] = n({
+		prop: i?.section,
+		defaultProp: a?.section ?? o[0],
+		caller: r
+	}), [l, u] = n({
+		prop: i?.accounts?.accountId,
+		defaultProp: a?.accounts?.accountId ?? null,
+		caller: r
+	}), [d, f] = n({
+		prop: i?.creditCards?.cardId,
+		defaultProp: a?.creditCards?.cardId ?? null,
+		caller: r
+	}), [p, m] = n({
+		prop: i?.debitCards?.cardId,
+		defaultProp: a?.debitCards?.cardId ?? null,
+		caller: r
+	}), [h, g] = n({
+		prop: i?.creditCards?.pagination,
+		defaultProp: a?.creditCards?.pagination,
+		caller: r
+	}), [_, v] = n({
+		prop: i?.debitCards?.pagination,
+		defaultProp: a?.debitCards?.pagination,
+		caller: r
+	}), [y, b] = n({
+		prop: i?.settings?.section,
+		defaultProp: void 0,
+		caller: r
+	}), x = e((e) => {
+		"section" in e && c(e.section), e.accounts && "accountId" in e.accounts && u(e.accounts.accountId ?? null), e.creditCards && ("cardId" in e.creditCards && f(e.creditCards.cardId ?? null), "pagination" in e.creditCards && g(e.creditCards.pagination)), e.debitCards && ("cardId" in e.debitCards && m(e.debitCards.cardId ?? null), "pagination" in e.debitCards && v(e.debitCards.pagination)), e.settings && "section" in e.settings && b(e.settings.section);
+	}, [
+		u,
+		f,
+		g,
+		m,
+		v,
+		c,
+		b
+	]);
+	return {
+		resolvedSelection: t(() => ({
+			section: s,
+			accounts: { accountId: l },
+			creditCards: {
+				cardId: d,
+				pagination: h
+			},
+			debitCards: {
+				cardId: p,
+				pagination: _
+			},
+			settings: { section: y }
+		}), [
+			l,
+			d,
+			h,
+			p,
+			_,
+			s,
+			y
+		]),
+		applyPatch: x
+	};
+}
 //#endregion
-export { h as WIDGET_SUITE_DEFAULT_SECTIONS, g as WIDGET_SUITE_SECTIONS, m as WidgetSuiteSectionId };
+export { a as mergeSuiteSelection, o as useSuiteSelection };

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

@@ -2,131 +2,46 @@
 "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 { ErrorState as t } from "../../../shared/ui/dist/lib/ErrorState/ErrorState.js";
-import "../../../shared/ui/dist/index.js";
-import { useAnalyticsTrack as n } from "../../../shared/feature/dist/lib/analytics/hooks.js";
-import { WidgetProvider as r } from "../../../shared/feature/dist/lib/WidgetProvider/WidgetProvider.js";
-import { useRefetchWidget as i, useWidgetConfig as a, useWidgetError as o, useWidgetInitStaleForToken as s } from "../../../shared/feature/dist/lib/WidgetProvider/hooks.js";
-import "../../../shared/feature/dist/index.js";
-import { AcceptDisclosuresWidget as c } from "../../../accept-disclosures-widget/feature/dist/index4.js";
-import "../../../accept-disclosures-widget/feature/dist/index.js";
-import { WIDGET_SUITE_CONTENT_LABELS_EN as l, WIDGET_SUITE_DISCLOSURE_LABELS_EN as u, WIDGET_SUITE_SECTION_LABELS_EN as d, WIDGET_SUITE_SECTION_TITLE_LABELS_EN as f } from "./index4.js";
-import { WIDGET_SUITE_SECTIONS as p } from "./index5.js";
-import { WIDGET_NAME as m, WidgetSuiteAnalyticsEvent as h } from "./index2.js";
-import { needsDisclosureAcceptance as g } from "./index3.js";
-import { WidgetSuiteShell as _ } from "../../ui/dist/index3.js";
-import { SectionPageTitle as v } from "../../ui/dist/index4.js";
-import "../../ui/dist/index.js";
-import { useCallback as y, useEffect as b, useMemo as x, useState as S } from "react";
-import { Fragment as C, jsx as w, jsxs as T } from "react/jsx-runtime";
+import { mergeSuiteSelection as e, useSuiteSelection as t } from "./index5.js";
+import { createContext as n, useCallback as r, useContext as i } from "react";
+import { jsx as a } from "react/jsx-runtime";
 //#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index6.js
-var E = {
-	initFailed: "widget-suite-init-failed",
-	disclosuresRefreshFailed: "widget-suite-disclosures-refresh-failed"
-};
-function D({ sections: r, labels: m, sectionLabels: D, sectionTitleLabels: O, contentLabels: k, disclosureLabels: A, showSectionTitle: j = !0 }) {
-	let M = n();
-	b(() => {
-		M(h.Mounted);
-	}, [M]);
-	let N = {
-		...d,
-		...D
-	}, { initResponse: P } = a(), F = o(), I = s(), L = P?.scopes, R = x(() => ({
-		creditCards: {
-			...l.creditCards,
-			...k?.creditCards
+var o = n(null);
+function s({ sections: n, availableSections: i, grantedScopes: s, contentLabels: c, selection: l, defaultSelection: u, onSelectionChange: d, children: f }) {
+	let { resolvedSelection: p, applyPatch: m } = t({
+		selection: l,
+		defaultSelection: u,
+		sections: n
+	}), h = p.section, g = h && i.includes(h) ? h : i.at(0), _ = r((t) => {
+		let n = e({
+			...p,
+			section: g
+		}, t);
+		m(t), d?.(n);
+	}, [
+		g,
+		m,
+		d,
+		p
+	]);
+	return /* @__PURE__ */ a(o.Provider, {
+		value: {
+			availableSections: i,
+			activeSection: g,
+			grantedScopes: s,
+			contentLabels: c,
+			selection: l,
+			defaultSelection: u,
+			resolvedSelection: p,
+			navigate: _
 		},
-		debitCards: {
-			...l.debitCards,
-			...k?.debitCards
-		},
-		expensePlaceholders: {
-			...l.expensePlaceholders,
-			...k?.expensePlaceholders
-		}
-	}), [k]), [z, B] = S(r[0] ?? ""), V = i(), [H, U] = S(!1), W = y(() => U(!0), []), G = g(P), K = {
-		...u,
-		...A,
-		initFailedState: {
-			...u.initFailedState,
-			...A?.initFailedState
-		},
-		refreshFailedState: {
-			...u.refreshFailedState,
-			...A?.refreshFailedState
-		}
-	};
-	b(() => {
-		!G && H && U(!1);
-	}, [H, G]);
-	let q = !!(P && I);
-	if (!P && !F || q && !F) return /* @__PURE__ */ w(_, {
-		isLoading: !0,
-		sections: [],
-		selectedSectionId: "",
-		onSectionChange: B,
-		labels: m
-	});
-	if ((!P || q) && F) return /* @__PURE__ */ w(t, {
-		title: K.initFailedState.title,
-		description: K.initFailedState.body,
-		retryLabel: K.initFailedState.retryButton,
-		onRetry: V,
-		testId: E.initFailed
-	});
-	if (G) return H && F ? /* @__PURE__ */ w(t, {
-		title: K.refreshFailedState.title,
-		description: K.refreshFailedState.body,
-		retryLabel: K.refreshFailedState.retryButton,
-		onRetry: V,
-		testId: E.disclosuresRefreshFailed
-	}) : /* @__PURE__ */ w(c, { onAccepted: W });
-	let J = P?.bankName?.trim(), Y = J ? {
-		...f,
-		...O
-	}.bankTagline.replaceAll("{bankName}", J) : void 0, X = r.flatMap((t) => {
-		let n = p[t];
-		if (!n || n.anyOfScopes && !e(L, n.anyOfScopes)) return [];
-		let r = N[t], i = n.render({
-			grantedScopes: L,
-			labels: R
-		});
-		return [{
-			id: t,
-			label: r,
-			content: j && !n.rendersOwnTitle ? /* @__PURE__ */ T(C, { children: [/* @__PURE__ */ w(v, {
-				title: r,
-				bankTagline: Y
-			}), i] }) : i
-		}];
-	}), Z = X.some((e) => e.id === z) ? z : X[0]?.id ?? "";
-	return /* @__PURE__ */ w(_, {
-		sections: X,
-		selectedSectionId: Z,
-		onSectionChange: B,
-		labels: m
+		children: f
 	});
 }
-function O({ baseUrl: e, widgetToken: t, organizationId: n, configClient: i, gatewayRouting: a, linkComponent: o, implementation: s, uiFramework: c, errorFallback: l, onError: u, analytics: d, disclosuresAcceptance: f, ...p }) {
-	return /* @__PURE__ */ w(r, {
-		widgetName: m,
-		baseUrl: e,
-		widgetToken: t,
-		organizationId: n,
-		configClient: i,
-		gatewayRouting: a,
-		linkComponent: o,
-		implementation: s,
-		uiFramework: c,
-		errorFallback: l,
-		onError: u,
-		analytics: d,
-		disclosuresAcceptance: f,
-		children: /* @__PURE__ */ w(D, { ...p })
-	});
+function c() {
+	let e = i(o);
+	if (!e) throw Error("useWidgetSuiteProvider must be called inside a section rendered by WidgetSuite.");
+	return e;
 }
 //#endregion
-export { E as WIDGET_SUITE_TEST_IDS, O as WidgetSuite, O as default };
+export { s as WidgetSuiteProvider, c as useWidgetSuiteProvider };

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

@@ -0,0 +1,148 @@
+"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 { BillPayWidget as i } from "../../../bill-pay-widget/feature/dist/index34.js";
+import "../../../bill-pay-widget/feature/dist/index.js";
+import { CardsWidget as a } from "../../../cards-widget/feature/dist/index8.js";
+import "../../../cards-widget/feature/dist/index.js";
+import { BalancesWidget as o } from "../../../balances-widget/feature/dist/index5.js";
+import "../../../balances-widget/feature/dist/index.js";
+import { InsightsWidget as s } from "../../../insights-widget/feature/dist/index11.js";
+import "../../../insights-widget/feature/dist/index.js";
+import { InvoicingWidget as c } from "../../../invoicing-widget/feature/dist/index3.js";
+import "../../../invoicing-widget/feature/dist/index.js";
+import { SettingsWidget as l } from "../../../settings-widget/feature/dist/index6.js";
+import "../../../settings-widget/feature/dist/index.js";
+import { TransfersWidget as u } from "../../../transfers-widget/feature/dist/index6.js";
+import "../../../transfers-widget/feature/dist/index.js";
+import { useWidgetSuiteProvider as d } from "./index6.js";
+import { jsx as f, jsxs as p } from "react/jsx-runtime";
+//#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index7.js
+var m = ({ children: e }) => /* @__PURE__ */ f("div", {
+	className: "ttw:rounded-md ttw:border ttw:border-dashed ttw:border-border ttw:p-8 ttw:text-sm ttw:text-muted-foreground",
+	children: e
+}), h = {
+	Dashboard: "dashboard",
+	Accounts: "accounts",
+	Cards: "cards",
+	Transfers: "transfers",
+	BillPay: "bill-pay",
+	Invoicing: "invoicing",
+	Expenses: "expenses",
+	Settings: "settings"
+}, g = [
+	h.Dashboard,
+	h.Accounts,
+	h.Cards,
+	h.Transfers,
+	h.BillPay,
+	h.Invoicing,
+	h.Expenses,
+	h.Settings
+];
+function _() {
+	let { grantedScopes: n, availableSections: r, navigate: i } = d(), a = e(n, [t.BankAccountReadOrg]), c = r.includes(h.Accounts), l = r.includes(h.Transfers);
+	return /* @__PURE__ */ p("div", {
+		className: a ? "ttw:grid ttw:gap-4 ttw:md:grid-cols-2" : "ttw:grid ttw:gap-4",
+		children: [a && /* @__PURE__ */ f(o, {
+			onViewAllAccountsClick: c ? () => i({ section: h.Accounts }) : void 0,
+			onBalanceRowClick: c ? (e) => i({
+				section: h.Accounts,
+				accounts: { accountId: e }
+			}) : void 0
+		}), /* @__PURE__ */ f(s, { onLinkExternalAccountClick: l ? () => i({ section: h.Transfers }) : void 0 })]
+	});
+}
+function v() {
+	let { resolvedSelection: e, navigate: t } = d();
+	return /* @__PURE__ */ f(r, {
+		selectedAccountId: e.accounts.accountId,
+		onSelectedAccountIdChange: (e) => t({ accounts: { accountId: e } })
+	});
+}
+function y() {
+	let { grantedScopes: r, contentLabels: i, resolvedSelection: o, selection: s, defaultSelection: c, navigate: l } = d();
+	return /* @__PURE__ */ p("div", {
+		className: "ttw:grid ttw:gap-8",
+		children: [e(r, [t.CreditCardReadOrg]) && /* @__PURE__ */ f(a, {
+			cardProgram: n.Credit,
+			labels: i.creditCards,
+			selectedCardId: o.creditCards.cardId,
+			onSelectedCardIdChange: (e) => l({ creditCards: { cardId: e } }),
+			pagination: s?.creditCards?.pagination,
+			defaultPagination: c?.creditCards?.pagination,
+			onPaginationChange: (e) => l({ creditCards: { pagination: e } })
+		}), e(r, [t.DebitCardReadOrg]) && /* @__PURE__ */ f(a, {
+			cardProgram: n.Debit,
+			labels: i.debitCards,
+			selectedCardId: o.debitCards.cardId,
+			onSelectedCardIdChange: (e) => l({ debitCards: { cardId: e } }),
+			pagination: s?.debitCards?.pagination,
+			defaultPagination: c?.debitCards?.pagination,
+			onPaginationChange: (e) => l({ debitCards: { pagination: e } })
+		})]
+	});
+}
+function b() {
+	return /* @__PURE__ */ f(u, {});
+}
+function x() {
+	return /* @__PURE__ */ f(i, {});
+}
+function S() {
+	return /* @__PURE__ */ f(c, {});
+}
+function C() {
+	let { contentLabels: e } = d();
+	return /* @__PURE__ */ f(m, { children: e.expensePlaceholders.expensesUnavailable });
+}
+function w() {
+	let { selection: e, navigate: t } = d();
+	return /* @__PURE__ */ f(l, {
+		selectedSection: e?.settings?.section,
+		onSelectedSectionChange: (e) => t({ settings: { section: e } })
+	});
+}
+var T = {
+	[h.Dashboard]: { Content: _ },
+	[h.Accounts]: {
+		anyOfScopes: [t.BankAccountReadOrg, t.ExternalBankAccountReadOrg],
+		rendersOwnTitle: !0,
+		Content: v
+	},
+	[h.Cards]: {
+		anyOfScopes: [t.CreditCardReadOrg, t.DebitCardReadOrg],
+		rendersOwnTitle: !0,
+		Content: y
+	},
+	[h.Transfers]: {
+		anyOfScopes: [t.BankAccountReadOrg],
+		Content: b
+	},
+	[h.BillPay]: {
+		anyOfScopes: [t.PayableReadOrg],
+		Content: x
+	},
+	[h.Invoicing]: {
+		anyOfScopes: [t.InvoiceReadOrg],
+		Content: S
+	},
+	[h.Expenses]: {
+		anyOfScopes: [t.ExpenseReadOrg, t.ExpenseReadSelf],
+		Content: C
+	},
+	[h.Settings]: {
+		rendersOwnTitle: !0,
+		Content: w
+	}
+};
+//#endregion
+export { g as WIDGET_SUITE_DEFAULT_SECTIONS, T as WIDGET_SUITE_SECTIONS, h as WidgetSuiteSectionId };

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

@@ -0,0 +1,144 @@
+"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 { ErrorState as t } from "../../../shared/ui/dist/lib/ErrorState/ErrorState.js";
+import "../../../shared/ui/dist/index.js";
+import { useAnalyticsTrack as n } from "../../../shared/feature/dist/lib/analytics/hooks.js";
+import { WidgetProvider as r } from "../../../shared/feature/dist/lib/WidgetProvider/WidgetProvider.js";
+import { useRefetchWidget as i, useWidgetConfig as a, useWidgetError as o, useWidgetInitStaleForToken as s } from "../../../shared/feature/dist/lib/WidgetProvider/hooks.js";
+import "../../../shared/feature/dist/index.js";
+import { AcceptDisclosuresWidget as c } from "../../../accept-disclosures-widget/feature/dist/index4.js";
+import "../../../accept-disclosures-widget/feature/dist/index.js";
+import { WIDGET_SUITE_CONTENT_LABELS_EN as l, WIDGET_SUITE_DISCLOSURE_LABELS_EN as u, WIDGET_SUITE_SECTION_LABELS_EN as d, WIDGET_SUITE_SECTION_TITLE_LABELS_EN as f } from "./index4.js";
+import { WidgetSuiteProvider as p, useWidgetSuiteProvider as m } from "./index6.js";
+import { WIDGET_SUITE_SECTIONS as h } from "./index7.js";
+import { WIDGET_NAME as g, WidgetSuiteAnalyticsEvent as _ } from "./index2.js";
+import { needsDisclosureAcceptance as v } from "./index3.js";
+import { WidgetSuiteShell as y } from "../../ui/dist/index3.js";
+import { SectionPageTitle as b } from "../../ui/dist/index4.js";
+import "../../ui/dist/index.js";
+import { useCallback as x, useEffect as S, useMemo as C, useState as w } from "react";
+import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
+//#region ../../libs/tesouro-embedded-components-react/widget-suite/feature/dist/index8.js
+var O = {
+	initFailed: "widget-suite-init-failed",
+	disclosuresRefreshFailed: "widget-suite-disclosures-refresh-failed"
+};
+function k({ labels: e, sectionLabels: n, sectionTitleLabels: r, disclosureLabels: l, showSectionTitle: p = !0 }) {
+	let { availableSections: g, activeSection: _, navigate: C } = m(), { initResponse: k } = a(), A = o(), j = s(), M = i(), N = {
+		...d,
+		...n
+	}, P = x((e) => C({ section: e }), [C]), [F, I] = w(!1), L = x(() => I(!0), []), R = v(k), z = {
+		...u,
+		...l,
+		initFailedState: {
+			...u.initFailedState,
+			...l?.initFailedState
+		},
+		refreshFailedState: {
+			...u.refreshFailedState,
+			...l?.refreshFailedState
+		}
+	};
+	S(() => {
+		!R && F && I(!1);
+	}, [F, R]);
+	let B = !!(k && j);
+	if (!k && !A || B && !A) return /* @__PURE__ */ E(y, {
+		isLoading: !0,
+		sections: [],
+		selectedSectionId: "",
+		onSectionChange: P,
+		labels: e
+	});
+	if ((!k || B) && A) return /* @__PURE__ */ E(t, {
+		title: z.initFailedState.title,
+		description: z.initFailedState.body,
+		retryLabel: z.initFailedState.retryButton,
+		onRetry: M,
+		testId: O.initFailed
+	});
+	if (R) return F && A ? /* @__PURE__ */ E(t, {
+		title: z.refreshFailedState.title,
+		description: z.refreshFailedState.body,
+		retryLabel: z.refreshFailedState.retryButton,
+		onRetry: M,
+		testId: O.disclosuresRefreshFailed
+	}) : /* @__PURE__ */ E(c, { onAccepted: L });
+	let V = k?.bankName?.trim(), H = V ? {
+		...f,
+		...r
+	}.bankTagline.replaceAll("{bankName}", V) : void 0, U = g.map((e) => {
+		let { Content: t, rendersOwnTitle: n } = h[e], r = N[e];
+		return {
+			id: e,
+			label: r,
+			content: p && !n ? /* @__PURE__ */ D(T, { children: [/* @__PURE__ */ E(b, {
+				title: r,
+				bankTagline: H
+			}), /* @__PURE__ */ E(t, {})] }) : /* @__PURE__ */ E(t, {})
+		};
+	});
+	return /* @__PURE__ */ E(y, {
+		sections: U,
+		selectedSectionId: _ ?? "",
+		onSectionChange: P,
+		labels: e
+	});
+}
+function A({ sections: t, selection: r, defaultSelection: i, onSelectionChange: o, contentLabels: s, ...c }) {
+	let u = n();
+	S(() => {
+		u(_.Mounted);
+	}, [u]);
+	let { initResponse: d } = a(), f = d?.scopes, m = C(() => ({
+		creditCards: {
+			...l.creditCards,
+			...s?.creditCards
+		},
+		debitCards: {
+			...l.debitCards,
+			...s?.debitCards
+		},
+		expensePlaceholders: {
+			...l.expensePlaceholders,
+			...s?.expensePlaceholders
+		}
+	}), [s]), g = t.filter((t) => {
+		let n = h[t];
+		return !!n && (!n.anyOfScopes || e(f, n.anyOfScopes));
+	});
+	return /* @__PURE__ */ E(p, {
+		sections: t,
+		availableSections: g,
+		grantedScopes: f,
+		contentLabels: m,
+		selection: r,
+		defaultSelection: i,
+		onSelectionChange: o,
+		children: /* @__PURE__ */ E(k, { ...c })
+	});
+}
+function j({ baseUrl: e, widgetToken: t, organizationId: n, configClient: i, gatewayRouting: a, linkComponent: o, implementation: s, uiFramework: c, errorFallback: l, onError: u, analytics: d, disclosuresAcceptance: f, ...p }) {
+	return /* @__PURE__ */ E(r, {
+		widgetName: g,
+		baseUrl: e,
+		widgetToken: t,
+		organizationId: n,
+		configClient: i,
+		gatewayRouting: a,
+		linkComponent: o,
+		implementation: s,
+		uiFramework: c,
+		errorFallback: l,
+		onError: u,
+		analytics: d,
+		disclosuresAcceptance: f,
+		children: /* @__PURE__ */ E(A, { ...p })
+	});
+}
+//#endregion
+export { O as WIDGET_SUITE_TEST_IDS, j as WidgetSuite, j as default };

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

@@ -44,7 +44,7 @@ function c({ sections: c, selectedSectionId: l, onSectionChange: u, isLoading: d
 		"aria-label": p.loadingAriaLabel,
 		className: "ttw:flex ttw:w-full ttw:flex-col ttw:gap-6",
 		children: [/* @__PURE__ */ a("div", {
-			className: "ttw:flex ttw:flex-wrap ttw:items-center ttw:gap-1 ttw:border-b ttw:border-border",
+			className: "ttw:flex ttw:items-center ttw:gap-1 ttw:overflow-x-auto ttw:border-b ttw:border-border",
 			children: s.map((t) => /* @__PURE__ */ a("div", {
 				className: "ttw:px-4 ttw:py-2.5",
 				children: /* @__PURE__ */ a(e, { className: "ttw:h-5 ttw:w-20" })
@@ -64,21 +64,25 @@ function c({ sections: c, selectedSectionId: l, onSectionChange: u, isLoading: d
 		className: "ttw:flex ttw:w-full ttw:flex-col ttw:gap-6",
 		children: [/* @__PURE__ */ a("nav", {
 			"aria-label": p.navAriaLabel,
+			className: "ttw:border-b ttw:border-border",
 			children: /* @__PURE__ */ a("ul", {
-				className: "ttw:flex ttw:flex-wrap ttw:items-center ttw:gap-1 ttw:border-b ttw:border-border",
+				className: "ttw:-mb-px ttw:flex ttw:items-center ttw:gap-1 ttw:overflow-x-auto",
 				children: c.map((e, t) => {
 					let r = e.id === l;
-					return /* @__PURE__ */ a("li", { children: /* @__PURE__ */ a("button", {
-						type: "button",
-						ref: (e) => {
-							m.current[t] = e;
-						},
-						"aria-current": r ? "page" : void 0,
-						onClick: () => u(e.id),
-						onKeyDown: (e) => g(e, t),
-						className: n("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);
+					return /* @__PURE__ */ a("li", {
+						className: "ttw:shrink-0",
+						children: /* @__PURE__ */ a("button", {
+							type: "button",
+							ref: (e) => {
+								m.current[t] = e;
+							},
+							"aria-current": r ? "page" : void 0,
+							onClick: () => u(e.id),
+							onKeyDown: (e) => g(e, t),
+							className: n("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-offset-2 ttw:focus-visible:outline-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__ */ a("div", {

package/package.json

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