@thunderid/react 1.5.0 → 1.6.0

package/dist/cjs/components/presentation/ChangeCredential/BaseChangeCredential.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseChangeCredential.cjs","names":["BaseChangeCredential: FC<BaseChangeCredentialProps>","useTheme","styles: Record<string, string>","useStyles","useTranslation","labelParams: Record<string, string>","resolvedTitle: string","interactionDisabled: boolean","canSubmit: boolean","cx","Check","X","Typography","confirmError: string | undefined","newPasswordError: string | undefined","form: ReactElement","AlertPrimitive","PasswordField","Button"],"sources":["../../../../../src/components/presentation/ChangeCredential/BaseChangeCredential.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n  ChangePasswordFormEvaluation,\n  PasswordPolicy,\n  PasswordRuleResult,\n  Preferences,\n  bem,\n  evaluateChangePasswordForm,\n  withVendorCSSClassPrefix,\n} from '@thunderid/browser';\nimport {FC, FormEvent, ReactElement, useMemo, useState} from 'react';\nimport useStyles from './BaseChangeCredential.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport useTranslation from '../../../hooks/useTranslation';\nimport {cx} from '../../../styles/emotion';\nimport AlertPrimitive from '../../primitives/Alert/Alert';\nimport Button from '../../primitives/Button/Button';\nimport Check from '../../primitives/Icons/Check';\nimport X from '../../primitives/Icons/X';\nimport PasswordField from '../../primitives/PasswordField/PasswordField';\nimport Typography from '../../primitives/Typography/Typography';\n\n/**\n * The values collected by the form and handed to `onSubmit`.\n *\n * There is deliberately no current-value field here. The self-service credential write\n * endpoint does not verify the account's existing value today, so a field the server\n * ignores would only teach the user a false sense of security.\n */\nexport interface ChangePasswordValues {\n  /**\n   * The value to set.\n   */\n  newPassword: string;\n}\n\nexport interface BaseChangeCredentialProps {\n  /**\n   * Whether to wrap the form in a bordered card.\n   */\n  cardLayout?: boolean;\n  /**\n   * Additional CSS class names\n   */\n  className?: string;\n  /**\n   * The human-readable name of the credential, substituted into every default label,\n   * placeholder and message (for example \"Change {credential}\", \"New {credential}\").\n   * Defaults to `Password`. {@link ChangeCredential} resolves this from the attribute's own\n   * `displayName` in the user schema; set it directly here when using this presentational\n   * component without that context.\n   */\n  credentialDisplayName?: string;\n  /**\n   * A form-level error, typically a server failure that maps to no single field.\n   */\n  error?: string | null;\n  /**\n   * Server-supplied errors keyed by field name (`newPassword`).\n   */\n  fieldErrors?: Record<string, string>;\n  /**\n   * Whether a submission is in flight.\n   */\n  loading?: boolean;\n  /**\n   * Called with the collected values once client-side validation passes.\n   */\n  onSubmit?: (values: ChangePasswordValues) => void;\n  /**\n   * The rules the new value must satisfy. Defaults to no rules, in which case the checklist\n   * is empty and the only submit gate is a non-empty value; the caller is expected to source\n   * this from the user type schema (see {@link ChangeCredential}) or supply its own.\n   */\n  policy?: PasswordPolicy;\n  /**\n   * Component-level preference overrides, including i18n.\n   */\n  preferences?: Preferences;\n  /**\n   * Whether to render the live requirement checklist. Defaults to `true`.\n   */\n  showRequirements?: boolean;\n  /**\n   * Whether the last submission succeeded.\n   */\n  success?: boolean;\n  /**\n   * Overrides the default \"Change {credential}\" heading. Pass an empty string to omit the\n   * heading entirely, for example when an app's own surrounding layout (a card header, a\n   * dialog title) already names the credential and a second heading would be redundant.\n   * Defaults to the translated `user.change_password.heading` string.\n   */\n  title?: string;\n  /**\n   * Whether the account cannot have this credential changed at all, because the user type's\n   * schema defines no attribute of this name. The form is rendered inert behind an\n   * explanatory message rather than hidden, so an integrator who placed the component can see\n   * why it is not usable instead of finding an empty space.\n   */\n  unavailable?: boolean;\n}\n\n/**\n * Presentational change-credential form with just the two fields a first-time or\n * unverified credential change needs: new value and confirmation.\n *\n * Holds no context and performs no network calls: it renders the fields, evaluates the\n * policy for the checklist and the submit gate, and hands validated values to `onSubmit`.\n * Use {@link ChangeCredential} for the context-wired variant.\n *\n * @example\n * ```tsx\n * <BaseChangeCredential\n *   policy={{regex: '^.{12,}$'}}\n *   onSubmit={({newPassword}) => save(newPassword)}\n * />\n * ```\n */\nconst BaseChangeCredential: FC<BaseChangeCredentialProps> = ({\n  cardLayout = false,\n  className = '',\n  credentialDisplayName = 'Password',\n  error = null,\n  fieldErrors = {},\n  loading = false,\n  onSubmit = undefined,\n  policy = {},\n  preferences = undefined,\n  showRequirements = true,\n  success = false,\n  title = undefined,\n  unavailable = false,\n}: BaseChangeCredentialProps) => {\n  const {theme, colorScheme}: ReturnType<typeof useTheme> = useTheme();\n  const styles: Record<string, string> = useStyles(theme, colorScheme);\n  const {t} = useTranslation(preferences?.i18n);\n\n  // Substituted into every default label, placeholder and message. A caller-supplied\n  // translation that carries no `{credential}`/`{credentialLower}` placeholder is unaffected.\n  const labelParams: Record<string, string> = {\n    credential: credentialDisplayName,\n    credentialLower: credentialDisplayName.toLowerCase(),\n  };\n\n  // `title` overrides the default heading; an explicit empty string omits it entirely.\n  const resolvedTitle: string = title ?? t('user.change_password.heading', labelParams);\n\n  const [newPassword, setNewPassword] = useState<string>('');\n  const [confirmPassword, setConfirmPassword] = useState<string>('');\n  const [submitted, setSubmitted] = useState<boolean>(false);\n\n  // Clear the entered values once the container reports the write succeeded, so a shared\n  // machine is not left with the new credential sitting in the form. Adjusting state during\n  // render (rather than in an effect) is React's documented way to reset on a prop change and\n  // avoids the extra commit an effect would cause.\n  const [prevSuccess, setPrevSuccess] = useState<boolean>(success);\n\n  if (success !== prevSuccess) {\n    setPrevSuccess(success);\n\n    if (success) {\n      setNewPassword('');\n      setConfirmPassword('');\n      setSubmitted(false);\n    }\n  }\n\n  const {confirmMatches, isValid, ruleResults}: ChangePasswordFormEvaluation = useMemo(\n    () => evaluateChangePasswordForm({confirmPassword, newPassword}, policy),\n    [confirmPassword, newPassword, policy],\n  );\n\n  // A schema with no attribute of this name makes every control pointless, so they are\n  // disabled outright rather than left focusable behind the overlay.\n  const interactionDisabled: boolean = loading || unavailable;\n  const canSubmit: boolean = !interactionDisabled && isValid;\n\n  const handleSubmit = (event: FormEvent<HTMLFormElement>): void => {\n    event.preventDefault();\n    setSubmitted(true);\n\n    if (!canSubmit) {\n      return;\n    }\n\n    onSubmit?.({newPassword});\n  };\n\n  const renderRequirement = (rule: PasswordRuleResult): ReactElement => (\n    <li\n      key={rule.key}\n      data-passed={rule.passed}\n      className={cx(\n        withVendorCSSClassPrefix(bem('change-credential', 'requirement')),\n        styles['requirement'],\n        rule.passed ? styles['requirementPassed'] : styles['requirementPending'],\n      )}\n    >\n      <span\n        className={cx(\n          withVendorCSSClassPrefix(bem('change-credential', 'requirement-icon')),\n          styles['requirementIcon'],\n        )}\n      >\n        {rule.passed ? <Check width={14} height={14} /> : <X width={14} height={14} />}\n      </span>\n      <Typography variant=\"body2\" component=\"span\">\n        {t(rule.messageKey, rule.params)}\n      </Typography>\n    </li>\n  );\n\n  // Only surface the local error once the user has attempted a submit, so the form does\n  // not flag fields the user has not finished filling in.\n  const confirmError: string | undefined =\n    submitted && !confirmMatches ? t('user.change_password.mismatch.error', labelParams) : undefined;\n  const newPasswordError: string | undefined = fieldErrors['newPassword'];\n\n  const form: ReactElement = (\n    <form\n      noValidate\n      onSubmit={handleSubmit}\n      className={cx(\n        withVendorCSSClassPrefix('change-credential'),\n        styles['root'],\n        cardLayout ? styles['card'] : '',\n        className,\n      )}\n    >\n      {resolvedTitle && (\n        <Typography\n          variant=\"h5\"\n          className={cx(withVendorCSSClassPrefix(bem('change-credential', 'heading')), styles['heading'])}\n        >\n          {resolvedTitle}\n        </Typography>\n      )}\n\n      {error && (\n        <AlertPrimitive\n          variant=\"error\"\n          className={cx(withVendorCSSClassPrefix(bem('change-credential', 'alert')), styles['alert'])}\n        >\n          <AlertPrimitive.Title>{t('errors.heading') || 'Error'}</AlertPrimitive.Title>\n          <AlertPrimitive.Description>{error}</AlertPrimitive.Description>\n        </AlertPrimitive>\n      )}\n\n      {success && (\n        <AlertPrimitive\n          variant=\"success\"\n          className={cx(withVendorCSSClassPrefix(bem('change-credential', 'alert')), styles['alert'])}\n        >\n          <AlertPrimitive.Description>{t('user.change_password.success', labelParams)}</AlertPrimitive.Description>\n        </AlertPrimitive>\n      )}\n\n      <div className={cx(withVendorCSSClassPrefix(bem('change-credential', 'fields')), styles['fields'])}>\n        <PasswordField\n          name=\"newPassword\"\n          autoComplete=\"new-password\"\n          label={t('user.change_password.new.label', labelParams)}\n          placeholder={t('user.change_password.new.placeholder', labelParams)}\n          value={newPassword}\n          onChange={setNewPassword}\n          disabled={interactionDisabled}\n          error={newPasswordError}\n          required\n        />\n\n        {showRequirements && ruleResults.length > 0 && (\n          <div className={cx(withVendorCSSClassPrefix(bem('change-credential', 'requirements')))}>\n            <Typography\n              variant=\"body2\"\n              component=\"p\"\n              className={cx(\n                withVendorCSSClassPrefix(bem('change-credential', 'requirements-heading')),\n                styles['requirementsHeading'],\n              )}\n            >\n              {t('user.change_password.requirements.heading', labelParams)}\n            </Typography>\n            <ul className={styles['requirements']}>{ruleResults.map(renderRequirement)}</ul>\n          </div>\n        )}\n\n        <PasswordField\n          name=\"confirmPassword\"\n          autoComplete=\"new-password\"\n          label={t('user.change_password.confirm.label', labelParams)}\n          placeholder={t('user.change_password.confirm.placeholder', labelParams)}\n          value={confirmPassword}\n          onChange={setConfirmPassword}\n          disabled={interactionDisabled}\n          error={confirmError}\n          required\n        />\n      </div>\n\n      <div className={cx(withVendorCSSClassPrefix(bem('change-credential', 'actions')), styles['actions'])}>\n        <Button type=\"submit\" color=\"primary\" variant=\"solid\" loading={loading} disabled={!canSubmit}>\n          {t('user.change_password.submit', labelParams)}\n        </Button>\n      </div>\n    </form>\n  );\n\n  if (!unavailable) {\n    return form;\n  }\n\n  return (\n    <div\n      className={cx(\n        withVendorCSSClassPrefix(bem('change-credential', 'unavailable')),\n        styles['unavailableRoot'],\n        className,\n      )}\n    >\n      <div\n        aria-hidden=\"true\"\n        className={cx(\n          withVendorCSSClassPrefix(bem('change-credential', 'unavailable-content')),\n          styles['unavailableContent'],\n        )}\n      >\n        {form}\n      </div>\n\n      <div\n        role=\"status\"\n        className={cx(\n          withVendorCSSClassPrefix(bem('change-credential', 'unavailable-overlay')),\n          styles['unavailableOverlay'],\n        )}\n      >\n        <AlertPrimitive\n          variant=\"warning\"\n          className={cx(withVendorCSSClassPrefix(bem('change-credential', 'alert')), styles['alert'])}\n        >\n          <AlertPrimitive.Title>{t('user.change_password.unavailable.heading', labelParams)}</AlertPrimitive.Title>\n          <AlertPrimitive.Description>\n            {t('user.change_password.unavailable.description', labelParams)}\n          </AlertPrimitive.Description>\n        </AlertPrimitive>\n      </div>\n    </div>\n  );\n};\n\nexport default BaseChangeCredential;\n"],"mappings":"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"}

package/dist/cjs/components/presentation/ChangeCredential/BaseChangeCredential.styles.cjs

@@ -1,108 +0,0 @@
-const require_emotion = require('../../../styles/emotion.cjs');
-
-//#region src/components/presentation/ChangeCredential/BaseChangeCredential.styles.ts
-/**
-* Creates styles for the BaseChangeCredential 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 useStyles = (theme, colorScheme) => {
-	const root = require_emotion.css`
-    display: flex;
-    flex-direction: column;
-    gap: calc(${theme.vars.spacing.unit} * 2);
-    width: 100%;
-  `;
-	const card = require_emotion.css`
-    padding: calc(${theme.vars.spacing.unit} * 3);
-    border: 1px solid ${theme.vars.colors.border};
-    border-radius: ${theme.vars.borderRadius.large};
-  `;
-	const heading = require_emotion.css`
-    margin: 0;
-  `;
-	const fields = require_emotion.css`
-    display: flex;
-    flex-direction: column;
-    gap: calc(${theme.vars.spacing.unit} * 2);
-  `;
-	const requirements = require_emotion.css`
-    display: flex;
-    flex-direction: column;
-    gap: calc(${theme.vars.spacing.unit} / 2);
-    margin: 0;
-    padding: 0;
-    list-style: none;
-  `;
-	const requirementsHeading = require_emotion.css`
-    margin: 0 0 calc(${theme.vars.spacing.unit} / 2) 0;
-    opacity: 0.8;
-  `;
-	const requirement = require_emotion.css`
-    display: flex;
-    align-items: center;
-    gap: ${theme.vars.spacing.unit};
-  `;
-	const requirementPassed = require_emotion.css`
-    color: ${theme.vars.colors.success.main};
-  `;
-	const requirementPending = require_emotion.css`
-    opacity: 0.7;
-  `;
-	const requirementIcon = require_emotion.css`
-    flex-shrink: 0;
-    width: 14px;
-    height: 14px;
-  `;
-	const alert = require_emotion.css`
-    width: 100%;
-  `;
-	const actions = require_emotion.css`
-    display: flex;
-    gap: ${theme.vars.spacing.unit};
-    align-items: center;
-    justify-content: flex-end;
-  `;
-	const unavailableRoot = require_emotion.css`
-    position: relative;
-    display: flex;
-    width: 100%;
-  `;
-	return {
-		actions,
-		alert,
-		card,
-		colorScheme,
-		fields,
-		heading,
-		requirement,
-		requirementIcon,
-		requirementPassed,
-		requirementPending,
-		requirements,
-		requirementsHeading,
-		root,
-		unavailableContent: require_emotion.css`
-    width: 100%;
-    filter: blur(3px);
-    opacity: 0.55;
-    pointer-events: none;
-    user-select: none;
-  `,
-		unavailableOverlay: require_emotion.css`
-    position: absolute;
-    inset: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    padding: calc(${theme.vars.spacing.unit} * 2);
-  `,
-		unavailableRoot
-	};
-};
-var BaseChangeCredential_styles_default = useStyles;
-
-//#endregion
-exports.default = BaseChangeCredential_styles_default;
-//# sourceMappingURL=BaseChangeCredential.styles.cjs.map

package/dist/cjs/components/presentation/ChangeCredential/BaseChangeCredential.styles.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseChangeCredential.styles.cjs","names":["root: string","card: string","heading: string","fields: string","requirements: string","requirementsHeading: string","requirement: string","requirementPassed: string","requirementPending: string","requirementIcon: string","alert: string","actions: string","unavailableRoot: string"],"sources":["../../../../../src/components/presentation/ChangeCredential/BaseChangeCredential.styles.ts"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {Theme} from '@thunderid/browser';\nimport {css} from '../../../styles/emotion';\n\n/**\n * Creates styles for the BaseChangeCredential 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 */\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> => {\n  const root: string = css`\n    display: flex;\n    flex-direction: column;\n    gap: calc(${theme.vars.spacing.unit} * 2);\n    width: 100%;\n  `;\n\n  const card: string = css`\n    padding: calc(${theme.vars.spacing.unit} * 3);\n    border: 1px solid ${theme.vars.colors.border};\n    border-radius: ${theme.vars.borderRadius.large};\n  `;\n\n  const heading: string = css`\n    margin: 0;\n  `;\n\n  const fields: string = css`\n    display: flex;\n    flex-direction: column;\n    gap: calc(${theme.vars.spacing.unit} * 2);\n  `;\n\n  const requirements: string = css`\n    display: flex;\n    flex-direction: column;\n    gap: calc(${theme.vars.spacing.unit} / 2);\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  `;\n\n  const requirementsHeading: string = css`\n    margin: 0 0 calc(${theme.vars.spacing.unit} / 2) 0;\n    opacity: 0.8;\n  `;\n\n  const requirement: string = css`\n    display: flex;\n    align-items: center;\n    gap: ${theme.vars.spacing.unit};\n  `;\n\n  const requirementPassed: string = css`\n    color: ${theme.vars.colors.success.main};\n  `;\n\n  const requirementPending: string = css`\n    opacity: 0.7;\n  `;\n\n  const requirementIcon: string = css`\n    flex-shrink: 0;\n    width: 14px;\n    height: 14px;\n  `;\n\n  const alert: string = css`\n    width: 100%;\n  `;\n\n  const actions: string = css`\n    display: flex;\n    gap: ${theme.vars.spacing.unit};\n    align-items: center;\n    justify-content: flex-end;\n  `;\n\n  const unavailableRoot: string = css`\n    position: relative;\n    display: flex;\n    width: 100%;\n  `;\n\n  const unavailableContent: string = css`\n    width: 100%;\n    filter: blur(3px);\n    opacity: 0.55;\n    pointer-events: none;\n    user-select: none;\n  `;\n\n  const unavailableOverlay: string = css`\n    position: absolute;\n    inset: 0;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: calc(${theme.vars.spacing.unit} * 2);\n  `;\n\n  return {\n    actions,\n    alert,\n    card,\n    colorScheme,\n    fields,\n    heading,\n    requirement,\n    requirementIcon,\n    requirementPassed,\n    requirementPending,\n    requirements,\n    requirementsHeading,\n    root,\n    unavailableContent,\n    unavailableOverlay,\n    unavailableRoot,\n  };\n};\n\nexport default useStyles;\n"],"mappings":";;;;;;;;;AAYA,MAAM,aAAa,OAAc,gBAAgD;CAC/E,MAAMA,OAAe,mBAAG;;;gBAGV,MAAM,KAAK,QAAQ,KAAK;;;CAItC,MAAMC,OAAe,mBAAG;oBACN,MAAM,KAAK,QAAQ,KAAK;wBACpB,MAAM,KAAK,OAAO,OAAO;qBAC5B,MAAM,KAAK,aAAa,MAAM;;CAGjD,MAAMC,UAAkB,mBAAG;;;CAI3B,MAAMC,SAAiB,mBAAG;;;gBAGZ,MAAM,KAAK,QAAQ,KAAK;;CAGtC,MAAMC,eAAuB,mBAAG;;;gBAGlB,MAAM,KAAK,QAAQ,KAAK;;;;;CAMtC,MAAMC,sBAA8B,mBAAG;uBAClB,MAAM,KAAK,QAAQ,KAAK;;;CAI7C,MAAMC,cAAsB,mBAAG;;;WAGtB,MAAM,KAAK,QAAQ,KAAK;;CAGjC,MAAMC,oBAA4B,mBAAG;aAC1B,MAAM,KAAK,OAAO,QAAQ,KAAK;;CAG1C,MAAMC,qBAA6B,mBAAG;;;CAItC,MAAMC,kBAA0B,mBAAG;;;;;CAMnC,MAAMC,QAAgB,mBAAG;;;CAIzB,MAAMC,UAAkB,mBAAG;;WAElB,MAAM,KAAK,QAAQ,KAAK;;;;CAKjC,MAAMC,kBAA0B,mBAAG;;;;;AAuBnC,QAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA,oBA/BiC,mBAAG;;;;;;;EAgCpC,oBAxBiC,mBAAG;;;;;;oBAMpB,MAAM,KAAK,QAAQ,KAAK;;EAmBxC;EACD;;AAGH,0CAAe"}

package/dist/cjs/components/presentation/ChangeCredential/ChangeCredential.cjs

@@ -1,123 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_useThunderID = require('../../../contexts/ThunderID/useThunderID.cjs');
-const require_useUser = require('../../../contexts/User/useUser.cjs');
-const require_useTranslation = require('../../../hooks/useTranslation.cjs');
-const require_BaseChangeCredential = require('./BaseChangeCredential.cjs');
-const require_updateMeCredentials = require('../../../api/updateMeCredentials.cjs');
-let __thunderid_browser = require("@thunderid/browser");
-__thunderid_browser = require_rolldown_runtime.__toESM(__thunderid_browser);
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
-
-//#region src/components/presentation/ChangeCredential/ChangeCredential.tsx
-/**
-* Title-cases a credential attribute name for use as a display-name fallback when the schema
-* declares no `displayName` for it, e.g. `pin` -> `Pin`.
-*/
-const defaultDisplayName = (attribute) => attribute.charAt(0).toUpperCase() + attribute.slice(1);
-/**
-* ChangeCredential lets the signed-in user set a new value for one of their own credentials.
-*
-* It collects only a new value and its confirmation. The self-service credential write path
-* does not verify the account's existing value today, so this component does not ask for one;
-* once server-side current-value verification ships, that field returns without a breaking
-* change to this component's public props.
-*
-* It reads the applicable rules from the user schema already resolved by the ThunderID
-* provider, so it adds no network request beyond the write itself, and posts to
-* `/users/me/update-credentials` with the access token attached by the SDK's HTTP client.
-*
-* Defaults to managing the `password` credential. To manage a different one (for example a
-* PIN declared on the user type schema), set `attribute`; render the component once per
-* credential to let a user manage several. Every default label, placeholder and message is
-* built from the attribute's own `displayName` in the schema (`GET /users/me/meta`), so it
-* always matches whatever an admin named the attribute there; when the schema carries no
-* `displayName` for it, it falls back to the attribute name title-cased (`pin` -> `Pin`).
-* Override individual strings via `preferences.i18n` for full control (including other
-* languages) if the schema-derived name isn't the right fit.
-*
-* @example
-* ```tsx
-* // Basic usage, manages the password
-* <ChangeCredential onSuccess={() => toast('Password updated')} />
-*
-* // With an explicit rule instead of the schema-derived policy
-* <ChangeCredential
-*   policy={{regex: '^.{12,}$'}}
-* />
-*
-* // Managing a different credential declared on the schema; labels use the schema's own
-* // displayName for it automatically
-* <ChangeCredential attribute="pin" />
-* ```
-*/
-const ChangeCredential = ({ attribute = __thunderid_browser.CredentialConstants.PASSWORD, onSuccess = void 0, policy = void 0, preferences = void 0,...rest }) => {
-	const { baseUrl, endpoints, instanceId, preferences: contextPreferences } = require_useThunderID.default();
-	const { userSchema } = require_useUser.default();
-	const resolvedDisplayName = userSchema?.[attribute]?.displayName ?? defaultDisplayName(attribute);
-	const resolvedPreferences = (0, react.useMemo)(() => ({
-		...contextPreferences,
-		...preferences,
-		user: {
-			...contextPreferences?.user,
-			...preferences?.user
-		}
-	}), [contextPreferences, preferences]);
-	const { t } = require_useTranslation.default(resolvedPreferences?.i18n);
-	const [error, setError] = (0, react.useState)(null);
-	const [fieldErrors, setFieldErrors] = (0, react.useState)({});
-	const [loading, setLoading] = (0, react.useState)(false);
-	const [success, setSuccess] = (0, react.useState)(false);
-	const resolvedPolicy = (0, react.useMemo)(() => (0, __thunderid_browser.resolveChangeCredentialPolicy)(userSchema, attribute, policy), [
-		userSchema,
-		attribute,
-		policy
-	]);
-	const handleSubmit = async ({ newPassword }) => {
-		setError(null);
-		setFieldErrors({});
-		setSuccess(false);
-		setLoading(true);
-		try {
-			await require_updateMeCredentials.default({
-				baseUrl,
-				instanceId,
-				payload: { [attribute]: newPassword },
-				url: (0, __thunderid_browser.resolveResourceEndpoint)("usersMeCredentials", { endpoints })
-			});
-			setSuccess(true);
-			onSuccess?.();
-		} catch (caughtError) {
-			const { field, message, messageKey } = (0, __thunderid_browser.mapCredentialUpdateError)(caughtError);
-			const text = message ?? t(messageKey, {
-				credential: resolvedDisplayName,
-				credentialLower: resolvedDisplayName.toLowerCase()
-			});
-			if (field) setFieldErrors({ [field]: text });
-			else setError(text);
-		} finally {
-			setLoading(false);
-		}
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_BaseChangeCredential.default, {
-		...rest,
-		credentialDisplayName: resolvedDisplayName,
-		error,
-		fieldErrors,
-		loading,
-		policy: resolvedPolicy,
-		preferences: resolvedPreferences,
-		success,
-		unavailable: !(0, __thunderid_browser.supportsCredential)(userSchema, attribute),
-		onSubmit: (values) => {
-			handleSubmit(values);
-		}
-	});
-};
-var ChangeCredential_default = ChangeCredential;
-
-//#endregion
-exports.default = ChangeCredential_default;
-//# sourceMappingURL=ChangeCredential.cjs.map

package/dist/cjs/components/presentation/ChangeCredential/ChangeCredential.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"ChangeCredential.cjs","names":["ChangeCredential: FC<ChangeCredentialProps>","CredentialConstants","useThunderID","useUser","resolvedDisplayName: string","useTranslation","resolvedPolicy: PasswordPolicy","updateMeCredentials","caughtError: unknown","text: string","BaseChangeCredential"],"sources":["../../../../../src/components/presentation/ChangeCredential/ChangeCredential.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n  CredentialConstants,\n  CredentialUpdateErrorResult,\n  PasswordPolicy,\n  mapCredentialUpdateError,\n  resolveChangeCredentialPolicy,\n  resolveResourceEndpoint,\n  supportsCredential,\n} from '@thunderid/browser';\nimport {FC, useMemo, useState} from 'react';\nimport BaseChangeCredential, {BaseChangeCredentialProps, ChangePasswordValues} from './BaseChangeCredential';\nimport updateMeCredentials from '../../../api/updateMeCredentials';\nimport useThunderID from '../../../contexts/ThunderID/useThunderID';\nimport useUser from '../../../contexts/User/useUser';\nimport useTranslation from '../../../hooks/useTranslation';\n\n/**\n * Title-cases a credential attribute name for use as a display-name fallback when the schema\n * declares no `displayName` for it, e.g. `pin` -> `Pin`.\n */\nconst defaultDisplayName = (attribute: string): string => attribute.charAt(0).toUpperCase() + attribute.slice(1);\n\nexport interface ChangeCredentialProps\n  extends Omit<\n    BaseChangeCredentialProps,\n    'credentialDisplayName' | 'error' | 'fieldErrors' | 'loading' | 'onSubmit' | 'success'\n  > {\n  /**\n   * The credential attribute this instance manages, any attribute the user's entity type\n   * schema declares `credential: true` (for example `password` or `pin`). Defaults to\n   * `password`. Render the component once per credential to let a user manage more than one,\n   * for example `<ChangeCredential />` for the password and\n   * `<ChangeCredential attribute=\"pin\" />` for a PIN.\n   */\n  attribute?: string;\n  /**\n   * Called after the credential has been changed successfully.\n   */\n  onSuccess?: () => void;\n}\n\n/**\n * ChangeCredential lets the signed-in user set a new value for one of their own credentials.\n *\n * It collects only a new value and its confirmation. The self-service credential write path\n * does not verify the account's existing value today, so this component does not ask for one;\n * once server-side current-value verification ships, that field returns without a breaking\n * change to this component's public props.\n *\n * It reads the applicable rules from the user schema already resolved by the ThunderID\n * provider, so it adds no network request beyond the write itself, and posts to\n * `/users/me/update-credentials` with the access token attached by the SDK's HTTP client.\n *\n * Defaults to managing the `password` credential. To manage a different one (for example a\n * PIN declared on the user type schema), set `attribute`; render the component once per\n * credential to let a user manage several. Every default label, placeholder and message is\n * built from the attribute's own `displayName` in the schema (`GET /users/me/meta`), so it\n * always matches whatever an admin named the attribute there; when the schema carries no\n * `displayName` for it, it falls back to the attribute name title-cased (`pin` -> `Pin`).\n * Override individual strings via `preferences.i18n` for full control (including other\n * languages) if the schema-derived name isn't the right fit.\n *\n * @example\n * ```tsx\n * // Basic usage, manages the password\n * <ChangeCredential onSuccess={() => toast('Password updated')} />\n *\n * // With an explicit rule instead of the schema-derived policy\n * <ChangeCredential\n *   policy={{regex: '^.{12,}$'}}\n * />\n *\n * // Managing a different credential declared on the schema; labels use the schema's own\n * // displayName for it automatically\n * <ChangeCredential attribute=\"pin\" />\n * ```\n */\nconst ChangeCredential: FC<ChangeCredentialProps> = ({\n  attribute = CredentialConstants.PASSWORD,\n  onSuccess = undefined,\n  policy = undefined,\n  preferences = undefined,\n  ...rest\n}: ChangeCredentialProps) => {\n  const {baseUrl, endpoints, instanceId, preferences: contextPreferences} = useThunderID();\n  const {userSchema} = useUser();\n  const resolvedDisplayName: string = userSchema?.[attribute]?.displayName ?? defaultDisplayName(attribute);\n\n  const resolvedPreferences = useMemo(\n    () => ({\n      ...contextPreferences,\n      ...preferences,\n      user: {...contextPreferences?.user, ...preferences?.user},\n    }),\n    [contextPreferences, preferences],\n  );\n  const {t} = useTranslation(resolvedPreferences?.i18n);\n\n  const [error, setError] = useState<string | null>(null);\n  const [fieldErrors, setFieldErrors] = useState<Record<string, string>>({});\n  const [loading, setLoading] = useState<boolean>(false);\n  const [success, setSuccess] = useState<boolean>(false);\n\n  const resolvedPolicy: PasswordPolicy = useMemo(\n    () => resolveChangeCredentialPolicy(userSchema, attribute, policy),\n    [userSchema, attribute, policy],\n  );\n\n  const handleSubmit = async ({newPassword}: ChangePasswordValues): Promise<void> => {\n    setError(null);\n    setFieldErrors({});\n    setSuccess(false);\n    setLoading(true);\n\n    try {\n      await updateMeCredentials({\n        baseUrl,\n        instanceId,\n        payload: {[attribute]: newPassword},\n        url: resolveResourceEndpoint('usersMeCredentials', {endpoints}),\n      });\n\n      setSuccess(true);\n      onSuccess?.();\n    } catch (caughtError: unknown) {\n      const {field, message, messageKey}: CredentialUpdateErrorResult = mapCredentialUpdateError(caughtError);\n      const text: string =\n        message ?? t(messageKey, {credential: resolvedDisplayName, credentialLower: resolvedDisplayName.toLowerCase()});\n\n      if (field) {\n        setFieldErrors({[field]: text});\n      } else {\n        setError(text);\n      }\n    } finally {\n      setLoading(false);\n    }\n  };\n\n  return (\n    <BaseChangeCredential\n      {...rest}\n      credentialDisplayName={resolvedDisplayName}\n      error={error}\n      fieldErrors={fieldErrors}\n      loading={loading}\n      policy={resolvedPolicy}\n      preferences={resolvedPreferences}\n      success={success}\n      unavailable={!supportsCredential(userSchema, attribute)}\n      onSubmit={(values: ChangePasswordValues): void => {\n        void handleSubmit(values);\n      }}\n    />\n  );\n};\n\nexport default ChangeCredential;\n"],"mappings":";;;;;;;;;;;;;;;;;;AAuBA,MAAM,sBAAsB,cAA8B,UAAU,OAAO,EAAE,CAAC,aAAa,GAAG,UAAU,MAAM,EAAE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyDhH,MAAMA,oBAA+C,EACnD,YAAYC,wCAAoB,UAChC,YAAY,QACZ,SAAS,QACT,cAAc,OACd,GAAG,WACwB;CAC3B,MAAM,EAAC,SAAS,WAAW,YAAY,aAAa,uBAAsBC,8BAAc;CACxF,MAAM,EAAC,eAAcC,yBAAS;CAC9B,MAAMC,sBAA8B,aAAa,YAAY,eAAe,mBAAmB,UAAU;CAEzG,MAAM,gDACG;EACL,GAAG;EACH,GAAG;EACH,MAAM;GAAC,GAAG,oBAAoB;GAAM,GAAG,aAAa;GAAK;EAC1D,GACD,CAAC,oBAAoB,YAAY,CAClC;CACD,MAAM,EAAC,MAAKC,+BAAe,qBAAqB,KAAK;CAErD,MAAM,CAAC,OAAO,gCAAoC,KAAK;CACvD,MAAM,CAAC,aAAa,sCAAmD,EAAE,CAAC;CAC1E,MAAM,CAAC,SAAS,kCAAgC,MAAM;CACtD,MAAM,CAAC,SAAS,kCAAgC,MAAM;CAEtD,MAAMC,iGACgC,YAAY,WAAW,OAAO,EAClE;EAAC;EAAY;EAAW;EAAO,CAChC;CAED,MAAM,eAAe,OAAO,EAAC,kBAAsD;AACjF,WAAS,KAAK;AACd,iBAAe,EAAE,CAAC;AAClB,aAAW,MAAM;AACjB,aAAW,KAAK;AAEhB,MAAI;AACF,SAAMC,oCAAoB;IACxB;IACA;IACA,SAAS,GAAE,YAAY,aAAY;IACnC,sDAA6B,sBAAsB,EAAC,WAAU,CAAC;IAChE,CAAC;AAEF,cAAW,KAAK;AAChB,gBAAa;WACNC,aAAsB;GAC7B,MAAM,EAAC,OAAO,SAAS,iEAAoE,YAAY;GACvG,MAAMC,OACJ,WAAW,EAAE,YAAY;IAAC,YAAY;IAAqB,iBAAiB,oBAAoB,aAAa;IAAC,CAAC;AAEjH,OAAI,MACF,gBAAe,GAAE,QAAQ,MAAK,CAAC;OAE/B,UAAS,KAAK;YAER;AACR,cAAW,MAAM;;;AAIrB,QACE,2CAACC;EACC,GAAI;EACJ,uBAAuB;EAChB;EACM;EACJ;EACT,QAAQ;EACR,aAAa;EACJ;EACT,aAAa,6CAAoB,YAAY,UAAU;EACvD,WAAW,WAAuC;AAChD,GAAK,aAAa,OAAO;;GAE3B;;AAIN,+BAAe"}

