@thunderid/react 1.8.0 → 1.9.1

package/dist/components/auth/flow/ConsentDetailText.js

@@ -0,0 +1,58 @@
+import { cx } from "../../../styles/emotion.js";
+import useTheme_default from "../../../contexts/Theme/useTheme.js";
+import Typography_default from "../../primitives/Typography/Typography.js";
+import ConsentDetailText_styles_default, { useToggleStyles } from "./ConsentDetailText.styles.js";
+import resolveConsentText_default from "./resolveConsentText.js";
+import isConsentDetailTextClamped_default from "../../../utils/isConsentDetailTextClamped.js";
+import { bem, withVendorCSSClassPrefix } from "@thunderid/browser";
+import { useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+
+//#region src/components/auth/flow/ConsentDetailText.tsx
+/**
+* Button that expands or collapses long authorization detail content.
+*/
+const ConsentDetailToggle = ({ controls = void 0, expanded, hiddenCount = void 0, onToggle, t = void 0 }) => {
+	const { theme, colorScheme } = useTheme_default();
+	const styles = useToggleStyles(theme, colorScheme);
+	let label = resolveConsentText_default(t, "consent.authorization_details.show_less");
+	if (!expanded) label = hiddenCount === void 0 ? resolveConsentText_default(t, "consent.authorization_details.show_more") : resolveConsentText_default(t, "consent.authorization_details.more_items", { count: hiddenCount });
+	return /* @__PURE__ */ jsx("button", {
+		type: "button",
+		className: cx(withVendorCSSClassPrefix(bem("consent-detail-text", "toggle")), styles["toggle"]),
+		"aria-controls": controls,
+		"aria-expanded": expanded,
+		onClick: () => onToggle(!expanded),
+		children: label
+	});
+};
+/**
+* Shows authorization detail text that wraps anywhere, so a long unbroken token such as an IBAN or a
+* URL never overflows. Text longer than its limit is clamped behind a toggle.
+*/
+const ConsentDetailText = ({ align = "left", className = void 0, fontWeight = void 0, id = void 0, maxChars, maxLines, monospace = false, t = void 0, text, variant = "body2" }) => {
+	const [expanded, setExpanded] = useState(false);
+	const { theme, colorScheme } = useTheme_default();
+	const styles = ConsentDetailText_styles_default(theme, colorScheme, align, monospace, maxLines);
+	const long = isConsentDetailTextClamped_default(text, maxChars, maxLines);
+	return /* @__PURE__ */ jsxs("div", {
+		className: cx(withVendorCSSClassPrefix(bem("consent-detail-text")), styles["container"]),
+		children: [/* @__PURE__ */ jsx(Typography_default, {
+			id,
+			variant,
+			fontWeight,
+			className: cx(withVendorCSSClassPrefix(bem("consent-detail-text", "text")), styles["text"], monospace && withVendorCSSClassPrefix(bem("consent-detail-text", "text", "monospace")), monospace && styles["monospace"], long && !expanded && styles["clamp"], className),
+			children: text
+		}), long && /* @__PURE__ */ jsx(ConsentDetailToggle, {
+			controls: id,
+			expanded,
+			onToggle: setExpanded,
+			t
+		})]
+	});
+};
+var ConsentDetailText_default = ConsentDetailText;
+
+//#endregion
+export { ConsentDetailToggle, ConsentDetailText_default as default };
+//# sourceMappingURL=ConsentDetailText.js.map

package/dist/components/auth/flow/ConsentDetailText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConsentDetailText.js","names":["ConsentDetailToggle: FC<ConsentDetailToggleProps>","useTheme","styles: Record<string, string>","label: string","resolveConsentText","ConsentDetailText: FC<ConsentDetailTextProps>","useStyles","long: boolean","isConsentDetailTextClamped","Typography"],"sources":["../../../../src/components/auth/flow/ConsentDetailText.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {bem, withVendorCSSClassPrefix} from '@thunderid/browser';\nimport {FC, ReactElement, useState} from 'react';\nimport useStyles, {useToggleStyles} from './ConsentDetailText.styles';\nimport resolveConsentText from './resolveConsentText';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport {UseTranslation} from '../../../hooks/useTranslation';\nimport {cx} from '../../../styles/emotion';\nimport isConsentDetailTextClamped from '../../../utils/isConsentDetailTextClamped';\nimport Typography from '../../primitives/Typography/Typography';\n\n/**\n * Props for the ConsentDetailToggle component.\n */\nexport interface ConsentDetailToggleProps {\n  /** Id of the element the toggle shows more or less of. */\n  controls?: string;\n  /** Whether everything is shown. */\n  expanded: boolean;\n  /** Number of items hidden while collapsed. When given, the collapsed label counts them. */\n  hiddenCount?: number;\n  /** Callback invoked with the next expanded state. */\n  onToggle: (expanded: boolean) => void;\n  /** translation data */\n  t?: UseTranslation['t'];\n}\n\n/**\n * Button that expands or collapses long authorization detail content.\n */\nexport const ConsentDetailToggle: FC<ConsentDetailToggleProps> = ({\n  controls = undefined,\n  expanded,\n  hiddenCount = undefined,\n  onToggle,\n  t = undefined,\n}: ConsentDetailToggleProps): ReactElement => {\n  const {theme, colorScheme}: ReturnType<typeof useTheme> = useTheme();\n  const styles: Record<string, string> = useToggleStyles(theme, colorScheme);\n\n  let label: string = resolveConsentText(t, 'consent.authorization_details.show_less');\n  if (!expanded) {\n    label =\n      hiddenCount === undefined\n        ? resolveConsentText(t, 'consent.authorization_details.show_more')\n        : resolveConsentText(t, 'consent.authorization_details.more_items', {count: hiddenCount});\n  }\n\n  return (\n    <button\n      type=\"button\"\n      className={cx(withVendorCSSClassPrefix(bem('consent-detail-text', 'toggle')), styles['toggle'])}\n      aria-controls={controls}\n      aria-expanded={expanded}\n      onClick={(): void => onToggle(!expanded)}\n    >\n      {label}\n    </button>\n  );\n};\n\n/**\n * Props for the ConsentDetailText component.\n */\nexport interface ConsentDetailTextProps {\n  /** Alignment of the text. */\n  align?: 'left' | 'right';\n  /** Class name applied to the text. */\n  className?: string;\n  /** Weight of the text. */\n  fontWeight?: 'normal' | 'medium' | 'semibold' | 'bold';\n  /** Id of the text element. */\n  id?: string;\n  /** Number of characters above which the text is clamped. */\n  maxChars: number;\n  /** Number of lines the text is clamped to. */\n  maxLines: number;\n  /** Shows the text as a preformatted monospace block, for structured JSON. */\n  monospace?: boolean;\n  /** translation data */\n  t?: UseTranslation['t'];\n  /** Text to show. */\n  text: string;\n  /** Typography variant of the text. */\n  variant?: 'body2' | 'subtitle2';\n}\n\n/**\n * Shows authorization detail text that wraps anywhere, so a long unbroken token such as an IBAN or a\n * URL never overflows. Text longer than its limit is clamped behind a toggle.\n */\nconst ConsentDetailText: FC<ConsentDetailTextProps> = ({\n  align = 'left',\n  className = undefined,\n  fontWeight = undefined,\n  id = undefined,\n  maxChars,\n  maxLines,\n  monospace = false,\n  t = undefined,\n  text,\n  variant = 'body2',\n}: ConsentDetailTextProps): ReactElement => {\n  const [expanded, setExpanded] = useState<boolean>(false);\n  const {theme, colorScheme}: ReturnType<typeof useTheme> = useTheme();\n  const styles: Record<string, string> = useStyles(theme, colorScheme, align, monospace, maxLines);\n  const long: boolean = isConsentDetailTextClamped(text, maxChars, maxLines);\n\n  return (\n    <div className={cx(withVendorCSSClassPrefix(bem('consent-detail-text')), styles['container'])}>\n      <Typography\n        id={id}\n        variant={variant}\n        fontWeight={fontWeight}\n        className={cx(\n          withVendorCSSClassPrefix(bem('consent-detail-text', 'text')),\n          styles['text'],\n          monospace && withVendorCSSClassPrefix(bem('consent-detail-text', 'text', 'monospace')),\n          monospace && styles['monospace'],\n          long && !expanded && styles['clamp'],\n          className,\n        )}\n      >\n        {text}\n      </Typography>\n      {long && <ConsentDetailToggle controls={id} expanded={expanded} onToggle={setExpanded} t={t} />}\n    </div>\n  );\n};\n\nexport default ConsentDetailText;\n"],"mappings":";;;;;;;;;;;;;;AAgCA,MAAaA,uBAAqD,EAChE,WAAW,QACX,UACA,cAAc,QACd,UACA,IAAI,aACwC;CAC5C,MAAM,EAAC,OAAO,gBAA4CC,kBAAU;CACpE,MAAMC,SAAiC,gBAAgB,OAAO,YAAY;CAE1E,IAAIC,QAAgBC,2BAAmB,GAAG,0CAA0C;AACpF,KAAI,CAAC,SACH,SACE,gBAAgB,SACZA,2BAAmB,GAAG,0CAA0C,GAChEA,2BAAmB,GAAG,4CAA4C,EAAC,OAAO,aAAY,CAAC;AAG/F,QACE,oBAAC;EACC,MAAK;EACL,WAAW,GAAG,yBAAyB,IAAI,uBAAuB,SAAS,CAAC,EAAE,OAAO,UAAU;EAC/F,iBAAe;EACf,iBAAe;EACf,eAAqB,SAAS,CAAC,SAAS;YAEvC;GACM;;;;;;AAkCb,MAAMC,qBAAiD,EACrD,QAAQ,QACR,YAAY,QACZ,aAAa,QACb,KAAK,QACL,UACA,UACA,YAAY,OACZ,IAAI,QACJ,MACA,UAAU,cACgC;CAC1C,MAAM,CAAC,UAAU,eAAe,SAAkB,MAAM;CACxD,MAAM,EAAC,OAAO,gBAA4CJ,kBAAU;CACpE,MAAMC,SAAiCI,iCAAU,OAAO,aAAa,OAAO,WAAW,SAAS;CAChG,MAAMC,OAAgBC,mCAA2B,MAAM,UAAU,SAAS;AAE1E,QACE,qBAAC;EAAI,WAAW,GAAG,yBAAyB,IAAI,sBAAsB,CAAC,EAAE,OAAO,aAAa;aAC3F,oBAACC;GACK;GACK;GACG;GACZ,WAAW,GACT,yBAAyB,IAAI,uBAAuB,OAAO,CAAC,EAC5D,OAAO,SACP,aAAa,yBAAyB,IAAI,uBAAuB,QAAQ,YAAY,CAAC,EACtF,aAAa,OAAO,cACpB,QAAQ,CAAC,YAAY,OAAO,UAC5B,UACD;aAEA;IACU,EACZ,QAAQ,oBAAC;GAAoB,UAAU;GAAc;GAAU,UAAU;GAAgB;IAAK;GAC3F;;AAIV,gCAAe"}

package/dist/components/auth/flow/ConsentDetailText.styles.d.ts

@@ -0,0 +1,20 @@
+import { Theme } from '@thunderid/browser';
+/**
+ * Creates styles for the ConsentDetailToggle component.
+ * @param theme - The theme object containing design tokens
+ * @param colorScheme - The current color scheme (used for memoization)
+ * @returns Object containing CSS class names for component styling
+ */
+export declare const useToggleStyles: (theme: Theme, colorScheme: string) => Record<string, string>;
+/**
+ * Creates styles for the ConsentDetailText component.
+ * @param theme - The theme object containing design tokens
+ * @param colorScheme - The current color scheme (used for memoization)
+ * @param align - Alignment of the text
+ * @param monospace - Whether the text is shown as a preformatted monospace block
+ * @param maxLines - Number of lines the text is clamped to
+ * @returns Object containing CSS class names for component styling
+ */
+declare const useStyles: (theme: Theme, colorScheme: string, align: "left" | "right", monospace: boolean, maxLines: number) => Record<string, string>;
+export default useStyles;
+//# sourceMappingURL=ConsentDetailText.styles.d.ts.map

package/dist/components/auth/flow/ConsentDetailText.styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConsentDetailText.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/auth/flow/ConsentDetailText.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,KAAK,EAAC,MAAM,oBAAoB,CAAC;AAIzC;;;;;GAKG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO,KAAK,EAAE,aAAa,MAAM,KAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAiBtF,CAAC;AAEJ;;;;;;;;GAQG;AACH,QAAA,MAAM,SAAS,GACb,OAAO,KAAK,EACZ,aAAa,MAAM,EACnB,OAAO,MAAM,GAAG,OAAO,EACvB,WAAW,OAAO,EAClB,UAAU,MAAM,KACf,MAAM,CAAC,MAAM,EAAE,MAAM,CAsCrB,CAAC;AAEJ,eAAe,SAAS,CAAC"}

package/dist/components/auth/flow/ConsentDetailText.styles.js

@@ -0,0 +1,80 @@
+import { css } from "../../../styles/emotion.js";
+import { useMemo } from "react";
+
+//#region src/components/auth/flow/ConsentDetailText.styles.ts
+/**
+* Creates styles for the ConsentDetailToggle component.
+* @param theme - The theme object containing design tokens
+* @param colorScheme - The current color scheme (used for memoization)
+* @returns Object containing CSS class names for component styling
+*/
+const useToggleStyles = (theme, colorScheme) => useMemo(() => ({ toggle: css({
+	background: "transparent",
+	border: "none",
+	borderRadius: "4px",
+	color: theme.vars.colors.primary.main,
+	cursor: "pointer",
+	font: "inherit",
+	fontSize: "0.8125rem",
+	padding: "2px 4px",
+	"&:hover": { textDecoration: "underline" },
+	"&:focus-visible": {
+		outline: `2px solid ${theme.vars.colors.primary.main}`,
+		outlineOffset: "1px"
+	}
+}) }), [theme, colorScheme]);
+/**
+* Creates styles for the ConsentDetailText component.
+* @param theme - The theme object containing design tokens
+* @param colorScheme - The current color scheme (used for memoization)
+* @param align - Alignment of the text
+* @param monospace - Whether the text is shown as a preformatted monospace block
+* @param maxLines - Number of lines the text is clamped to
+* @returns Object containing CSS class names for component styling
+*/
+const useStyles = (theme, colorScheme, align, monospace, maxLines) => useMemo(() => ({
+	clamp: css({
+		display: "-webkit-box",
+		overflow: "hidden",
+		WebkitBoxOrient: "vertical",
+		WebkitLineClamp: maxLines
+	}),
+	container: css({
+		alignItems: align === "right" ? "flex-end" : "flex-start",
+		display: "flex",
+		flexDirection: "column",
+		gap: "2px",
+		maxWidth: "100%",
+		minWidth: 0
+	}),
+	monospace: css({
+		background: theme.vars.colors.action.hover,
+		border: `1px solid ${theme.vars.colors.border}`,
+		borderRadius: "4px",
+		boxSizing: "border-box",
+		fontFamily: "ui-monospace, SFMono-Regular, Menlo, Consolas, monospace",
+		fontSize: "0.75rem",
+		padding: "6px 8px",
+		width: "100%"
+	}),
+	text: css({
+		lineHeight: 1.45,
+		margin: 0,
+		maxWidth: "100%",
+		overflowWrap: "anywhere",
+		textAlign: align,
+		whiteSpace: monospace ? "pre-wrap" : "normal",
+		wordBreak: "normal"
+	})
+}), [
+	theme,
+	colorScheme,
+	align,
+	monospace,
+	maxLines
+]);
+var ConsentDetailText_styles_default = useStyles;
+
+//#endregion
+export { ConsentDetailText_styles_default as default, useToggleStyles };
+//# sourceMappingURL=ConsentDetailText.styles.js.map

package/dist/components/auth/flow/ConsentDetailText.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConsentDetailText.styles.js","names":[],"sources":["../../../../src/components/auth/flow/ConsentDetailText.styles.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Theme} from '@thunderid/browser';\nimport {useMemo} from 'react';\nimport {css} from '../../../styles/emotion';\n\n/**\n * Creates styles for the ConsentDetailToggle component.\n * @param theme - The theme object containing design tokens\n * @param colorScheme - The current color scheme (used for memoization)\n * @returns Object containing CSS class names for component styling\n */\nexport const useToggleStyles = (theme: Theme, colorScheme: string): Record<string, string> =>\n  useMemo(\n    () => ({\n      toggle: css({\n        background: 'transparent',\n        border: 'none',\n        borderRadius: '4px',\n        color: theme.vars.colors.primary.main,\n        cursor: 'pointer',\n        font: 'inherit',\n        fontSize: '0.8125rem',\n        padding: '2px 4px',\n        '&:hover': {textDecoration: 'underline'},\n        '&:focus-visible': {outline: `2px solid ${theme.vars.colors.primary.main}`, outlineOffset: '1px'},\n      }),\n    }),\n    [theme, colorScheme],\n  );\n\n/**\n * Creates styles for the ConsentDetailText component.\n * @param theme - The theme object containing design tokens\n * @param colorScheme - The current color scheme (used for memoization)\n * @param align - Alignment of the text\n * @param monospace - Whether the text is shown as a preformatted monospace block\n * @param maxLines - Number of lines the text is clamped to\n * @returns Object containing CSS class names for component styling\n */\nconst useStyles = (\n  theme: Theme,\n  colorScheme: string,\n  align: 'left' | 'right',\n  monospace: boolean,\n  maxLines: number,\n): Record<string, string> =>\n  useMemo(\n    () => ({\n      clamp: css({\n        display: '-webkit-box',\n        overflow: 'hidden',\n        WebkitBoxOrient: 'vertical',\n        WebkitLineClamp: maxLines,\n      }),\n      container: css({\n        alignItems: align === 'right' ? 'flex-end' : 'flex-start',\n        display: 'flex',\n        flexDirection: 'column',\n        gap: '2px',\n        maxWidth: '100%',\n        minWidth: 0,\n      }),\n      monospace: css({\n        background: theme.vars.colors.action.hover,\n        border: `1px solid ${theme.vars.colors.border}`,\n        borderRadius: '4px',\n        boxSizing: 'border-box',\n        fontFamily: 'ui-monospace, SFMono-Regular, Menlo, Consolas, monospace',\n        fontSize: '0.75rem',\n        padding: '6px 8px',\n        width: '100%',\n      }),\n      text: css({\n        lineHeight: 1.45,\n        margin: 0,\n        maxWidth: '100%',\n        overflowWrap: 'anywhere',\n        textAlign: align,\n        whiteSpace: monospace ? 'pre-wrap' : 'normal',\n        wordBreak: 'normal',\n      }),\n    }),\n    [theme, colorScheme, align, monospace, maxLines],\n  );\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;;AAaA,MAAa,mBAAmB,OAAc,gBAC5C,eACS,EACL,QAAQ,IAAI;CACV,YAAY;CACZ,QAAQ;CACR,cAAc;CACd,OAAO,MAAM,KAAK,OAAO,QAAQ;CACjC,QAAQ;CACR,MAAM;CACN,UAAU;CACV,SAAS;CACT,WAAW,EAAC,gBAAgB,aAAY;CACxC,mBAAmB;EAAC,SAAS,aAAa,MAAM,KAAK,OAAO,QAAQ;EAAQ,eAAe;EAAM;CAClG,CAAC,EACH,GACD,CAAC,OAAO,YAAY,CACrB;;;;;;;;;;AAWH,MAAM,aACJ,OACA,aACA,OACA,WACA,aAEA,eACS;CACL,OAAO,IAAI;EACT,SAAS;EACT,UAAU;EACV,iBAAiB;EACjB,iBAAiB;EAClB,CAAC;CACF,WAAW,IAAI;EACb,YAAY,UAAU,UAAU,aAAa;EAC7C,SAAS;EACT,eAAe;EACf,KAAK;EACL,UAAU;EACV,UAAU;EACX,CAAC;CACF,WAAW,IAAI;EACb,YAAY,MAAM,KAAK,OAAO,OAAO;EACrC,QAAQ,aAAa,MAAM,KAAK,OAAO;EACvC,cAAc;EACd,WAAW;EACX,YAAY;EACZ,UAAU;EACV,SAAS;EACT,OAAO;EACR,CAAC;CACF,MAAM,IAAI;EACR,YAAY;EACZ,QAAQ;EACR,UAAU;EACV,cAAc;EACd,WAAW;EACX,YAAY,YAAY,aAAa;EACrC,WAAW;EACZ,CAAC;CACH,GACD;CAAC;CAAO;CAAa;CAAO;CAAW;CAAS,CACjD;AAEH,uCAAe"}

