@terpjs/react-core 0.10.0 → 0.12.0

package/src/format.test.tsx

@@ -13,7 +13,7 @@ import {
   useFormatDate,
   useFormatNumber,
 } from "./format";
-import { LocaleProvider } from "./locale";
+import { LOCALE_EN, LOCALE_NL, LocaleProvider } from "./locale";
 
 afterEach(() => {
   cleanup();
@@ -27,8 +27,8 @@ afterEach(() => {
 // version asserted the literal digit 7 and would have failed in Kiritimati and nowhere else.
 const WHEN = "2026-07-07T12:00:00Z";
 
-const NL = { label: "Nederlands", strings: {} };
-const EN = { label: "English", strings: {} };
+const NL = LOCALE_NL;
+const EN = LOCALE_EN;
 
 describe("the locale-explicit formatters", () => {
   it("actually varies with the locale it is given", () => {

package/src/index.ts

@@ -87,8 +87,23 @@ export type {
 } from "./SplitPage";
 export { HubPage, HubCard } from "./HubPage";
 export type { HubPageProps, HubCardProps, RenderHubCardLink } from "./HubPage";
-export { UiTextProvider, useStrings, useUiText, resolveUiText, DEFAULT_STRINGS } from "./uiText";
-export type { UiText, ResolveUiText, TerpStrings, UiTextProviderProps } from "./uiText";
+export {
+  UiTextProvider,
+  Trans,
+  useStrings,
+  useUiText,
+  resolveUiText,
+  resolveUiTextNode,
+  DEFAULT_STRINGS,
+} from "./uiText";
+export type {
+  UiText,
+  UiTextNode,
+  ResolveUiText,
+  TerpStrings,
+  TransProps,
+  UiTextProviderProps,
+} from "./uiText";
 export { EmptyState } from "./EmptyState";
 export type { EmptyStateProps } from "./EmptyState";
 export { ErrorState, describeError } from "./ErrorState";
@@ -216,13 +231,19 @@ export { ThemeProvider, ThemeToggle, useTheme, THEME_STORAGE_KEY } from "./theme
 export type { Theme, ThemeProviderProps, ThemeToggleProps } from "./theme";
 export {
   LocaleProvider,
+  defineAppLocales,
   LanguageSwitcher,
   useLocale,
   LOCALE_EN,
   LOCALE_NL,
   LOCALE_STORAGE_KEY,
 } from "./locale";
-export type { LocaleCatalog, LocaleProviderProps, LanguageSwitcherProps } from "./locale";
+export type {
+  AppI18nDeclaration,
+  LocaleCatalog,
+  LocaleProviderProps,
+  LanguageSwitcherProps,
+} from "./locale";
 export { UserMenu, userInitials } from "./UserMenu";
 export type { UserMenuProps } from "./UserMenu";
 

package/src/locale.test.tsx

@@ -2,8 +2,15 @@
 import { cleanup, fireEvent, render, screen } from "@testing-library/react";
 import { afterEach, describe, expect, it } from "vitest";
 
-import { LOCALE_EN, LOCALE_NL, LOCALE_STORAGE_KEY, LanguageSwitcher, LocaleProvider } from "./locale";
-import { DEFAULT_STRINGS, useStrings } from "./uiText";
+import {
+  LOCALE_EN,
+  LOCALE_NL,
+  LOCALE_STORAGE_KEY,
+  LanguageSwitcher,
+  LocaleProvider,
+  defineAppLocales,
+} from "./locale";
+import { DEFAULT_STRINGS, Trans, useStrings } from "./uiText";
 
 afterEach(() => {
   cleanup();
@@ -14,7 +21,7 @@ function SignOutLabel() {
   return <p>{useStrings().signOut}</p>;
 }
 
-const NL = { label: "Nederlands", strings: { signOut: "Uitloggen", language: "Taal" } };
+const NL = LOCALE_NL;
 
 describe("LocaleProvider + LanguageSwitcher", () => {
   it("feeds the active catalog's overrides through the UiText seam", () => {
@@ -84,6 +91,191 @@ describe("LocaleProvider + LanguageSwitcher", () => {
     // No visible label text in the inline variant.
     expect(screen.queryByText("Language")).not.toBeInTheDocument();
   });
+
+  it("resolves app descriptors through the active locale catalog", () => {
+    render(
+      <LocaleProvider
+        locales={{ en: LOCALE_EN, nl: { ...NL, messages: { greeting: "Hallo" } } }}
+        defaultLocale="nl"
+        sourceLocale="en"
+      >
+        <Trans id="greeting" message="Hello" />
+      </LocaleProvider>,
+    );
+    expect(screen.getByText("Hallo")).toBeInTheDocument();
+  });
+
+  it("refuses a missing target translation instead of silently using source copy", () => {
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: LOCALE_EN, nl: NL }} defaultLocale="nl" sourceLocale="en">
+          <Trans id="greeting" message="Hello" />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/Missing translation "greeting" for locale "nl"/);
+  });
+
+  it("refuses a copied source translation unless allowIdentical documents it", () => {
+    expect(() =>
+      render(
+        <LocaleProvider
+          locales={{ en: {}, nl: { ...LOCALE_NL, messages: { greeting: "Hello" } } }}
+          defaultLocale="nl"
+          sourceLocale="en"
+        >
+          <Trans id="greeting" message="Hello" />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/copies its source text/);
+
+    render(
+      <LocaleProvider
+        locales={{
+          en: {},
+          nl: {
+            ...LOCALE_NL,
+            messages: { greeting: "Hello" },
+            allowIdentical: ["greeting"],
+          },
+        }}
+        defaultLocale="nl"
+        sourceLocale="en"
+      >
+        <Trans id="greeting" message="Hello" />
+      </LocaleProvider>,
+    );
+    expect(screen.getByText("Hello")).toBeInTheDocument();
+  });
+
+  it("refuses malformed locale configuration and descriptors", () => {
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: {} }} sourceLocale="nl">
+          <span />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/Source locale "nl" is not present/);
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: {} }} defaultLocale="nl">
+          <span />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/Default locale "nl" is not present/);
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: {} }}>
+          <Trans id="" message="Hello" />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/non-empty id and message/);
+  });
+
+  it("merges checked-in app messages with framework catalogs", () => {
+    expect(
+      defineAppLocales(
+        { sourceLocale: "nl", locales: { nl: {}, en: { messages: { greeting: "Hello" } } } },
+        { en: LOCALE_EN, nl: LOCALE_NL },
+      ).en.messages,
+    ).toEqual({ greeting: "Hello" });
+  });
+
+  it("validates the checked-in declaration before merging it", () => {
+    expect(() =>
+      defineAppLocales({ sourceLocale: "nl", locales: { en: {} } }),
+    ).toThrow(/Source locale "nl" is not present/);
+    expect(() =>
+      defineAppLocales({
+        sourceLocale: "nl",
+        locales: { nl: {}, en: { messages: { greeting: "" } } },
+      }),
+    ).toThrow(/empty or invalid message entry/);
+    expect(() =>
+      defineAppLocales(
+        { sourceLocale: "en", locales: { en: {} } },
+        { en: { strings: [] as never } },
+      ),
+    ).toThrow(/framework strings must be an object/);
+    expect(() =>
+      defineAppLocales(
+        { sourceLocale: "en", locales: { en: {} } },
+        "invalid" as never,
+      ),
+    ).toThrow(/Framework locale catalogs must be an object/);
+  });
+
+  it("refuses incomplete framework catalogs through LocaleProvider itself", () => {
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: LOCALE_EN, de: { messages: { greeting: "Hallo" } } }}>
+          <span />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/missing .* framework string translation/);
+  });
+
+  it("refuses malformed labels and supplied framework strings", () => {
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: { label: "" } }}>
+          <span />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/label must be a non-empty string/);
+    expect(() =>
+      render(
+        <LocaleProvider
+          locales={{ en: { strings: { ...LOCALE_NL.strings, signOut: "" } } }}
+        >
+          <span />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/empty or invalid framework string "signOut"/);
+    expect(() =>
+      render(
+        <LocaleProvider locales={{ en: { strings: "invalid" as never } }}>
+          <span />
+        </LocaleProvider>,
+      ),
+    ).toThrow(/framework strings must be an object/);
+  });
+
+  it("refuses a target locale whose app copy is translated but framework chrome is not", () => {
+    expect(() =>
+      defineAppLocales(
+        {
+          sourceLocale: "en",
+          locales: { en: {}, de: { messages: { greeting: "Hallo" } } },
+        },
+        { en: LOCALE_EN },
+      ),
+    ).toThrow(/missing .* framework string translation/);
+
+    const germanStrings = Object.fromEntries(
+      Object.keys(DEFAULT_STRINGS).map((key) => [key, `de:${key}`]),
+    );
+    expect(
+      defineAppLocales(
+        {
+          sourceLocale: "en",
+          locales: { en: {}, de: { messages: { greeting: "Hallo" } } },
+        },
+        { en: LOCALE_EN, de: { strings: germanStrings } },
+      ).de.messages,
+    ).toEqual({ greeting: "Hallo" });
+  });
+
+  it("always renders the descriptor fallback in the source locale", () => {
+    render(
+      <LocaleProvider
+        locales={{ en: { messages: { greeting: "stale catalog value" } } }}
+        sourceLocale="en"
+      >
+        <Trans id="greeting" message="Hello" />
+      </LocaleProvider>,
+    );
+    expect(screen.getByText("Hello")).toBeInTheDocument();
+  });
 });
 
 describe("LOCALE_NL", () => {

package/src/locale.tsx

@@ -1,21 +1,153 @@
 import { createContext, useCallback, useContext, useMemo, useState } from "react";
 import type { ReactNode } from "react";
+import type { UiText } from "@terpjs/contract";
 
 import { Icon } from "./icons";
 import { Menu, MenuItem } from "./ui/Menu";
-import { UiTextProvider, useStrings } from "./uiText";
+import { DEFAULT_STRINGS, UiTextProvider, useStrings } from "./uiText";
 import type { TerpStrings } from "./uiText";
 
 /**
- * One locale's catalog: per-key overrides of the framework strings (missing keys fall
- * back to the bundled English defaults) plus an optional native display name for
- * language pickers. `{}` is a valid catalog — English needs no overrides.
+ * One locale's catalog: framework strings, app messages, and an optional native display
+ * name for language pickers. English locales may omit `strings` because react-core's
+ * bundled defaults are English; every declared non-English locale must supply the complete
+ * `TerpStrings` set so framework chrome cannot silently fall back to English.
  */
 export interface LocaleCatalog {
   /** Native display name shown by {@link LanguageSwitcher} (default: the locale code). */
   label?: string;
   /** Framework-string overrides for this locale. */
   strings?: Partial<TerpStrings>;
+  /** App-authored messages, keyed by the stable id carried by a `UiText` descriptor. */
+  messages?: Record<string, string>;
+  /** Message ids intentionally identical to their source copy (catalog-gate documentation). */
+  allowIdentical?: readonly string[];
+}
+
+/** Checked-in, JSON-compatible app declaration consumed by {@link defineAppLocales}. */
+export interface AppI18nDeclaration {
+  sourceLocale: string;
+  locales: Record<string, LocaleCatalog>;
+}
+
+function isRecord(value: unknown): value is Record<string, unknown> {
+  return typeof value === "object" && value !== null && !Array.isArray(value);
+}
+
+function assertLocaleCatalogs(
+  locales: unknown,
+  sourceLocale?: string,
+): asserts locales is Record<string, LocaleCatalog> {
+  if (!isRecord(locales) || Object.keys(locales).length === 0) {
+    throw new Error("Locale catalogs must declare at least one locale.");
+  }
+  if (
+    sourceLocale !== undefined &&
+    (sourceLocale.trim() === "" || !Object.hasOwn(locales, sourceLocale))
+  ) {
+    throw new Error(`Source locale "${sourceLocale}" is not present in the locale catalogs.`);
+  }
+  for (const [code, value] of Object.entries(locales)) {
+    if (code.trim() === "" || !isRecord(value)) {
+      throw new Error("Locale entries must be non-empty codes mapped to catalog objects.");
+    }
+    if (
+      value.label !== undefined &&
+      (typeof value.label !== "string" || value.label.trim() === "")
+    ) {
+      throw new Error(`Locale "${code}" label must be a non-empty string.`);
+    }
+    if (value.strings !== undefined && !isRecord(value.strings)) {
+      throw new Error(`Locale "${code}" framework strings must be an object.`);
+    }
+    for (const [key, translated] of Object.entries(value.strings ?? {})) {
+      if (!Object.hasOwn(DEFAULT_STRINGS, key)) {
+        throw new Error(`Locale "${code}" has unknown framework string "${key}".`);
+      }
+      if (typeof translated !== "string" || translated.trim() === "") {
+        throw new Error(`Locale "${code}" has an empty or invalid framework string "${key}".`);
+      }
+    }
+    const messages = value.messages;
+    if (messages !== undefined && !isRecord(messages)) {
+      throw new Error(`Locale "${code}" messages must be an object.`);
+    }
+    for (const [id, translated] of Object.entries(messages ?? {})) {
+      if (id.trim() === "" || typeof translated !== "string" || translated.trim() === "") {
+        throw new Error(`Locale "${code}" has an empty or invalid message entry.`);
+      }
+    }
+    const allowed = value.allowIdentical;
+    if (
+      allowed !== undefined &&
+      (!Array.isArray(allowed) ||
+        allowed.some((id) => typeof id !== "string" || id.trim() === ""))
+    ) {
+      throw new Error(`Locale "${code}" allowIdentical must be an array of non-empty ids.`);
+    }
+    if (allowed !== undefined && new Set(allowed).size !== allowed.length) {
+      throw new Error(`Locale "${code}" allowIdentical contains duplicate ids.`);
+    }
+    const stale = allowed?.find((id) => typeof messages?.[id] !== "string");
+    if (stale !== undefined) {
+      throw new Error(`Locale "${code}" allowIdentical names missing message "${stale}".`);
+    }
+  }
+}
+
+function assertFrameworkStringsComplete(locales: Record<string, LocaleCatalog>): void {
+  for (const [code, catalog] of Object.entries(locales)) {
+    if (code.split("-")[0].toLowerCase() === "en") continue;
+    const missing = Object.keys(DEFAULT_STRINGS).filter(
+      (key) =>
+        typeof catalog.strings?.[key as keyof TerpStrings] !== "string" ||
+        catalog.strings[key as keyof TerpStrings]?.trim() === "",
+    );
+    if (missing.length > 0) {
+      throw new Error(
+        `Locale "${code}" is missing ${missing.length} framework string translation(s) ` +
+          `(for example: ${missing.slice(0, 3).join(", ")}). ` +
+          "Pass a complete framework catalog; app messages alone do not translate the shell.",
+      );
+    }
+  }
+}
+
+/**
+ * Merge app message catalogs with react-core's framework-string catalogs. This keeps one
+ * checked-in `i18n.json` authoritative for app copy without duplicating LOCALE_EN/LOCALE_NL.
+ */
+export function defineAppLocales(
+  declaration: AppI18nDeclaration,
+  frameworkLocales: Record<string, LocaleCatalog> = {},
+): Record<string, LocaleCatalog> {
+  if (!isRecord(declaration) || typeof declaration.sourceLocale !== "string") {
+    throw new Error("frontend/i18n.json must declare sourceLocale and a locales map.");
+  }
+  assertLocaleCatalogs(declaration.locales, declaration.sourceLocale);
+  if (!isRecord(frameworkLocales)) {
+    throw new Error("Framework locale catalogs must be an object.");
+  }
+  if (Object.keys(frameworkLocales).length > 0) {
+    assertLocaleCatalogs(frameworkLocales);
+  }
+  const merged = Object.fromEntries(
+    Object.entries(declaration.locales).map(([code, app]) => {
+      const framework = frameworkLocales[code] ?? {};
+      return [
+        code,
+        {
+          ...framework,
+          ...app,
+          strings: { ...framework.strings, ...app.strings },
+          messages: { ...framework.messages, ...app.messages },
+        },
+      ];
+    }),
+  );
+  assertLocaleCatalogs(merged, declaration.sourceLocale);
+  assertFrameworkStringsComplete(merged);
+  return merged;
 }
 
 /** The built-in English catalog — the bundled defaults, no overrides needed. */
@@ -29,6 +161,15 @@ export const LOCALE_EN: LocaleCatalog = { label: "English" };
 export const LOCALE_NL: LocaleCatalog = {
   label: "Nederlands",
   strings: {
+    clearSelection: "Selectie wissen",
+    clearAllSelections: "Alle selecties wissen",
+    comboboxRemove: "Verwijderen",
+    comboboxLoading: "Laden…",
+    comboboxNoOptions: "Geen opties",
+    previousMonth: "Vorige maand",
+    selectDate: "Kies een datum",
+    selectDateRange: "Kies een periode",
+    nextMonth: "Volgende maand",
     loading: "Laden...",
     emptyList: "Nog niets te zien.",
     add: "Toevoegen",
@@ -142,6 +283,8 @@ export interface LocaleProviderProps {
   locales: Record<string, LocaleCatalog>;
   /** Starting locale when the user has not chosen one; default: the first key. */
   defaultLocale?: string;
+  /** Locale whose descriptor `message` is the authored fallback; default: the first key. */
+  sourceLocale?: string;
   children: ReactNode;
 }
 
@@ -151,11 +294,20 @@ export interface LocaleProviderProps {
  * `UiText` context — so every react-core component (and every `UiText` prop) follows the
  * switch with no per-component wiring. Adding a language to an app is one catalog entry.
  */
-export function LocaleProvider({ locales, defaultLocale, children }: LocaleProviderProps) {
+export function LocaleProvider({
+  locales,
+  defaultLocale,
+  sourceLocale,
+  children,
+}: LocaleProviderProps) {
+  assertLocaleCatalogs(locales, sourceLocale);
+  assertFrameworkStringsComplete(locales);
   const codes = Object.keys(locales);
-  const fallback = defaultLocale !== undefined && codes.includes(defaultLocale)
-    ? defaultLocale
-    : codes[0];
+  if (defaultLocale !== undefined && !codes.includes(defaultLocale)) {
+    throw new Error(`Default locale "${defaultLocale}" is not present in the locale catalogs.`);
+  }
+  const resolvedSourceLocale = sourceLocale ?? codes[0];
+  const fallback = defaultLocale ?? codes[0];
   const [locale, setLocaleState] = useState<string>(() => {
     try {
       const stored = window.localStorage.getItem(LOCALE_STORAGE_KEY);
@@ -164,6 +316,7 @@ export function LocaleProvider({ locales, defaultLocale, children }: LocaleProvi
       return fallback ?? "en";
     }
   });
+  const activeLocale = codes.includes(locale) ? locale : fallback;
 
   const setLocale = useCallback(
     (next: string) => {
@@ -182,17 +335,49 @@ export function LocaleProvider({ locales, defaultLocale, children }: LocaleProvi
 
   const value = useMemo<LocaleContextValue>(
     () => ({
-      locale,
+      locale: activeLocale,
       locales: codes,
       labelOf: (code) => locales[code]?.label ?? code,
       setLocale,
     }),
-    [locale, codes.join("\u0000"), setLocale, locales],
+    [activeLocale, codes.join("\u0000"), setLocale, locales],
+  );
+
+  const resolveText = useCallback(
+    (text: UiText): string => {
+      if (typeof text === "string") {
+        return text;
+      }
+      if (text.id.trim() === "" || text.message.trim() === "") {
+        throw new Error("UiText descriptors require non-empty id and message values.");
+      }
+      if (activeLocale === resolvedSourceLocale) {
+        return text.message;
+      }
+      const catalog = locales[activeLocale];
+      const translated = catalog?.messages?.[text.id];
+      if (typeof translated === "string" && translated.trim() !== "") {
+        if (translated === text.message && !catalog.allowIdentical?.includes(text.id)) {
+          throw new Error(
+            `Translation "${text.id}" for locale "${activeLocale}" copies its source text. ` +
+              "Translate it or document an intentional proper noun/acronym in allowIdentical.",
+          );
+        }
+        return translated;
+      }
+      throw new Error(
+        `Missing translation "${text.id}" for locale "${activeLocale}". ` +
+          "Add it to frontend/i18n.json and run the frontend lint gate.",
+      );
+    },
+    [activeLocale, locales, resolvedSourceLocale],
   );
 
   return (
     <LocaleContext.Provider value={value}>
-      <UiTextProvider strings={locales[locale]?.strings}>{children}</UiTextProvider>
+      <UiTextProvider strings={locales[activeLocale]?.strings} resolveText={resolveText}>
+        {children}
+      </UiTextProvider>
     </LocaleContext.Provider>
   );
 }

package/src/markers.test.ts

@@ -91,6 +91,8 @@ const MARKERS = [
   "combobox-field",
   "combobox-list",
   "combobox-option",
+  "combobox-token",
+  "combobox-token-remove",
   "control-label",
   "dataview",
   "dataview-actions-cell",

package/src/nav.ts

@@ -1,4 +1,4 @@
-import type { ModuleManifest, NavGroup, NavItem } from "@terpjs/contract";
+import type { ModuleManifest, NavGroup, NavItem, UiText } from "@terpjs/contract";
 
 /**
  * What a manifest's declared visibility is resolved against.
@@ -81,7 +81,7 @@ export interface NavSection {
   /** The declared group's id, or `null` for the default headerless group. */
   id: string | null;
   /** The label to render above the list, or `null` when the section renders none. */
-  label: string | null;
+  label: UiText | null;
   items: NavItem[];
 }
 

package/src/router.tsx

@@ -14,7 +14,7 @@ import {
 } from "@tanstack/react-router";
 import type { ComponentType, ReactNode } from "react";
 import { useCallback, useEffect, useRef, useState } from "react";
-import type { ModuleManifest, NavGroup } from "@terpjs/contract";
+import type { ModuleManifest, NavGroup, UiText } from "@terpjs/contract";
 
 import { AppShell } from "./AppShell";
 import { ProfileView } from "./ProfileView";
@@ -238,7 +238,7 @@ export interface BuildAppRouterOptions {
   /** Maps a manifest route's `view` id to the component that renders it. */
   views: Record<string, ComponentType>;
   /** App title shown in the shell's sidebar brand. */
-  title: string;
+  title: UiText;
   /** Brand mark in the sidebar (any rendered node); default: the placeholder TerpMark. */
   logo?: ReactNode;
   /**
@@ -461,8 +461,18 @@ export function buildAppRouter(
     // render it through useNavLink), so an unstable identity is worse than a re-render: it
     // remounts every in-app link in the tree on each navigation.
     const renderNavLink = useCallback<NavLinkRenderer>(
+      // `activeOptions={{ exact: true }}` for the same reason the shell's `renderLink`
+      // below carries it, and it matters MORE here: this renderer is what `Breadcrumbs`
+      // and `HubCard` use, so its job is rendering ANCESTORS. Under the router's default
+      // prefix matching every ancestor link matched the URL and was marked active, which
+      // on any detail route emitted a second `aria-current="page"` — one on the crumb for
+      // `/definitions` and one on the current crumb — plus a stray `.active` class and
+      // `data-status="active"` that made an ancestor look like the current page. The fix
+      // was applied to the nav and missed on the component whose whole purpose is the
+      // trail; exact matching means a crumb is only ever current when it IS the URL, and
+      // the current crumb is a span rather than a link.
       ({ to, children, attributes }) => (
-        <Link to={to} {...attributes}>
+        <Link to={to} activeOptions={{ exact: true }} {...attributes}>
           {children}
         </Link>
       ),

package/src/sso.ts

@@ -1,4 +1,4 @@
-import type { TerpClient, TerpClientFor } from "@terpjs/contract";
+import type { TerpClient, TerpClientFor, UiText } from "@terpjs/contract";
 
 import { unwrap } from "./unwrap";
 
@@ -61,7 +61,7 @@ export interface SsoProvider {
   /** Provider name as mounted on the backend (the `{provider}` path segment). */
   name: string;
   /** Display label for the provider button (defaults to the name). */
-  label?: string;
+  label?: UiText;
 }
 
 /** Default SPA path prefix the IdP redirects back to: `/auth/callback/{provider}`. */