package/dist/cjs/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.cjs

@@ -1,117 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_emotion = require('../../../styles/emotion.cjs');
-const require_useTheme = require('../../../contexts/Theme/useTheme.cjs');
-const require_Check = require('../../primitives/Icons/Check.cjs');
-const require_BaseLanguageSwitcher_styles = require('./BaseLanguageSwitcher.styles.cjs');
-const require_ChevronDown = require('../../primitives/Icons/ChevronDown.cjs');
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-let react_jsx_runtime = require("react/jsx-runtime");
-react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
-let __floating_ui_react = require("@floating-ui/react");
-__floating_ui_react = require_rolldown_runtime.__toESM(__floating_ui_react);
-
-//#region src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.tsx
-/**
-* Pure-UI language switcher dropdown.
-* Accepts resolved `LanguageOption[]` (code + displayName + emoji) and delegates
-* language switching to the `onLanguageChange` callback.
-*
-* Supports render props for full UI customisation.
-*/
-const BaseLanguageSwitcher = ({ children, className, currentLanguage, isLoading = false, languages, onLanguageChange }) => {
-	const { theme, colorScheme } = require_useTheme.default();
-	const styles = require_BaseLanguageSwitcher_styles.default(theme, colorScheme);
-	const [isOpen, setIsOpen] = (0, react.useState)(false);
-	const hasMultipleLanguages = languages.length > 1;
-	(0, react.useEffect)(() => {
-		if (!hasMultipleLanguages && isOpen) setIsOpen(false);
-	}, [hasMultipleLanguages, isOpen]);
-	const { refs, floatingStyles, context } = (0, __floating_ui_react.useFloating)({
-		middleware: [
-			(0, __floating_ui_react.offset)(4),
-			(0, __floating_ui_react.flip)(),
-			(0, __floating_ui_react.shift)()
-		],
-		onOpenChange: setIsOpen,
-		open: isOpen,
-		whileElementsMounted: __floating_ui_react.autoUpdate
-	});
-	const { getReferenceProps, getFloatingProps } = (0, __floating_ui_react.useInteractions)([
-		(0, __floating_ui_react.useClick)(context, { enabled: hasMultipleLanguages }),
-		(0, __floating_ui_react.useDismiss)(context, { enabled: hasMultipleLanguages }),
-		(0, __floating_ui_react.useRole)(context, {
-			enabled: hasMultipleLanguages,
-			role: "listbox"
-		})
-	]);
-	const currentOption = languages.find((l) => l.code === currentLanguage);
-	if (children) return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(react_jsx_runtime.Fragment, { children: children({
-		currentLanguage,
-		isLoading,
-		languages,
-		onLanguageChange
-	}) });
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: require_emotion.cx(styles["root"], className),
-		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-			ref: refs.setReference,
-			type: "button",
-			disabled: isLoading,
-			"aria-label": "Switch language",
-			...getReferenceProps(),
-			className: styles["trigger"],
-			children: [
-				currentOption && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: styles["triggerEmoji"],
-					children: currentOption.emoji
-				}),
-				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-					className: styles["triggerLabel"],
-					children: currentOption?.displayName ?? currentLanguage
-				}),
-				hasMultipleLanguages && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_ChevronDown.default, {})
-			]
-		}), isOpen && hasMultipleLanguages && /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__floating_ui_react.FloatingPortal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__floating_ui_react.FloatingFocusManager, {
-			context,
-			modal: false,
-			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				ref: refs.setFloating,
-				style: floatingStyles,
-				...getFloatingProps(),
-				className: styles["content"],
-				role: "listbox",
-				"aria-label": "Select language",
-				children: languages.map((lang) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-					type: "button",
-					role: "option",
-					"aria-selected": lang.code === currentLanguage,
-					className: require_emotion.cx(styles["option"], lang.code === currentLanguage && styles["optionActive"]),
-					onClick: () => {
-						onLanguageChange(lang.code);
-						setIsOpen(false);
-					},
-					children: [
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: styles["optionEmoji"],
-							children: lang.emoji
-						}),
-						/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: styles["optionLabel"],
-							children: lang.displayName
-						}),
-						lang.code === currentLanguage && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: styles["checkIcon"],
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Check.default, {})
-						})
-					]
-				}, lang.code))
-			})
-		}) })]
-	});
-};
-var BaseLanguageSwitcher_default = BaseLanguageSwitcher;
-
-//#endregion
-exports.default = BaseLanguageSwitcher_default;
-//# sourceMappingURL=BaseLanguageSwitcher.cjs.map