package/dist/components/auth/flow/FieldFactory.js

@@ -1,7 +1,7 @@
+import TextField_default from "../../primitives/TextField/TextField.js";
 import Checkbox_default from "../../primitives/Checkbox/Checkbox.js";
 import DatePicker_default from "../../primitives/DatePicker/DatePicker.js";
 import OtpField_default from "../../primitives/OtpField/OtpField.js";
-import TextField_default from "../../primitives/TextField/TextField.js";
 import PasswordField_default from "../../primitives/PasswordField/PasswordField.js";
 import Select_default from "../../primitives/Select/Select.js";
 import { FieldType } from "@thunderid/browser";

package/dist/components/auth/flow/resolveConsentText.d.ts

@@ -0,0 +1,13 @@
+import { UseTranslation } from '../../../hooks/useTranslation';
+/**
+ * Resolves a consent screen string through the given translator, falling back to the SDK's default
+ * bundle when there is no translator or it has no entry for the key.
+ *
+ * @param t - Translator, when the screen has one.
+ * @param key - Translation key.
+ * @param params - Values to substitute into the text.
+ * @returns The resolved text.
+ */
+declare const resolveConsentText: (t: UseTranslation["t"] | undefined, key: string, params?: Record<string, string | number>) => string;
+export default resolveConsentText;
+//# sourceMappingURL=resolveConsentText.d.ts.map