package/dist/cjs/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseLanguageSwitcher.cjs","names":["BaseLanguageSwitcher: FC<BaseLanguageSwitcherProps>","useTheme","styles: Record<string, string>","useStyles","hasMultipleLanguages: boolean","autoUpdate","currentOption: LanguageOption | undefined","cx","ChevronDown","FloatingPortal","FloatingFocusManager","Check"],"sources":["../../../../../src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {\n  autoUpdate,\n  flip,\n  FloatingFocusManager,\n  FloatingPortal,\n  offset,\n  shift,\n  useClick,\n  useDismiss,\n  useFloating,\n  useInteractions,\n  useRole,\n} from '@floating-ui/react';\nimport {FC, ReactElement, ReactNode, useEffect, useState} from 'react';\nimport useStyles from './BaseLanguageSwitcher.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport {cx} from '../../../styles/emotion';\nimport Check from '../../primitives/Icons/Check';\nimport ChevronDown from '../../primitives/Icons/ChevronDown';\n\n/**\n * A resolved language option with display name and emoji flag.\n */\nexport interface LanguageOption {\n  /** BCP 47 language tag (e.g. \"en\", \"fr\", \"en-US\") */\n  code: string;\n  /** Human-readable display name resolved via Intl.DisplayNames */\n  displayName: string;\n  /** Flag emoji or globe emoji for the language */\n  emoji: string;\n}\n\n/**\n * Render props exposed to consumers when using the render-prop pattern.\n */\nexport interface LanguageSwitcherRenderProps {\n  /** The currently active language code */\n  currentLanguage: string;\n  /** Whether a language switch is in progress */\n  isLoading: boolean;\n  /** Resolved language options */\n  languages: LanguageOption[];\n  /** Call this to switch to a different language */\n  onLanguageChange: (language: string) => void;\n}\n\nexport interface BaseLanguageSwitcherProps {\n  /**\n   * Render-props callback. When provided, the default dropdown UI is replaced with\n   * whatever JSX the callback returns.\n   *\n   * @example\n   * ```tsx\n   * <BaseLanguageSwitcher {...props}>\n   *   {({languages, currentLanguage, onLanguageChange}) => (\n   *     <select value={currentLanguage} onChange={e => onLanguageChange(e.target.value)}>\n   *       {languages.map(l => <option key={l.code} value={l.code}>{l.emoji} {l.displayName}</option>)}\n   *     </select>\n   *   )}\n   * </BaseLanguageSwitcher>\n   * ```\n   */\n  children?: (props: LanguageSwitcherRenderProps) => ReactNode;\n  /** Additional CSS class applied to the root element (default UI only) */\n  className?: string;\n  /** The currently active language code */\n  currentLanguage: string;\n  /** Whether a language switch is in progress */\n  isLoading?: boolean;\n  /** Resolved language options to display */\n  languages: LanguageOption[];\n  /** Called when the user selects a language */\n  onLanguageChange: (language: string) => void;\n}\n\n/**\n * Pure-UI language switcher dropdown.\n * Accepts resolved `LanguageOption[]` (code + displayName + emoji) and delegates\n * language switching to the `onLanguageChange` callback.\n *\n * Supports render props for full UI customisation.\n */\nconst BaseLanguageSwitcher: FC<BaseLanguageSwitcherProps> = ({\n  children,\n  className,\n  currentLanguage,\n  isLoading = false,\n  languages,\n  onLanguageChange,\n}: BaseLanguageSwitcherProps): ReactElement => {\n  const {theme, colorScheme} = useTheme();\n  const styles: Record<string, string> = useStyles(theme, colorScheme);\n  const [isOpen, setIsOpen] = useState(false);\n  const hasMultipleLanguages: boolean = languages.length > 1;\n\n  useEffect(() => {\n    if (!hasMultipleLanguages && isOpen) {\n      setIsOpen(false);\n    }\n  }, [hasMultipleLanguages, isOpen]);\n\n  const {refs, floatingStyles, context} = useFloating({\n    middleware: [offset(4), flip(), shift()],\n    onOpenChange: setIsOpen,\n    open: isOpen,\n    whileElementsMounted: autoUpdate,\n  });\n\n  const click: ReturnType<typeof useClick> = useClick(context, {enabled: hasMultipleLanguages});\n  const dismiss: ReturnType<typeof useDismiss> = useDismiss(context, {enabled: hasMultipleLanguages});\n  const role: ReturnType<typeof useRole> = useRole(context, {enabled: hasMultipleLanguages, role: 'listbox'});\n  const {getReferenceProps, getFloatingProps} = useInteractions([click, dismiss, role]);\n\n  const currentOption: LanguageOption | undefined = languages.find((l: LanguageOption) => l.code === currentLanguage);\n\n  if (children) {\n    return (\n      <>\n        {children({\n          currentLanguage,\n          isLoading,\n          languages,\n          onLanguageChange,\n        })}\n      </>\n    );\n  }\n\n  return (\n    <div className={cx(styles['root'], className)}>\n      <button\n        ref={refs.setReference}\n        type=\"button\"\n        disabled={isLoading}\n        aria-label=\"Switch language\"\n        {...getReferenceProps()}\n        className={styles['trigger']}\n      >\n        {currentOption && <span className={styles['triggerEmoji']}>{currentOption.emoji}</span>}\n        <span className={styles['triggerLabel']}>{currentOption?.displayName ?? currentLanguage}</span>\n        {hasMultipleLanguages && <ChevronDown />}\n      </button>\n\n      {isOpen && hasMultipleLanguages && (\n        <FloatingPortal>\n          <FloatingFocusManager context={context} modal={false}>\n            <div\n              ref={refs.setFloating}\n              style={floatingStyles}\n              {...getFloatingProps()}\n              className={styles['content']}\n              role=\"listbox\"\n              aria-label=\"Select language\"\n            >\n              {languages.map((lang: LanguageOption) => (\n                <button\n                  key={lang.code}\n                  type=\"button\"\n                  role=\"option\"\n                  aria-selected={lang.code === currentLanguage}\n                  className={cx(styles['option'], lang.code === currentLanguage && styles['optionActive'])}\n                  onClick={() => {\n                    onLanguageChange(lang.code);\n                    setIsOpen(false);\n                  }}\n                >\n                  <span className={styles['optionEmoji']}>{lang.emoji}</span>\n                  <span className={styles['optionLabel']}>{lang.displayName}</span>\n                  {lang.code === currentLanguage && (\n                    <span className={styles['checkIcon']}>\n                      <Check />\n                    </span>\n                  )}\n                </button>\n              ))}\n            </div>\n          </FloatingFocusManager>\n        </FloatingPortal>\n      )}\n    </div>\n  );\n};\n\nexport default BaseLanguageSwitcher;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqFA,MAAMA,wBAAuD,EAC3D,UACA,WACA,iBACA,YAAY,OACZ,WACA,uBAC6C;CAC7C,MAAM,EAAC,OAAO,gBAAeC,0BAAU;CACvC,MAAMC,SAAiCC,4CAAU,OAAO,YAAY;CACpE,MAAM,CAAC,QAAQ,iCAAsB,MAAM;CAC3C,MAAMC,uBAAgC,UAAU,SAAS;AAEzD,4BAAgB;AACd,MAAI,CAAC,wBAAwB,OAC3B,WAAU,MAAM;IAEjB,CAAC,sBAAsB,OAAO,CAAC;CAElC,MAAM,EAAC,MAAM,gBAAgB,iDAAuB;EAClD,YAAY;mCAAQ,EAAE;kCAAQ;mCAAS;GAAC;EACxC,cAAc;EACd,MAAM;EACN,sBAAsBC;EACvB,CAAC;CAKF,MAAM,EAAC,mBAAmB,8DAAoC;oCAHV,SAAS,EAAC,SAAS,sBAAqB,CAAC;sCACnC,SAAS,EAAC,SAAS,sBAAqB,CAAC;mCAClD,SAAS;GAAC,SAAS;GAAsB,MAAM;GAAU,CAAC;EACvB,CAAC;CAErF,MAAMC,gBAA4C,UAAU,MAAM,MAAsB,EAAE,SAAS,gBAAgB;AAEnH,KAAI,SACF,QACE,mFACG,SAAS;EACR;EACA;EACA;EACA;EACD,CAAC,GACD;AAIP,QACE,4CAAC;EAAI,WAAWC,mBAAG,OAAO,SAAS,UAAU;aAC3C,4CAAC;GACC,KAAK,KAAK;GACV,MAAK;GACL,UAAU;GACV,cAAW;GACX,GAAI,mBAAmB;GACvB,WAAW,OAAO;;IAEjB,iBAAiB,2CAAC;KAAK,WAAW,OAAO;eAAkB,cAAc;MAAa;IACvF,2CAAC;KAAK,WAAW,OAAO;eAAkB,eAAe,eAAe;MAAuB;IAC9F,wBAAwB,2CAACC,gCAAc;;IACjC,EAER,UAAU,wBACT,2CAACC,gDACC,2CAACC;GAA8B;GAAS,OAAO;aAC7C,2CAAC;IACC,KAAK,KAAK;IACV,OAAO;IACP,GAAI,kBAAkB;IACtB,WAAW,OAAO;IAClB,MAAK;IACL,cAAW;cAEV,UAAU,KAAK,SACd,4CAAC;KAEC,MAAK;KACL,MAAK;KACL,iBAAe,KAAK,SAAS;KAC7B,WAAWH,mBAAG,OAAO,WAAW,KAAK,SAAS,mBAAmB,OAAO,gBAAgB;KACxF,eAAe;AACb,uBAAiB,KAAK,KAAK;AAC3B,gBAAU,MAAM;;;MAGlB,2CAAC;OAAK,WAAW,OAAO;iBAAiB,KAAK;QAAa;MAC3D,2CAAC;OAAK,WAAW,OAAO;iBAAiB,KAAK;QAAmB;MAChE,KAAK,SAAS,mBACb,2CAAC;OAAK,WAAW,OAAO;iBACtB,2CAACI,0BAAQ;QACJ;;OAfJ,KAAK,KAiBH,CACT;KACE;IACe,GACR;GAEf;;AAIV,mCAAe"}