package/dist/components/auth/flow/resolveConsentText.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveConsentText.d.ts","sourceRoot":"","sources":["../../../../src/components/auth/flow/resolveConsentText.ts"],"names":[],"mappings":"AASA,OAAO,EAAC,cAAc,EAAC,MAAM,+BAA+B,CAAC;AAE7D;;;;;;;;GAQG;AACH,QAAA,MAAM,kBAAkB,GACtB,GAAG,cAAc,CAAC,GAAG,CAAC,GAAG,SAAS,EAClC,KAAK,MAAM,EACX,SAAS,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,CAAC,KACvC,MASF,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/dist/components/auth/flow/resolveConsentText.js

@@ -0,0 +1,23 @@
+import { TranslationBundleConstants, getDefaultI18nBundles, substituteTranslationParams } from "@thunderid/browser";
+
+//#region src/components/auth/flow/resolveConsentText.ts
+/**
+* Resolves a consent screen string through the given translator, falling back to the SDK's default
+* bundle when there is no translator or it has no entry for the key.
+*
+* @param t - Translator, when the screen has one.
+* @param key - Translation key.
+* @param params - Values to substitute into the text.
+* @returns The resolved text.
+*/
+const resolveConsentText = (t, key, params) => {
+	const translated = t?.(key, params);
+	if (translated && translated !== key) return translated;
+	const fallback = getDefaultI18nBundles()[TranslationBundleConstants.FALLBACK_LOCALE]?.translations[key];
+	return substituteTranslationParams(fallback ?? key, params);
+};
+var resolveConsentText_default = resolveConsentText;
+
+//#endregion
+export { resolveConsentText_default as default };
+//# sourceMappingURL=resolveConsentText.js.map

package/dist/components/auth/flow/resolveConsentText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"resolveConsentText.js","names":["translated: string | undefined","fallback: string | undefined"],"sources":["../../../../src/components/auth/flow/resolveConsentText.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n  getDefaultI18nBundles,\n  I18nBundle,\n  substituteTranslationParams,\n  TranslationBundleConstants,\n} from '@thunderid/browser';\nimport {UseTranslation} from '../../../hooks/useTranslation';\n\n/**\n * Resolves a consent screen string through the given translator, falling back to the SDK's default\n * bundle when there is no translator or it has no entry for the key.\n *\n * @param t - Translator, when the screen has one.\n * @param key - Translation key.\n * @param params - Values to substitute into the text.\n * @returns The resolved text.\n */\nconst resolveConsentText = (\n  t: UseTranslation['t'] | undefined,\n  key: string,\n  params?: Record<string, string | number>,\n): string => {\n  const translated: string | undefined = t?.(key, params);\n  if (translated && translated !== key) {\n    return translated;\n  }\n  const bundle: I18nBundle | undefined = getDefaultI18nBundles()[TranslationBundleConstants.FALLBACK_LOCALE];\n  const fallback: string | undefined = bundle?.translations[key as keyof I18nBundle['translations']];\n\n  return substituteTranslationParams(fallback ?? key, params);\n};\n\nexport default resolveConsentText;\n"],"mappings":";;;;;;;;;;;;AAoBA,MAAM,sBACJ,GACA,KACA,WACW;CACX,MAAMA,aAAiC,IAAI,KAAK,OAAO;AACvD,KAAI,cAAc,eAAe,IAC/B,QAAO;CAGT,MAAMC,WADiC,uBAAuB,CAAC,2BAA2B,kBAC7C,aAAa;AAE1D,QAAO,4BAA4B,YAAY,KAAK,OAAO;;AAG7D,iCAAe"}

package/dist/components/primitives/KeyValueInput/KeyValueInput.js

@@ -1,8 +1,8 @@
 import { cx } from "../../../styles/emotion.js";
 import useTheme_default from "../../../contexts/Theme/useTheme.js";
+import TextField_default from "../TextField/TextField.js";
 import Plus_default from "../Icons/Plus.js";
 import X_default from "../Icons/X.js";
-import TextField_default from "../TextField/TextField.js";
 import KeyValueInput_styles_default from "./KeyValueInput.styles.js";
 import { bem, withVendorCSSClassPrefix } from "@thunderid/browser";
 import { useCallback, useState } from "react";

package/dist/components/primitives/MultiInput/MultiInput.js

@@ -2,9 +2,9 @@ import { cx } from "../../../styles/emotion.js";
 import useTheme_default from "../../../contexts/Theme/useTheme.js";
 import FormControl_default from "../FormControl/FormControl.js";
 import InputLabel_default from "../InputLabel/InputLabel.js";
+import TextField_default from "../TextField/TextField.js";
 import Checkbox_default from "../Checkbox/Checkbox.js";
 import DatePicker_default from "../DatePicker/DatePicker.js";
-import TextField_default from "../TextField/TextField.js";
 import MultiInput_styles_default from "./MultiInput.styles.js";
 import { bem, withVendorCSSClassPrefix } from "@thunderid/browser";
 import { useCallback, useId, useState } from "react";

package/dist/components/primitives/PasswordField/PasswordField.js

@@ -1,9 +1,9 @@
 import { cx } from "../../../styles/emotion.js";
 import useTheme_default from "../../../contexts/Theme/useTheme.js";
+import TextField_default from "../TextField/TextField.js";
 import Eye_default from "../Icons/Eye.js";
 import EyeOff_default from "../Icons/EyeOff.js";
 import PasswordField_styles_default from "./PasswordField.styles.js";
-import TextField_default from "../TextField/TextField.js";
 import { bem, withVendorCSSClassPrefix } from "@thunderid/browser";
 import { useState } from "react";
 import { jsx } from "react/jsx-runtime";

package/dist/contexts/Theme/ThemeProvider.d.ts

@@ -7,7 +7,8 @@ export interface ThemeProviderProps {
      */
     designTheme?: FlowMetaTheme | null;
     /**
-     * Initial color scheme override. Overrides the server default when provided.
+     * Color scheme override. Overrides the server default when provided, and the color scheme follows it
+     * when it changes.
      */
     mode?: ThemeMode;
     /**

package/dist/contexts/Theme/ThemeProvider.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/contexts/Theme/ThemeProvider.tsx"],"names":[],"mappings":"AAGA,OAAO,EAKL,aAAa,EACb,gBAAgB,EAEhB,WAAW,EACX,SAAS,EACV,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EAAC,EAAE,EAAE,iBAAiB,EAAsE,MAAM,OAAO,CAAC;AAOjH,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,WAAW,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IACnC;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;CACvC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,CAsH5D,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/contexts/Theme/ThemeProvider.tsx"],"names":[],"mappings":"AAGA,OAAO,EAKL,aAAa,EACb,gBAAgB,EAEhB,WAAW,EACX,SAAS,EACV,MAAM,oBAAoB,CAAC;AAC5B,OAAO,EACL,EAAE,EAEF,iBAAiB,EAQlB,MAAM,OAAO,CAAC;AAQf,MAAM,WAAW,kBAAkB;IACjC;;;OAGG;IACH,WAAW,CAAC,EAAE,aAAa,GAAG,IAAI,CAAC;IACnC;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IAEjB;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,WAAW,CAAC,CAAC;CACvC;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,CAwJ5D,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/dist/contexts/Theme/ThemeProvider.js

@@ -1,10 +1,11 @@
 import FlowMetaContext_default from "../FlowMeta/FlowMetaContext.js";
 import ThemeContext_default from "./ThemeContext.js";
+import ThemeRootContext_default from "./ThemeRootContext.js";
 import applyThemeToDOM_default from "../../utils/applyThemeToDOM.js";
 import buildThemeConfigFromFlowMeta_default from "../../utils/buildThemeConfigFromFlowMeta.js";
 import normalizeThemeConfig_default from "../../utils/normalizeThemeConfig.js";
 import { createClassObserver, createMediaQueryListener, createTheme, detectThemeMode } from "@thunderid/browser";
-import { useCallback, useContext, useEffect, useMemo, useState } from "react";
+import { useCallback, useContext, useEffect, useMemo, useRef, useState } from "react";
 import { jsx } from "react/jsx-runtime";
 
 //#region src/contexts/Theme/ThemeProvider.tsx
@@ -49,6 +50,11 @@ const ThemeProvider = ({ children, designTheme = void 0, mode, theme: themeOverr
 		return flowMetaTheme?.defaultColorScheme ?? "light";
 	};
 	const [colorScheme, setColorScheme] = useState(getInitialColorScheme);
+	const [seededMode, setSeededMode] = useState(mode);
+	if (mode !== seededMode) {
+		setSeededMode(mode);
+		if (mode !== void 0) setColorScheme(getInitialColorScheme());
+	}
 	useEffect(() => {
 		if (mode === void 0 && flowMetaTheme?.defaultColorScheme) setColorScheme(flowMetaTheme.defaultColorScheme);
 	}, [mode, flowMetaTheme?.defaultColorScheme]);
@@ -99,12 +105,33 @@ const ThemeProvider = ({ children, designTheme = void 0, mode, theme: themeOverr
 	]);
 	const theme = useMemo(() => createTheme(finalThemeConfig, colorScheme === "dark"), [finalThemeConfig, colorScheme]);
 	const direction = flowMetaTheme?.direction ?? "ltr";
+	const parentRoot = useContext(ThemeRootContext_default);
+	const claims = useRef(0);
+	const applied = useRef(null);
+	const applyToRoot = useCallback(() => {
+		if (!applied.current || typeof document === "undefined") return;
+		applyThemeToDOM_default(applied.current.theme);
+		document.documentElement.dir = applied.current.direction;
+	}, []);
+	const root = useMemo(() => ({ claim: () => {
+		claims.current += 1;
+		return () => {
+			claims.current -= 1;
+			if (claims.current === 0) applyToRoot();
+		};
+	} }), [applyToRoot]);
+	useEffect(() => parentRoot?.claim(), [parentRoot]);
 	useEffect(() => {
-		applyThemeToDOM_default(theme);
-	}, [theme]);
-	useEffect(() => {
-		if (typeof document !== "undefined") document.documentElement.dir = direction;
-	}, [direction]);
+		applied.current = {
+			direction,
+			theme
+		};
+		if (claims.current === 0) applyToRoot();
+	}, [
+		applyToRoot,
+		direction,
+		theme
+	]);
 	const value = {
 		colorScheme,
 		direction,
@@ -113,7 +140,10 @@ const ThemeProvider = ({ children, designTheme = void 0, mode, theme: themeOverr
 	};
 	return /* @__PURE__ */ jsx(ThemeContext_default.Provider, {
 		value,
-		children
+		children: /* @__PURE__ */ jsx(ThemeRootContext_default.Provider, {
+			value: root,
+			children
+		})
 	});
 };
 var ThemeProvider_default = ThemeProvider;