package/dist/cjs/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.styles.cjs

@@ -1,117 +0,0 @@
-const require_rolldown_runtime = require('../../../_virtual/rolldown_runtime.cjs');
-const require_emotion = require('../../../styles/emotion.cjs');
-let react = require("react");
-react = require_rolldown_runtime.__toESM(react);
-
-//#region src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.styles.ts
-const useStyles = (theme, colorScheme) => (0, react.useMemo)(() => {
-	const root = require_emotion.css`
-      display: inline-block;
-      position: relative;
-      font-family: ${theme.vars.typography.fontFamily};
-    `;
-	const trigger = require_emotion.css`
-      display: inline-flex;
-      align-items: center;
-      gap: calc(${theme.vars.spacing.unit} * 0.5);
-      padding: calc(${theme.vars.spacing.unit} * 0.75) ${theme.vars.spacing.unit};
-      border: 1px solid ${theme.vars.colors.border};
-      background: ${theme.vars.colors.background.surface};
-      cursor: pointer;
-      border-radius: ${theme.vars.borderRadius.medium};
-      min-width: 120px;
-      font-size: 0.875rem;
-      color: ${theme.vars.colors.text.primary};
-
-      &:hover {
-        background-color: ${theme.vars.colors.action?.hover || "rgba(0, 0, 0, 0.04)"};
-      }
-    `;
-	const triggerEmoji = require_emotion.css`
-      font-size: 1rem;
-      line-height: 1;
-    `;
-	const triggerLabel = require_emotion.css`
-      flex: 1;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-      font-weight: 500;
-    `;
-	const content = require_emotion.css`
-      min-width: 200px;
-      max-width: 320px;
-      background-color: ${theme.vars.colors.background.surface};
-      border-radius: ${theme.vars.borderRadius.medium};
-      box-shadow: ${theme.vars.shadows.medium};
-      border: 1px solid ${theme.vars.colors.border};
-      outline: none;
-      z-index: 1000;
-      padding: calc(${theme.vars.spacing.unit} * 0.5) 0;
-    `;
-	const option = require_emotion.css`
-      display: flex;
-      align-items: center;
-      gap: ${theme.vars.spacing.unit};
-      padding: calc(${theme.vars.spacing.unit} * 1) calc(${theme.vars.spacing.unit} * 1.5);
-      width: 100%;
-      border: none;
-      background-color: transparent;
-      cursor: pointer;
-      font-size: 0.875rem;
-      text-align: start;
-      color: ${theme.vars.colors.text.primary};
-      transition: background-color 0.15s ease-in-out;
-
-      &:hover {
-        background-color: ${theme.vars.colors.action?.hover || "rgba(0, 0, 0, 0.04)"};
-      }
-    `;
-	const optionActive = require_emotion.css`
-      font-weight: 600;
-      color: ${theme.vars.colors.primary?.main || theme.vars.colors.text.primary};
-    `;
-	const optionEmoji = require_emotion.css`
-      font-size: 1rem;
-      line-height: 1;
-      flex-shrink: 0;
-    `;
-	const optionLabel = require_emotion.css`
-      flex: 1;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      white-space: nowrap;
-    `;
-	return {
-		checkIcon: require_emotion.css`
-      color: ${theme.vars.colors.primary?.main || theme.vars.colors.text.primary};
-      flex-shrink: 0;
-      margin-inline-start: auto;
-    `,
-		content,
-		option,
-		optionActive,
-		optionEmoji,
-		optionLabel,
-		root,
-		trigger,
-		triggerEmoji,
-		triggerLabel
-	};
-}, [
-	theme.vars.colors.background.surface,
-	theme.vars.colors.text.primary,
-	theme.vars.colors.border,
-	theme.vars.borderRadius.medium,
-	theme.vars.shadows.medium,
-	theme.vars.spacing.unit,
-	theme.vars.colors.action?.hover,
-	theme.vars.typography.fontFamily,
-	theme.vars.colors.primary?.main,
-	colorScheme
-]);
-var BaseLanguageSwitcher_styles_default = useStyles;
-
-//#endregion
-exports.default = BaseLanguageSwitcher_styles_default;
-//# sourceMappingURL=BaseLanguageSwitcher.styles.cjs.map