package/dist/contexts/Theme/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","names":["ThemeProvider: FC<PropsWithChildren<ThemeProviderProps>>","themeOverride: RecursivePartial<ThemeConfig> | undefined","normalizeThemeConfig","flowMetaContext: FlowMetaContextValue | null","FlowMetaContext","flowMetaTheme: FlowMetaTheme | null","toggleTheme: () => void","finalThemeConfig: RecursivePartial<ThemeConfig> | undefined","metaConfig: RecursivePartial<ThemeConfig>","buildThemeConfigFromFlowMeta","theme: Theme","direction: 'ltr' | 'rtl'","value: any","ThemeContext"],"sources":["../../../src/contexts/Theme/ThemeProvider.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n  createClassObserver,\n  createMediaQueryListener,\n  createTheme,\n  detectThemeMode,\n  FlowMetaTheme,\n  RecursivePartial,\n  Theme,\n  ThemeConfig,\n  ThemeMode,\n} from '@thunderid/browser';\nimport {FC, PropsWithChildren, ReactElement, useCallback, useContext, useEffect, useMemo, useState} from 'react';\nimport ThemeContext from './ThemeContext';\nimport applyThemeToDOM from '../../utils/applyThemeToDOM';\nimport buildThemeConfigFromFlowMeta from '../../utils/buildThemeConfigFromFlowMeta';\nimport normalizeThemeConfig from '../../utils/normalizeThemeConfig';\nimport FlowMetaContext, {FlowMetaContextValue} from '../FlowMeta/FlowMetaContext';\n\nexport interface ThemeProviderProps {\n  /**\n   * A Design theme to use instead of the one the server returns in flow meta, for example the theme an\n   * app configuration names. `theme` overrides are still applied on top.\n   */\n  designTheme?: FlowMetaTheme | null;\n  /**\n   * Initial color scheme override. Overrides the server default when provided.\n   */\n  mode?: ThemeMode;\n\n  /**\n   * Optional theme overrides merged on top of the server-side flow meta theme.\n   * User-supplied values take highest precedence.\n   */\n  theme?: RecursivePartial<ThemeConfig>;\n}\n\n/**\n * ThemeProvider is the v2 drop-in replacement for `ThemeProvider`.\n *\n * It reads the design theme from the nearest `FlowMetaContext` (provided by\n * `FlowMetaProvider`) and publishes a resolved `Theme` object through the\n * **same** `ThemeContext` that `useTheme` consumes.  This means all existing\n * components that call `useTheme` continue to work without any changes.\n *\n * The `defaultColorScheme` field returned by the server is used to seed the\n * active color scheme; the user can still toggle it locally via the\n * `toggleTheme` value exposed in the context.\n *\n * @example\n * ```tsx\n * <FlowMetaProvider config={{ baseUrl, type: FlowMetaType.App, id: appId }}>\n *   <ThemeProvider>\n *     <App />   {/* useTheme() works here as usual *\\/}\n *   </ThemeProvider>\n * </FlowMetaProvider>\n * ```\n *\n * @example\n * With user theme overrides (user values win over server values):\n * ```tsx\n * <ThemeProvider theme={{ colors: { primary: { main: '#ff0000' } } }}>\n *   <App />\n * </ThemeProvider>\n * ```\n */\nconst ThemeProvider: FC<PropsWithChildren<ThemeProviderProps>> = ({\n  children,\n  designTheme = undefined,\n  mode,\n  theme: themeOverrideProp,\n}: PropsWithChildren<ThemeProviderProps>): ReactElement => {\n  const themeOverride: RecursivePartial<ThemeConfig> | undefined = normalizeThemeConfig(themeOverrideProp);\n  const flowMetaContext: FlowMetaContextValue | null = useContext(FlowMetaContext);\n\n  const flowMetaTheme: FlowMetaTheme | null = designTheme ?? flowMetaContext?.meta?.design?.theme ?? null;\n  const isLoading: boolean = flowMetaContext?.isLoading ?? false;\n  const error: Error | null = flowMetaContext?.error ?? null;\n\n  // Seed the color scheme: a fixed mode wins outright, 'system'/'class' detect it from the\n  // environment via the same shared utilities Vue's ThemeProvider uses, and no mode falls back\n  // to the server's default (unchanged pre-`mode` behavior).\n  const getInitialColorScheme = (): 'light' | 'dark' => {\n    if (mode === 'light' || mode === 'dark') return mode;\n    if (mode === 'system' || mode === 'class') return detectThemeMode(mode);\n    return flowMetaTheme?.defaultColorScheme ?? 'light';\n  };\n\n  const [colorScheme, setColorScheme] = useState<'light' | 'dark'>(getInitialColorScheme);\n\n  // When mode is unset, sync the color scheme with the server default once flow meta loads.\n  useEffect(() => {\n    if (mode === undefined && flowMetaTheme?.defaultColorScheme) {\n      setColorScheme(flowMetaTheme.defaultColorScheme);\n    }\n  }, [mode, flowMetaTheme?.defaultColorScheme]);\n\n  // Set up automatic detection listeners for 'system'/'class' modes.\n  useEffect(() => {\n    if (mode !== 'system' && mode !== 'class') return undefined;\n\n    const handleThemeChange = (isDark: boolean): void => {\n      setColorScheme(isDark ? 'dark' : 'light');\n    };\n\n    if (mode === 'class') {\n      if (typeof document === 'undefined') return undefined;\n      const observer = createClassObserver(document.documentElement, handleThemeChange);\n      return () => {\n        observer.disconnect();\n      };\n    }\n\n    const mediaQuery = createMediaQueryListener(handleThemeChange);\n    return () => {\n      mediaQuery?.disconnect();\n    };\n  }, [mode]);\n\n  const toggleTheme: () => void = useCallback(() => {\n    setColorScheme((prev: 'light' | 'dark') => (prev === 'light' ? 'dark' : 'light'));\n  }, []);\n\n  // Build the resolved ThemeConfig: flow meta base → user overrides on top.\n  const finalThemeConfig: RecursivePartial<ThemeConfig> | undefined = useMemo(() => {\n    if (!flowMetaTheme) {\n      return themeOverride;\n    }\n\n    const metaConfig: RecursivePartial<ThemeConfig> = buildThemeConfigFromFlowMeta(flowMetaTheme, colorScheme);\n\n    if (!themeOverride) {\n      return metaConfig;\n    }\n\n    return {\n      ...metaConfig,\n      ...themeOverride,\n      borderRadius: {\n        ...metaConfig.borderRadius,\n        ...themeOverride.borderRadius,\n      },\n      colors: {\n        ...metaConfig.colors,\n        ...themeOverride.colors,\n      },\n      ...(metaConfig.typography || themeOverride.typography\n        ? {\n            typography: {\n              ...(metaConfig as any).typography,\n              ...themeOverride.typography,\n            },\n          }\n        : {}),\n    };\n  }, [flowMetaTheme, colorScheme, themeOverride]);\n\n  const theme: Theme = useMemo(\n    () => createTheme(finalThemeConfig, colorScheme === 'dark'),\n    [finalThemeConfig, colorScheme],\n  );\n\n  const direction: 'ltr' | 'rtl' = flowMetaTheme?.direction ?? 'ltr';\n\n  // Apply CSS variables to the document root.\n  useEffect(() => {\n    applyThemeToDOM(theme);\n  }, [theme]);\n\n  // Apply text direction to the document root.\n  useEffect(() => {\n    if (typeof document !== 'undefined') {\n      document.documentElement.dir = direction;\n    }\n  }, [direction]);\n\n  const value: any = {\n    colorScheme,\n    direction,\n    theme,\n    toggleTheme,\n  };\n\n  return <ThemeContext.Provider value={value}>{children}</ThemeContext.Provider>;\n};\n\nexport default ThemeProvider;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoEA,MAAMA,iBAA4D,EAChE,UACA,cAAc,QACd,MACA,OAAO,wBACkD;CACzD,MAAMC,gBAA2DC,6BAAqB,kBAAkB;CACxG,MAAMC,kBAA+C,WAAWC,wBAAgB;CAEhF,MAAMC,gBAAsC,eAAe,iBAAiB,MAAM,QAAQ,SAAS;AACxE,kBAAiB;AAChB,kBAAiB;CAK7C,MAAM,8BAAgD;AACpD,MAAI,SAAS,WAAW,SAAS,OAAQ,QAAO;AAChD,MAAI,SAAS,YAAY,SAAS,QAAS,QAAO,gBAAgB,KAAK;AACvE,SAAO,eAAe,sBAAsB;;CAG9C,MAAM,CAAC,aAAa,kBAAkB,SAA2B,sBAAsB;AAGvF,iBAAgB;AACd,MAAI,SAAS,UAAa,eAAe,mBACvC,gBAAe,cAAc,mBAAmB;IAEjD,CAAC,MAAM,eAAe,mBAAmB,CAAC;AAG7C,iBAAgB;AACd,MAAI,SAAS,YAAY,SAAS,QAAS,QAAO;EAElD,MAAM,qBAAqB,WAA0B;AACnD,kBAAe,SAAS,SAAS,QAAQ;;AAG3C,MAAI,SAAS,SAAS;AACpB,OAAI,OAAO,aAAa,YAAa,QAAO;GAC5C,MAAM,WAAW,oBAAoB,SAAS,iBAAiB,kBAAkB;AACjF,gBAAa;AACX,aAAS,YAAY;;;EAIzB,MAAM,aAAa,yBAAyB,kBAAkB;AAC9D,eAAa;AACX,eAAY,YAAY;;IAEzB,CAAC,KAAK,CAAC;CAEV,MAAMC,cAA0B,kBAAkB;AAChD,kBAAgB,SAA4B,SAAS,UAAU,SAAS,QAAS;IAChF,EAAE,CAAC;CAGN,MAAMC,mBAA8D,cAAc;AAChF,MAAI,CAAC,cACH,QAAO;EAGT,MAAMC,aAA4CC,qCAA6B,eAAe,YAAY;AAE1G,MAAI,CAAC,cACH,QAAO;AAGT,SAAO;GACL,GAAG;GACH,GAAG;GACH,cAAc;IACZ,GAAG,WAAW;IACd,GAAG,cAAc;IAClB;GACD,QAAQ;IACN,GAAG,WAAW;IACd,GAAG,cAAc;IAClB;GACD,GAAI,WAAW,cAAc,cAAc,aACvC,EACE,YAAY;IACV,GAAI,WAAmB;IACvB,GAAG,cAAc;IAClB,EACF,GACD,EAAE;GACP;IACA;EAAC;EAAe;EAAa;EAAc,CAAC;CAE/C,MAAMC,QAAe,cACb,YAAY,kBAAkB,gBAAgB,OAAO,EAC3D,CAAC,kBAAkB,YAAY,CAChC;CAED,MAAMC,YAA2B,eAAe,aAAa;AAG7D,iBAAgB;AACd,0BAAgB,MAAM;IACrB,CAAC,MAAM,CAAC;AAGX,iBAAgB;AACd,MAAI,OAAO,aAAa,YACtB,UAAS,gBAAgB,MAAM;IAEhC,CAAC,UAAU,CAAC;CAEf,MAAMC,QAAa;EACjB;EACA;EACA;EACA;EACD;AAED,QAAO,oBAACC,qBAAa;EAAgB;EAAQ;GAAiC;;AAGhF,4BAAe"}
+{"version":3,"file":"ThemeProvider.js","names":["ThemeProvider: FC<PropsWithChildren<ThemeProviderProps>>","themeOverride: RecursivePartial<ThemeConfig> | undefined","normalizeThemeConfig","flowMetaContext: FlowMetaContextValue | null","FlowMetaContext","flowMetaTheme: FlowMetaTheme | null","toggleTheme: () => void","finalThemeConfig: RecursivePartial<ThemeConfig> | undefined","metaConfig: RecursivePartial<ThemeConfig>","buildThemeConfigFromFlowMeta","theme: Theme","direction: 'ltr' | 'rtl'","parentRoot: ThemeRootContextValue | null","ThemeRootContext","claims: MutableRefObject<number>","applied: MutableRefObject<{direction: 'ltr' | 'rtl'; theme: Theme} | null>","applyToRoot: () => void","root: ThemeRootContextValue","value: any","ThemeContext"],"sources":["../../../src/contexts/Theme/ThemeProvider.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n  createClassObserver,\n  createMediaQueryListener,\n  createTheme,\n  detectThemeMode,\n  FlowMetaTheme,\n  RecursivePartial,\n  Theme,\n  ThemeConfig,\n  ThemeMode,\n} from '@thunderid/browser';\nimport {\n  FC,\n  MutableRefObject,\n  PropsWithChildren,\n  ReactElement,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from 'react';\nimport ThemeContext from './ThemeContext';\nimport ThemeRootContext, {ThemeRootContextValue} from './ThemeRootContext';\nimport applyThemeToDOM from '../../utils/applyThemeToDOM';\nimport buildThemeConfigFromFlowMeta from '../../utils/buildThemeConfigFromFlowMeta';\nimport normalizeThemeConfig from '../../utils/normalizeThemeConfig';\nimport FlowMetaContext, {FlowMetaContextValue} from '../FlowMeta/FlowMetaContext';\n\nexport interface ThemeProviderProps {\n  /**\n   * A Design theme to use instead of the one the server returns in flow meta, for example the theme an\n   * app configuration names. `theme` overrides are still applied on top.\n   */\n  designTheme?: FlowMetaTheme | null;\n  /**\n   * Color scheme override. Overrides the server default when provided, and the color scheme follows it\n   * when it changes.\n   */\n  mode?: ThemeMode;\n\n  /**\n   * Optional theme overrides merged on top of the server-side flow meta theme.\n   * User-supplied values take highest precedence.\n   */\n  theme?: RecursivePartial<ThemeConfig>;\n}\n\n/**\n * ThemeProvider is the v2 drop-in replacement for `ThemeProvider`.\n *\n * It reads the design theme from the nearest `FlowMetaContext` (provided by\n * `FlowMetaProvider`) and publishes a resolved `Theme` object through the\n * **same** `ThemeContext` that `useTheme` consumes.  This means all existing\n * components that call `useTheme` continue to work without any changes.\n *\n * The `defaultColorScheme` field returned by the server is used to seed the\n * active color scheme; the user can still toggle it locally via the\n * `toggleTheme` value exposed in the context.\n *\n * @example\n * ```tsx\n * <FlowMetaProvider config={{ baseUrl, type: FlowMetaType.App, id: appId }}>\n *   <ThemeProvider>\n *     <App />   {/* useTheme() works here as usual *\\/}\n *   </ThemeProvider>\n * </FlowMetaProvider>\n * ```\n *\n * @example\n * With user theme overrides (user values win over server values):\n * ```tsx\n * <ThemeProvider theme={{ colors: { primary: { main: '#ff0000' } } }}>\n *   <App />\n * </ThemeProvider>\n * ```\n */\nconst ThemeProvider: FC<PropsWithChildren<ThemeProviderProps>> = ({\n  children,\n  designTheme = undefined,\n  mode,\n  theme: themeOverrideProp,\n}: PropsWithChildren<ThemeProviderProps>): ReactElement => {\n  const themeOverride: RecursivePartial<ThemeConfig> | undefined = normalizeThemeConfig(themeOverrideProp);\n  const flowMetaContext: FlowMetaContextValue | null = useContext(FlowMetaContext);\n\n  const flowMetaTheme: FlowMetaTheme | null = designTheme ?? flowMetaContext?.meta?.design?.theme ?? null;\n  const isLoading: boolean = flowMetaContext?.isLoading ?? false;\n  const error: Error | null = flowMetaContext?.error ?? null;\n\n  // Seed the color scheme: a fixed mode wins outright, 'system'/'class' detect it from the\n  // environment via the same shared utilities Vue's ThemeProvider uses, and no mode falls back\n  // to the server's default (unchanged pre-`mode` behavior).\n  const getInitialColorScheme = (): 'light' | 'dark' => {\n    if (mode === 'light' || mode === 'dark') return mode;\n    if (mode === 'system' || mode === 'class') return detectThemeMode(mode);\n    return flowMetaTheme?.defaultColorScheme ?? 'light';\n  };\n\n  const [colorScheme, setColorScheme] = useState<'light' | 'dark'>(getInitialColorScheme);\n\n  // Follow a change of mode after mount, such as a host app's own color scheme toggle.\n  const [seededMode, setSeededMode] = useState<ThemeMode | undefined>(mode);\n\n  if (mode !== seededMode) {\n    setSeededMode(mode);\n    if (mode !== undefined) {\n      setColorScheme(getInitialColorScheme());\n    }\n  }\n\n  // When mode is unset, sync the color scheme with the server default once flow meta loads.\n  useEffect(() => {\n    if (mode === undefined && flowMetaTheme?.defaultColorScheme) {\n      setColorScheme(flowMetaTheme.defaultColorScheme);\n    }\n  }, [mode, flowMetaTheme?.defaultColorScheme]);\n\n  // Set up automatic detection listeners for 'system'/'class' modes.\n  useEffect(() => {\n    if (mode !== 'system' && mode !== 'class') return undefined;\n\n    const handleThemeChange = (isDark: boolean): void => {\n      setColorScheme(isDark ? 'dark' : 'light');\n    };\n\n    if (mode === 'class') {\n      if (typeof document === 'undefined') return undefined;\n      const observer = createClassObserver(document.documentElement, handleThemeChange);\n      return () => {\n        observer.disconnect();\n      };\n    }\n\n    const mediaQuery = createMediaQueryListener(handleThemeChange);\n    return () => {\n      mediaQuery?.disconnect();\n    };\n  }, [mode]);\n\n  const toggleTheme: () => void = useCallback(() => {\n    setColorScheme((prev: 'light' | 'dark') => (prev === 'light' ? 'dark' : 'light'));\n  }, []);\n\n  // Build the resolved ThemeConfig: flow meta base → user overrides on top.\n  const finalThemeConfig: RecursivePartial<ThemeConfig> | undefined = useMemo(() => {\n    if (!flowMetaTheme) {\n      return themeOverride;\n    }\n\n    const metaConfig: RecursivePartial<ThemeConfig> = buildThemeConfigFromFlowMeta(flowMetaTheme, colorScheme);\n\n    if (!themeOverride) {\n      return metaConfig;\n    }\n\n    return {\n      ...metaConfig,\n      ...themeOverride,\n      borderRadius: {\n        ...metaConfig.borderRadius,\n        ...themeOverride.borderRadius,\n      },\n      colors: {\n        ...metaConfig.colors,\n        ...themeOverride.colors,\n      },\n      ...(metaConfig.typography || themeOverride.typography\n        ? {\n            typography: {\n              ...(metaConfig as any).typography,\n              ...themeOverride.typography,\n            },\n          }\n        : {}),\n    };\n  }, [flowMetaTheme, colorScheme, themeOverride]);\n\n  const theme: Theme = useMemo(\n    () => createTheme(finalThemeConfig, colorScheme === 'dark'),\n    [finalThemeConfig, colorScheme],\n  );\n\n  const direction: 'ltr' | 'rtl' = flowMetaTheme?.direction ?? 'ltr';\n\n  // The innermost ThemeProvider owns the document root: an outer one stops writing its CSS variables\n  // and text direction while a nested one is mounted, and writes them again once it unmounts.\n  const parentRoot: ThemeRootContextValue | null = useContext(ThemeRootContext);\n  const claims: MutableRefObject<number> = useRef<number>(0);\n  const applied: MutableRefObject<{direction: 'ltr' | 'rtl'; theme: Theme} | null> = useRef(null);\n\n  const applyToRoot: () => void = useCallback(() => {\n    if (!applied.current || typeof document === 'undefined') return;\n    applyThemeToDOM(applied.current.theme);\n    document.documentElement.dir = applied.current.direction;\n  }, []);\n\n  const root: ThemeRootContextValue = useMemo(\n    () => ({\n      claim: (): (() => void) => {\n        claims.current += 1;\n        return (): void => {\n          claims.current -= 1;\n          if (claims.current === 0) applyToRoot();\n        };\n      },\n    }),\n    [applyToRoot],\n  );\n\n  useEffect(() => parentRoot?.claim(), [parentRoot]);\n\n  useEffect(() => {\n    applied.current = {direction, theme};\n    if (claims.current === 0) applyToRoot();\n  }, [applyToRoot, direction, theme]);\n\n  const value: any = {\n    colorScheme,\n    direction,\n    theme,\n    toggleTheme,\n  };\n\n  return (\n    <ThemeContext.Provider value={value}>\n      <ThemeRootContext.Provider value={root}>{children}</ThemeRootContext.Provider>\n    </ThemeContext.Provider>\n  );\n};\n\nexport default ThemeProvider;\n"],"mappings":"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"}

package/dist/contexts/Theme/ThemeRootContext.d.ts

@@ -0,0 +1,11 @@
+import { Context } from 'react';
+export interface ThemeRootContextValue {
+    /**
+     * Hands the document root to a nested `ThemeProvider` until the returned release is called, so the
+     * innermost provider's CSS variables and text direction are the ones on the page.
+     */
+    claim: () => () => void;
+}
+declare const ThemeRootContext: Context<ThemeRootContextValue | null>;
+export default ThemeRootContext;
+//# sourceMappingURL=ThemeRootContext.d.ts.map

package/dist/contexts/Theme/ThemeRootContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeRootContext.d.ts","sourceRoot":"","sources":["../../../src/contexts/Theme/ThemeRootContext.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,OAAO,EAAgB,MAAM,OAAO,CAAC;AAE7C,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,KAAK,EAAE,MAAM,MAAM,IAAI,CAAC;CACzB;AAED,QAAA,MAAM,gBAAgB,EAAE,OAAO,CAAC,qBAAqB,GAAG,IAAI,CAAqD,CAAC;AAIlH,eAAe,gBAAgB,CAAC"}

package/dist/contexts/Theme/ThemeRootContext.js

@@ -0,0 +1,10 @@
+import { createContext } from "react";
+
+//#region src/contexts/Theme/ThemeRootContext.ts
+const ThemeRootContext = createContext(null);
+ThemeRootContext.displayName = "ThemeRootContext";
+var ThemeRootContext_default = ThemeRootContext;
+
+//#endregion
+export { ThemeRootContext_default as default };
+//# sourceMappingURL=ThemeRootContext.js.map

package/dist/contexts/Theme/ThemeRootContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ThemeRootContext.js","names":["ThemeRootContext: Context<ThemeRootContextValue | null>"],"sources":["../../../src/contexts/Theme/ThemeRootContext.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Context, createContext} from 'react';\n\nexport interface ThemeRootContextValue {\n  /**\n   * Hands the document root to a nested `ThemeProvider` until the returned release is called, so the\n   * innermost provider's CSS variables and text direction are the ones on the page.\n   */\n  claim: () => () => void;\n}\n\nconst ThemeRootContext: Context<ThemeRootContextValue | null> = createContext<ThemeRootContextValue | null>(null);\n\nThemeRootContext.displayName = 'ThemeRootContext';\n\nexport default ThemeRootContext;\n"],"mappings":";;;AAaA,MAAMA,mBAA0D,cAA4C,KAAK;AAEjH,iBAAiB,cAAc;AAE/B,+BAAe"}

package/dist/hooks/auth/useConsentDetailField.d.ts

@@ -0,0 +1,130 @@
+import { type ConsentDetailRow } from '@thunderid/browser';
+import { type ConsentDetailListDisplay } from '../../utils/getConsentDetailListDisplay';
+import { UseTranslation } from '../useTranslation';
+/**
+ * How the user may change one field of an authorization detail on the consent screen: type a lower or
+ * higher `number` or `date`, or toggle items of a list whose rule is `removeItems` or `addItems`.
+ *
+ * @experimental This type may change in future versions
+ */
+export type ConsentDetailInputKind = 'number' | 'date' | 'removeItems' | 'addItems';
+/**
+ * Error shown for text a user entered into an authorization detail field, as a translation key and the
+ * values to substitute into its text.
+ *
+ * @experimental This interface may change in future versions
+ */
+export interface ConsentDetailInputError {
+    /** Translation key of the message. */
+    key: string;
+    /** Values to substitute into the message: `value` is the value that was shown. */
+    params: Record<string, string>;
+}
+/**
+ * One item of a list field of an authorization detail, as the consent screen offers it.
+ *
+ * @experimental This interface may change in future versions
+ */
+export interface ConsentDetailListItem {
+    /**
+     * Where the item comes from: `shown` in the requested detail, `added` by the user, or `offered` by the
+     * type for the user to add.
+     */
+    origin: 'shown' | 'added' | 'offered';
+    /** Whether the item is part of the value that would be granted. */
+    selected: boolean;
+    /** Whether the user may toggle the item. */
+    toggleable: boolean;
+    /** The item. */
+    value: string | number | boolean;
+}
+/**
+ * Props for the useConsentDetailField hook.
+ */
+export interface UseConsentDetailFieldProps {
+    /** The identifier of the consent purpose the authorization detail belongs to. */
+    purposeId: string;
+    /** The identifier of the authorization detail the field belongs to, its consent element name. */
+    detailId: string;
+    /** Current consent form values. */
+    formValues: Record<string, string>;
+    /** Callback that writes one consent form value. */
+    onInputChange: (name: string, value: string) => void;
+    /** The field. */
+    row: ConsentDetailRow;
+    /** Translator for the error message; the SDK's default bundle is used without one. */
+    t?: UseTranslation['t'];
+}
+/**
+ * Error of a field, with its message resolved.
+ */
+export interface ConsentDetailFieldError extends ConsentDetailInputError {
+    /** Translated message. */
+    message: string;
+}
+/**
+ * State and handlers of one authorization detail field, for drawing it in any UI.
+ */
+export interface UseConsentDetailFieldResult {
+    /** Why the text shown cannot be submitted, absent when it can. */
+    error?: ConsentDetailFieldError;
+    /** Adds a typed item to an `addItems` list that takes typed values; returns whether it was added. */
+    handleAdd: (text: string) => boolean;
+    /** Call when the field loses focus: an empty field returns to the value that was shown. */
+    handleBlur: () => void;
+    /** Call with the text the user entered into a `number` or `date` field, or the item typed into a list. */
+    handleChange: (text: string) => void;
+    /** Expands or collapses the field's list. */
+    handleListToggle: (expanded: boolean) => void;
+    /** Toggles an item of a list field, within what its rule allows. */
+    handleToggle: (item: string | number | boolean) => void;
+    /** Identifier for the field's input element. */
+    inputId: string;
+    /** Whether the user expanded the field's list past `CONSENT_DETAIL_DISPLAY_LIMITS.listItems`. */
+    isListExpanded: boolean;
+    /** Whether the field's value is a list of plain values, shown as a list rather than as structured JSON. */
+    isPlainList: boolean;
+    /** Whether an item of a list field is part of the value that would be granted. */
+    isSelected: (item: string | number | boolean) => boolean;
+    /** Whether the user may toggle an item of a list field. */
+    isToggleable: (item: string | number | boolean) => boolean;
+    /** Whether the field takes typed items: an `addItems` list whose type offers no fixed values. */
+    isTypedItemAllowed: boolean;
+    /** Whether the field's text may be submitted. Always true for a list or a read-only field. */
+    isValid: boolean;
+    /** Items of a list field, in display order; empty for any other field. */
+    items: ConsentDetailListItem[];
+    /** How the user may change the field, or `undefined` when it is read-only. */
+    kind?: ConsentDetailInputKind;
+    /** Label of the field. */
+    label: string;
+    /**
+     * How many items of the field's list to show and hide: the items of a list the user may change, or the
+     * values of a read-only plain list. Nothing is hidden for any other field.
+     */
+    listDisplay: ConsentDetailListDisplay;
+    /** Upper bound of a `number` or `date` field that may be decreased. */
+    max?: string;
+    /** Lower bound of a `number` or `date` field that may be increased. */
+    min?: string;
+    /** Text to show: the typed text of a `number` or `date` field, or the item being typed into a list. */
+    text: string;
+}
+/**
+ * Headless state of one authorization detail field on the consent screen. A `number` or `date` field keeps
+ * the text the user typed, writes it to the decision only while it stays within the field's bound, and
+ * otherwise clears the field's modification and marks the field invalid, which blocks approval (see
+ * `isConsentApprovalBlocked`). A list field exposes its items and toggles them as its rule allows.
+ *
+ * @param props - The field and the consent form state.
+ * @returns The field's state and handlers.
+ *
+ * @example
+ * ```tsx
+ * const field = useConsentDetailField({purposeId, detailId, row, formValues, onInputChange});
+ * <input value={field.text} onChange={(e) => field.handleChange(e.target.value)} onBlur={field.handleBlur} />
+ * ```
+ */
+declare const useConsentDetailField: ({ detailId, formValues, onInputChange, purposeId, row, t, }: UseConsentDetailFieldProps) => UseConsentDetailFieldResult;
+export default useConsentDetailField;
+//# sourceMappingURL=useConsentDetailField.d.ts.map

package/dist/hooks/auth/useConsentDetailField.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useConsentDetailField.d.ts","sourceRoot":"","sources":["../../../src/hooks/auth/useConsentDetailField.ts"],"names":[],"mappings":"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"}