package/dist/cjs/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.styles.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"BaseLanguageSwitcher.styles.cjs","names":["root: string","trigger: string","triggerEmoji: string","triggerLabel: string","content: string","option: string","optionActive: string","optionEmoji: string","optionLabel: string"],"sources":["../../../../../src/components/presentation/LanguageSwitcher/BaseLanguageSwitcher.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\nconst useStyles = (theme: Theme, colorScheme: string): Record<string, string> =>\n  useMemo(() => {\n    const root: string = css`\n      display: inline-block;\n      position: relative;\n      font-family: ${theme.vars.typography.fontFamily};\n    `;\n\n    const trigger: string = css`\n      display: inline-flex;\n      align-items: center;\n      gap: calc(${theme.vars.spacing.unit} * 0.5);\n      padding: calc(${theme.vars.spacing.unit} * 0.75) ${theme.vars.spacing.unit};\n      border: 1px solid ${theme.vars.colors.border};\n      background: ${theme.vars.colors.background.surface};\n      cursor: pointer;\n      border-radius: ${theme.vars.borderRadius.medium};\n      min-width: 120px;\n      font-size: 0.875rem;\n      color: ${theme.vars.colors.text.primary};\n\n      &:hover {\n        background-color: ${theme.vars.colors.action?.hover || 'rgba(0, 0, 0, 0.04)'};\n      }\n    `;\n\n    const triggerEmoji: string = css`\n      font-size: 1rem;\n      line-height: 1;\n    `;\n\n    const triggerLabel: string = css`\n      flex: 1;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      font-weight: 500;\n    `;\n\n    const content: string = css`\n      min-width: 200px;\n      max-width: 320px;\n      background-color: ${theme.vars.colors.background.surface};\n      border-radius: ${theme.vars.borderRadius.medium};\n      box-shadow: ${theme.vars.shadows.medium};\n      border: 1px solid ${theme.vars.colors.border};\n      outline: none;\n      z-index: 1000;\n      padding: calc(${theme.vars.spacing.unit} * 0.5) 0;\n    `;\n\n    const option: string = css`\n      display: flex;\n      align-items: center;\n      gap: ${theme.vars.spacing.unit};\n      padding: calc(${theme.vars.spacing.unit} * 1) calc(${theme.vars.spacing.unit} * 1.5);\n      width: 100%;\n      border: none;\n      background-color: transparent;\n      cursor: pointer;\n      font-size: 0.875rem;\n      text-align: start;\n      color: ${theme.vars.colors.text.primary};\n      transition: background-color 0.15s ease-in-out;\n\n      &:hover {\n        background-color: ${theme.vars.colors.action?.hover || 'rgba(0, 0, 0, 0.04)'};\n      }\n    `;\n\n    const optionActive: string = css`\n      font-weight: 600;\n      color: ${theme.vars.colors.primary?.main || theme.vars.colors.text.primary};\n    `;\n\n    const optionEmoji: string = css`\n      font-size: 1rem;\n      line-height: 1;\n      flex-shrink: 0;\n    `;\n\n    const optionLabel: string = css`\n      flex: 1;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    `;\n\n    const checkIcon: string = css`\n      color: ${theme.vars.colors.primary?.main || theme.vars.colors.text.primary};\n      flex-shrink: 0;\n      margin-inline-start: auto;\n    `;\n\n    return {\n      checkIcon,\n      content,\n      option,\n      optionActive,\n      optionEmoji,\n      optionLabel,\n      root,\n      trigger,\n      triggerEmoji,\n      triggerLabel,\n    };\n  }, [\n    theme.vars.colors.background.surface,\n    theme.vars.colors.text.primary,\n    theme.vars.colors.border,\n    theme.vars.borderRadius.medium,\n    theme.vars.shadows.medium,\n    theme.vars.spacing.unit,\n    theme.vars.colors.action?.hover,\n    theme.vars.typography.fontFamily,\n    theme.vars.colors.primary?.main,\n    colorScheme,\n  ]);\n\nexport default useStyles;\n"],"mappings":";;;;;;AAOA,MAAM,aAAa,OAAc,yCACjB;CACZ,MAAMA,OAAe,mBAAG;;;qBAGP,MAAM,KAAK,WAAW,WAAW;;CAGlD,MAAMC,UAAkB,mBAAG;;;kBAGb,MAAM,KAAK,QAAQ,KAAK;sBACpB,MAAM,KAAK,QAAQ,KAAK,WAAW,MAAM,KAAK,QAAQ,KAAK;0BACvD,MAAM,KAAK,OAAO,OAAO;oBAC/B,MAAM,KAAK,OAAO,WAAW,QAAQ;;uBAElC,MAAM,KAAK,aAAa,OAAO;;;eAGvC,MAAM,KAAK,OAAO,KAAK,QAAQ;;;4BAGlB,MAAM,KAAK,OAAO,QAAQ,SAAS,sBAAsB;;;CAIjF,MAAMC,eAAuB,mBAAG;;;;CAKhC,MAAMC,eAAuB,mBAAG;;;;;;;CAQhC,MAAMC,UAAkB,mBAAG;;;0BAGL,MAAM,KAAK,OAAO,WAAW,QAAQ;uBACxC,MAAM,KAAK,aAAa,OAAO;oBAClC,MAAM,KAAK,QAAQ,OAAO;0BACpB,MAAM,KAAK,OAAO,OAAO;;;sBAG7B,MAAM,KAAK,QAAQ,KAAK;;CAG1C,MAAMC,SAAiB,mBAAG;;;aAGjB,MAAM,KAAK,QAAQ,KAAK;sBACf,MAAM,KAAK,QAAQ,KAAK,aAAa,MAAM,KAAK,QAAQ,KAAK;;;;;;;eAOpE,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;4BAIlB,MAAM,KAAK,OAAO,QAAQ,SAAS,sBAAsB;;;CAIjF,MAAMC,eAAuB,mBAAG;;eAErB,MAAM,KAAK,OAAO,SAAS,QAAQ,MAAM,KAAK,OAAO,KAAK,QAAQ;;CAG7E,MAAMC,cAAsB,mBAAG;;;;;CAM/B,MAAMC,cAAsB,mBAAG;;;;;;AAa/B,QAAO;EACL,WAPwB,mBAAG;eAClB,MAAM,KAAK,OAAO,SAAS,QAAQ,MAAM,KAAK,OAAO,KAAK,QAAQ;;;;EAO3E;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;GACA;CACD,MAAM,KAAK,OAAO,WAAW;CAC7B,MAAM,KAAK,OAAO,KAAK;CACvB,MAAM,KAAK,OAAO;CAClB,MAAM,KAAK,aAAa;CACxB,MAAM,KAAK,QAAQ;CACnB,MAAM,KAAK,QAAQ;CACnB,MAAM,KAAK,OAAO,QAAQ;CAC1B,MAAM,KAAK,WAAW;CACtB,MAAM,KAAK,OAAO,SAAS;CAC3B;CACD,CAAC;AAEJ,0CAAe"}