npm - @thunderid/react - Versions diffs - 1.5.0 → 1.6.0 - Mend

@thunderid/react 1.5.0 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1334) hide show

package/dist/components/auth/flow/AuthOptionFactory.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"AuthOptionFactory.js","names":["logger: ReturnType<typeof createPackageComponentLogger>","richTextClassCache: string | undefined","authOptionIconClassCache: string | undefined","providerId: any","providerMatches: any","theme: any","customRenderers: ComponentRendererMap","key: string | number","customRenderer: ComponentRenderer | undefined","rendered: ReactElement | null","identifier: string","isTouched: boolean","value: string","error: string","fieldType: string","hasPrefixes: boolean","hasPostfix: boolean","prefixStateKey: string","postfixStateKey: string","defaultPrefixValue: string","selectedPrefix: string","AffixedField","reportedLength: number","otpLength: number | undefined","numericOnly: boolean","actionId: string","eventType: string","buttonText: string","componentVariant: string","shouldSkipValidation: boolean","buttonType: HTMLButtonElement['type']","formData: Record<string, any>","consentPrompt: ConsentPromptData | undefined","isDeny: boolean","decisions: ConsentDecisions","socialButtonClassName: string","GoogleButton","GitHubButton","FacebookButton","MicrosoftButton","LinkedInButton","SignInWithEthereumButton","SmsOtpButton","startIconEl: ReactElement | null","endIconEl: ReactElement | null","Button","variant: any","textAlignClass: string","Typography","Divider","selectOptions: any","Select","DatePicker","BaseUserSelect","BaseAuthFlowSelect","BaseUserTypeSelect","formClass: string","blockComponents: any","richTextAction: EmbeddedFlowComponentAction | undefined","syntheticAction: EmbeddedFlowComponent","formData: Record<string, string>","handleRichTextClick: React.MouseEventHandler<HTMLDivElement> | undefined","anchor: HTMLAnchorElement | null","handleRichTextKeyDown: React.KeyboardEventHandler<HTMLDivElement> | undefined","explicitHeight: string","explicitWidth: string","ImageComponent","iconName: string","IconComponent: any","flowIconRegistry","direction: string","gap: number","align: string","justify: string","rawItems: string | number | undefined","parsedItems: number","items: number | null","isColumn: boolean","gridJustify: string","track: string","stackClass: string","stackChildren: (ReactElement | null)[]","consentPromptRawData: ConsentPromptData | string | undefined","Consent","textTemplate: string","timeoutMs: number","FlowTimer","sourceKey: string | undefined","CopyableText","pairs: KeyValuePair[]","KeyValueList"],"sources":["../../../../src/components/auth/flow/AuthOptionFactory.tsx"],"sourcesContent":["// Copyright 2025 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport type {CSSInterpolation} from '@emotion/css/create-instance';\nimport {\n ConsentConstants,\n FieldType,\n FlowMetadataResponse,\n EmbeddedFlowComponent,\n EmbeddedFlowComponentAction,\n EmbeddedFlowComponentType,\n EmbeddedFlowTextVariant,\n EmbeddedFlowEventType,\n createPackageComponentLogger,\n resolveFlowTemplateLiterals,\n resolveEmojiUrisInHtml,\n ConsentPurposeData,\n ConsentPromptData,\n ConsentDecisions,\n ConsentPurposeDecision,\n ConsentAttributeElement,\n OrganizationUnitListResponse,\n PrefixOption,\n KeyValuePair,\n parseKeyValuePairs,\n FetchAuthFlows,\n FetchUserTypes,\n FetchUsers,\n} from '@thunderid/browser';\nimport DOMPurify from 'dompurify';\nimport {ChangeEvent, cloneElement, CSSProperties, FormEvent, ReactElement} from 'react';\nimport Consent from './Consent';\nimport {getConsentOptionalKey} from './ConsentCheckboxList';\nimport {createField} from './FieldFactory';\nimport FlowTimer from './FlowTimer';\nimport ImageComponent from './ImageComponent';\nimport {\n ComponentRenderer,\n ComponentRenderContext,\n ComponentRendererMap,\n} from '../../../contexts/ComponentRenderer/ComponentRendererContext';\nimport {UseTranslation} from '../../../hooks/useTranslation';\nimport {css, cx} from '../../../styles/emotion';\nimport {affixPostfixKey, affixPrefixKey} from '../../../utils/composeAffixedInputs';\nimport AffixedField from '../../primitives/AffixedField/AffixedField';\nimport BaseAuthFlowSelect from '../../primitives/AuthFlowSelect/BaseAuthFlowSelect';\nimport Button from '../../primitives/Button/Button';\nimport CopyableText from '../../primitives/CopyableText/CopyableText';\nimport DatePicker from '../../primitives/DatePicker/DatePicker';\nimport Divider from '../../primitives/Divider/Divider';\nimport flowIconRegistry from '../../primitives/Icons/flowIconRegistry';\nimport KeyValueList from '../../primitives/KeyValueList/KeyValueList';\nimport Select from '../../primitives/Select/Select';\nimport Typography from '../../primitives/Typography/Typography';\nimport {TypographyVariant} from '../../primitives/Typography/Typography.styles';\nimport BaseUserSelect, {BaseUserSelectProps} from '../../primitives/UserSelect/BaseUserSelect';\nimport BaseUserTypeSelect from '../../primitives/UserTypeSelect/BaseUserTypeSelect';\nimport FacebookButton from '../buttons/FacebookButton';\nimport GitHubButton from '../buttons/GitHubButton';\nimport GoogleButton from '../buttons/GoogleButton';\nimport LinkedInButton from '../buttons/LinkedInButton';\nimport MicrosoftButton from '../buttons/MicrosoftButton';\nimport SignInWithEthereumButton from '../buttons/SignInWithEthereumButton';\nimport SmsOtpButton from '../buttons/SmsOtpButton';\n\nconst logger: ReturnType<typeof createPackageComponentLogger> = createPackageComponentLogger(\n '@thunderid/react',\n 'AuthOptionFactory',\n);\n\n/**\n * Replaces `emoji:` URIs embedded in HTML before DOMPurify sanitization.\n *\n * DOMPurify strips unknown URI schemes from attributes (e.g. `src=\"emoji:🦊\"` → `src=\"\"`).\n * This function converts:\n * - `<img src=\"emoji:X\" alt=\"Y\">` → `<span role=\"img\" aria-label=\"Y\">X</span>`\n * - Any remaining `emoji:X` text occurrences → `X`\n */\n\n// This module's functions (renderSignInComponents, etc.) are called imperatively from a\n// component's render, not React components/hooks themselves — so these classes can't be computed\n// at module scope: that runs at import time, before <ThunderIDProvider> has had a chance to\n// configure Emotion's CSP nonce, which would insert them into an un-nonced <style> tag. Instead\n// they're computed lazily, on first actual use (still just once — Emotion's own cache dedupes any\n// further calls to a no-op after that).\nlet richTextClassCache: string | undefined;\n\n/** Ensures rich-text content (including all inner elements from the server) always word-wraps. */\nfunction getRichTextClass(): string {\n richTextClassCache ??= css`\n overflow-wrap: anywhere;\n & * {\n overflow-wrap: anywhere;\n word-break: break-word;\n }\n & .rich-text-align-left {\n text-align: left;\n }\n & .rich-text-align-center {\n text-align: center;\n }\n & .rich-text-align-right {\n text-align: right;\n }\n & .rich-text-align-justify {\n text-align: justify;\n }\n & a,\n & .rich-text-link {\n text-decoration: underline;\n }\n & span[role='img'] {\n display: inline-block;\n }\n `;\n return richTextClassCache;\n}\n\nlet authOptionIconClassCache: string | undefined;\n\nfunction getAuthOptionIconClass(): string {\n authOptionIconClassCache ??= css({height: '1.25em', objectFit: 'contain', width: '1.25em'});\n return authOptionIconClassCache;\n}\n\nexport type AuthType = 'signin' | 'signup' | 'recovery';\n\n/**\n * Get the appropriate FieldType for an input component.\n */\n/** Upper bound on STACK grid slots, so a mistyped `items` cannot render thousands of cells. */\nconst MAX_STACK_ITEMS = 12;\n\nconst getFieldType = (variant: EmbeddedFlowComponentType): FieldType => {\n switch (variant) {\n case EmbeddedFlowComponentType.EmailInput:\n return FieldType.Email;\n case EmbeddedFlowComponentType.PhoneInput:\n return FieldType.Tel;\n case EmbeddedFlowComponentType.PasswordInput:\n return FieldType.Password;\n case EmbeddedFlowComponentType.TextInput:\n default:\n return FieldType.Text;\n }\n};\n\n/**\n * Get typography variant from component variant.\n */\nconst getTypographyVariant = (variant: string): any => {\n const variantMap: Record<EmbeddedFlowTextVariant, TypographyVariant> = {\n BODY_1: 'body1',\n BODY_2: 'body2',\n BUTTON_TEXT: 'button',\n CAPTION: 'caption',\n HEADING_1: 'h1',\n HEADING_2: 'h2',\n HEADING_3: 'h3',\n HEADING_4: 'h4',\n HEADING_5: 'h5',\n HEADING_6: 'h6',\n OVERLINE: 'overline',\n SUBTITLE_1: 'subtitle1',\n SUBTITLE_2: 'subtitle2',\n };\n\n return variantMap[variant] || 'h3';\n};\n\n/**\n * Check if a button text or action matches a social provider.\n */\nconst matchesSocialProvider = (\n actionId: string,\n eventType: string,\n buttonText: string,\n provider: string,\n authType: AuthType,\n /* eslint-disable-next-line @typescript-eslint/no-unused-vars */\n _componentVariant?: string,\n): boolean => {\n const providerId: any = `${provider}_auth`;\n const providerMatches: any = actionId === providerId || eventType === providerId;\n\n // Social buttons usually have \"Sign in with X\" or \"Continue with X\" text,\n // so also check button text for the provider name to increase chances of correct detection (especially for signup flows where action IDs are less standardized)\n if (buttonText.toLowerCase().includes(provider)) {\n return true;\n }\n\n // For signup, also check button text\n if (authType === 'signup') {\n return providerMatches || buttonText.toLowerCase().includes(provider);\n }\n\n return providerMatches;\n};\n\n/**\n * Create an auth component from flow component configuration.\n */\nconst createAuthComponentFromFlow = (\n component: EmbeddedFlowComponent,\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n authType: AuthType,\n options: {\n /** @internal Passed from the host React component so hooks aren't called inside a loop. */\n _customRenderers?: ComponentRendererMap;\n /** @internal Passed from the host React component so hooks aren't called inside a loop. */\n _theme?: any;\n /** Additional data from the flow response, used for different dynamic data */\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n /** Current consent purpose being rendered. Set by CONSENT_PURPOSE block iteration. */\n currentConsentPurpose?: ConsentPurposeData;\n inStack?: boolean;\n inputClassName?: string;\n /** Flag to determine if the step timeline has expired */\n isTimeoutDisabled?: boolean;\n key?: string | number;\n /** Data source for AUTH_FLOW_SELECT fields. */\n fetchAuthFlows?: FetchAuthFlows;\n /** Data source for USER_SELECT fields. */\n fetchUsers?: FetchUsers;\n /** Data source for USER_TYPE_SELECT fields. */\n fetchUserTypes?: FetchUserTypes;\n /** Flow metadata for resolving {{meta(...)}} expressions at render time */\n meta?: FlowMetadataResponse | null;\n onInputBlur?: (name: string) => void;\n /** Called with the error of a failed picker load. The form itself shows no error for it. */\n onPickerError?: (error: Error) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' | 'medium' | 'large';\n /** Translation function for resolving {{t(...)}} expressions at render time */\n t?: UseTranslation['t'];\n variant?: any;\n /** Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n } = {},\n): ReactElement | null => {\n const theme: any = options._theme;\n const customRenderers: ComponentRendererMap = options._customRenderers ?? {};\n\n const key: string | number = options.key || component.id;\n\n const customRenderer: ComponentRenderer | undefined =\n customRenderers[component.id] ?? customRenderers[component.type];\n if (customRenderer) {\n const renderCtx: ComponentRenderContext = {\n additionalData: options.additionalData,\n authType,\n formErrors,\n formValues,\n isFormValid,\n isLoading,\n meta: options.meta,\n resetForm,\n onInputBlur: options.onInputBlur,\n onInputChange,\n onSubmit: options.onSubmit,\n touchedFields,\n };\n // Key the element here so a renderer does not have to, as the built-in cases below do.\n const rendered: ReactElement | null = customRenderer(component, renderCtx);\n\n return rendered ? cloneElement(rendered, {key}) : null;\n }\n\n /** Resolve any remaining {{t()}} or {{meta()}} template expressions in a string at render time. */\n const resolve = (text: string | undefined): string => {\n if (!text || (!options.t && !options.meta)) {\n return text || '';\n }\n return resolveFlowTemplateLiterals(text, {meta: options.meta, t: options.t || ((k: string): string => k)});\n };\n\n // The props a flow gives each of the resource pickers (USER_SELECT, AUTH_FLOW_SELECT, USER_TYPE_SELECT).\n const resourceSelectProps = (): Omit<BaseUserSelectProps, 'fetchUsers' | 'mapping'> => {\n const identifier: string = component.ref!;\n const isTouched: boolean = touchedFields[identifier] || false;\n\n return {\n className: cx(options.inputClassName, component.classes),\n component,\n error: isTouched ? formErrors[identifier] : undefined,\n id: component.id,\n label: resolve(component.label) || '',\n name: identifier,\n onBlur: (): void => options.onInputBlur?.(identifier),\n onChange: (event: ChangeEvent<HTMLSelectElement>): void => onInputChange(identifier, event.target.value),\n onError: options.onPickerError,\n placeholder: resolve(component.placeholder),\n required: component.required,\n value: formValues[identifier] || '',\n };\n };\n\n // A component type this render cannot draw is logged and left out.\n const skipUnsupported = (typeName: string): null => {\n logger.warn(`${typeName} component type is not supported. Skipping render.`);\n\n return null;\n };\n\n switch (component.type) {\n case EmbeddedFlowComponentType.TextInput:\n case EmbeddedFlowComponentType.PasswordInput:\n case EmbeddedFlowComponentType.EmailInput:\n case EmbeddedFlowComponentType.PhoneInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] || '';\n const isTouched: boolean = touchedFields[identifier] || false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n const fieldType: string = getFieldType(component.type);\n\n // Prefix/postfix are accepted on any text-family input. When either is present,\n // route to AffixedField so the leading affix renders and submit-time composition\n // is picked up by composeAffixedInputs via the sentinel keys.\n // Both string.length and Array.length are defined, so a single truthy+length\n // check covers `prefixes?: string | PrefixOption[]`.\n const hasPrefixes: boolean = !!component.prefixes && component.prefixes.length > 0;\n const hasPostfix: boolean = typeof component.postfix === 'string' && component.postfix.length > 0;\n\n if (hasPrefixes || hasPostfix) {\n const prefixStateKey: string = affixPrefixKey(identifier, options.vendor);\n const postfixStateKey: string = affixPostfixKey(identifier, options.vendor);\n const defaultPrefixValue: string = hasPrefixes\n ? typeof component.prefixes === 'string'\n ? component.prefixes\n : (component.prefixes as PrefixOption[])[0].value\n : '';\n const selectedPrefix: string = formValues[prefixStateKey] ?? defaultPrefixValue;\n\n return (\n <AffixedField\n key={key}\n className={cx(options.inputClassName, component.classes)}\n id={component.id}\n label={resolve(component.label) || ''}\n name={identifier}\n placeholder={resolve(component.placeholder) || ''}\n required={component.required || false}\n error={error}\n value={value}\n type={fieldType}\n prefixes={component.prefixes}\n prefixValue={selectedPrefix}\n onChange={(e: ChangeEvent<HTMLInputElement>): void => onInputChange(identifier, e.target.value)}\n onBlur={(): void => options.onInputBlur?.(identifier)}\n onPrefixChange={(newPrefix: string): void => onInputChange(prefixStateKey, newPrefix)}\n onFocus={(): void => {\n if (hasPrefixes && formValues[prefixStateKey] === undefined) {\n onInputChange(prefixStateKey, defaultPrefixValue);\n }\n if (hasPostfix && formValues[postfixStateKey] === undefined) {\n onInputChange(postfixStateKey, component.postfix!);\n }\n }}\n />\n );\n }\n\n const field: any = createField({\n className: cx(options.inputClassName, component.classes),\n error,\n id: component.id,\n label: resolve(component.label) || '',\n name: identifier,\n onBlur: () => options.onInputBlur?.(identifier),\n onChange: (newValue: string) => onInputChange(identifier, newValue),\n placeholder: resolve(component.placeholder) || '',\n required: component.required || false,\n type: fieldType as FieldType,\n value,\n });\n\n return cloneElement(field, {key});\n }\n\n case EmbeddedFlowComponentType.OtpInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] || '';\n const isTouched: boolean = touchedFields[identifier] || false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n // The server reports the length and character set of the code it generated, so the field\n // matches the OTP the user received. An older server omits both and the defaults apply.\n const reportedLength: number = Number(options.additionalData?.['otpLength']);\n const otpLength: number | undefined =\n Number.isInteger(reportedLength) && reportedLength > 0 ? reportedLength : undefined;\n const numericOnly: boolean = options.additionalData?.['otpNumericOnly'] !== 'false';\n\n const field: any = createField({\n className: cx(options.inputClassName, component.classes),\n error,\n id: component.id,\n label: resolve(component.label) || '',\n length: otpLength,\n name: identifier,\n numericOnly,\n onBlur: () => options.onInputBlur?.(identifier),\n onChange: (newValue: string) => onInputChange(identifier, newValue),\n placeholder: resolve(component.placeholder) || '',\n required: component.required || false,\n type: FieldType.Otp,\n value,\n });\n\n return cloneElement(field, {key});\n }\n\n case EmbeddedFlowComponentType.Action: {\n const actionId: string = component.id;\n const eventType: string = component.eventType || '';\n const buttonText: string = resolve(component.label);\n const componentVariant: string = component.variant || '';\n\n // Only validate on submit type events.\n const shouldSkipValidation: boolean = eventType.toUpperCase() !== EmbeddedFlowEventType.Submit;\n\n // Determine the button type based on the event type. Default to 'submit' if not recognized.\n const buttonTypeEnum = {\n [EmbeddedFlowEventType.Submit]: 'submit',\n [EmbeddedFlowEventType.Reset]: 'reset',\n [EmbeddedFlowEventType.Cancel]: 'button',\n [EmbeddedFlowEventType.Trigger]: 'button',\n [EmbeddedFlowEventType.Back]: 'button',\n };\n const buttonType: HTMLButtonElement['type'] = buttonTypeEnum[eventType.toUpperCase()] ?? 'submit';\n\n const handleClick = (): any => {\n if (options.onSubmit) {\n const formData: Record<string, any> = {};\n Object.keys(formValues).forEach((field: any) => {\n // Include all values, even empty strings, to ensure proper submission\n formData[field] = formValues[field];\n });\n\n // For consent actions, build the consent_decisions JSON from the form values.\n // The allow action captures per-attribute choices; the deny action sends\n // all purposes as rejected so the backend ConsentExecutor can fail the flow.\n const consentPrompt: ConsentPromptData | undefined = options.additionalData?.['consentPrompt'] as\n | ConsentPromptData\n | undefined;\n if (consentPrompt && eventType.toUpperCase() === EmbeddedFlowEventType.Submit) {\n const isDeny: boolean = componentVariant.toLowerCase() !== 'primary';\n const decisions: ConsentDecisions = {\n approved: !isDeny,\n ...(isDeny ? {reason: ConsentConstants.REASON_USER_DENIED} : {}),\n purposes: consentPrompt.purposes.map(\n (p: ConsentPurposeData): ConsentPurposeDecision => ({\n approved: !isDeny,\n elements: [\n // Permission purposes carry no essential elements, so the server sends null here\n ...(p.essential ?? []).map((e): ConsentAttributeElement => ({approved: !isDeny, name: e.name})),\n ...(p.optional ?? []).map(\n (e): ConsentAttributeElement => ({\n approved: !isDeny && formValues[getConsentOptionalKey(p.purposeId, e.name)] === 'true',\n name: e.name,\n }),\n ),\n ],\n purposeName: p.purposeName!,\n }),\n ),\n };\n formData['consent_decisions'] = JSON.stringify(decisions);\n }\n\n // For submit events, pass the form data to the onSubmit callback. For other event types, reset the form and call onSubmit with an empty data object.\n if (eventType.toUpperCase() === EmbeddedFlowEventType.Submit) {\n options.onSubmit(component, formData, shouldSkipValidation);\n } else {\n resetForm();\n options.onSubmit(component, {}, shouldSkipValidation);\n }\n }\n };\n\n // Render branded social login buttons for known action IDs\n\n const socialButtonClassName: string = cx(options.buttonClassName, component.classes);\n\n if (matchesSocialProvider(actionId, eventType, buttonText, 'google', authType, componentVariant)) {\n return <GoogleButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'github', authType, componentVariant)) {\n return <GitHubButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'facebook', authType, componentVariant)) {\n return <FacebookButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'microsoft', authType, componentVariant)) {\n return <MicrosoftButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'linkedin', authType, componentVariant)) {\n return <LinkedInButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n if (matchesSocialProvider(actionId, eventType, buttonText, 'ethereum', authType, componentVariant)) {\n return (\n <SignInWithEthereumButton\n key={key}\n id={component.id}\n onClick={handleClick}\n className={socialButtonClassName}\n />\n );\n }\n if (actionId === 'prompt_mobile' || eventType === 'prompt_mobile') {\n return <SmsOtpButton key={key} id={component.id} onClick={handleClick} className={socialButtonClassName} />;\n }\n\n const startIconEl: ReactElement | null = component.startIcon ? (\n <img src={component.startIcon} alt=\"\" aria-hidden=\"true\" className={getAuthOptionIconClass()} />\n ) : null;\n\n const endIconEl: ReactElement | null = component.endIcon ? (\n <img src={component.endIcon} alt=\"\" aria-hidden=\"true\" className={getAuthOptionIconClass()} />\n ) : null;\n\n return (\n <Button\n fullWidth\n key={key}\n id={component.id}\n onClick={handleClick}\n disabled={\n isLoading ||\n (!isFormValid && !shouldSkipValidation) ||\n options.isTimeoutDisabled ||\n (component as any).config?.disabled\n }\n className={cx(options.buttonClassName, component.classes)}\n data-testid=\"thunderid-signin-submit\"\n variant={component.variant?.toLowerCase() === 'primary' ? 'solid' : 'outline'}\n color={component.variant?.toLowerCase() === 'primary' ? 'primary' : 'secondary'}\n startIcon={startIconEl}\n endIcon={endIconEl}\n type={buttonType}\n >\n {buttonText || 'Submit'}\n </Button>\n );\n }\n\n case EmbeddedFlowComponentType.Text: {\n const variant: any = getTypographyVariant(component.variant!);\n const textAlignClass: string = css({\n marginBottom: 2,\n textAlign:\n typeof component?.align === 'string' ? (component.align as React.CSSProperties['textAlign']) : 'left',\n });\n return (\n <Typography key={key} id={component.id} className={cx(component.classes, textAlignClass)} variant={variant}>\n {resolve(component.label)}\n </Typography>\n );\n }\n\n case EmbeddedFlowComponentType.Divider: {\n return <Divider key={key}>{resolve(component.label) || ''}</Divider>;\n }\n\n case EmbeddedFlowComponentType.Select: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] || '';\n const isTouched: boolean = touchedFields[identifier] || false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n // Options are pre-sanitized by flowTransformer to {value: string, label: string} format\n const selectOptions: any = (component.options || []).map((opt: any) => ({\n label: typeof opt === 'string' ? opt : String(opt.label ?? opt.value ?? ''),\n value: typeof opt === 'string' ? opt : String(opt.value ?? ''),\n }));\n\n return (\n <Select\n key={key}\n id={component.id}\n name={identifier}\n label={resolve(component.label) || ''}\n placeholder={resolve(component.placeholder)}\n required={component.required}\n options={selectOptions}\n value={value}\n error={error}\n onChange={(e: any): void => onInputChange(identifier, e.target.value)}\n onBlur={(): any => options.onInputBlur?.(identifier)}\n className={cx(options.inputClassName, component.classes)}\n />\n );\n }\n\n case EmbeddedFlowComponentType.DateInput: {\n const identifier: string = component.ref!;\n const value: string = formValues[identifier] || '';\n const isTouched: boolean = touchedFields[identifier] || false;\n const error: string = isTouched ? formErrors[identifier] : undefined!;\n\n return (\n <DatePicker\n key={key}\n id={component.id}\n name={identifier}\n label={resolve(component.label) || ''}\n placeholder={resolve(component.placeholder)}\n required={component.required}\n dateFormat={component.dateFormat}\n value={value}\n error={error}\n onChange={(e: any): void => onInputChange(identifier, e.target.value)}\n onBlur={(): any => options.onInputBlur?.(identifier)}\n className={cx(options.inputClassName, component.classes)}\n />\n );\n }\n\n case EmbeddedFlowComponentType.OuSelect:\n return skipUnsupported('OU_SELECT');\n\n // The resource pickers load with a signed-in user's access token, so without a data source, which is every flow\n // except InviteUser, they are not drawn.\n case EmbeddedFlowComponentType.UserSelect:\n return options.fetchUsers ? (\n <BaseUserSelect key={key} {...resourceSelectProps()} fetchUsers={options.fetchUsers} />\n ) : (\n skipUnsupported('USER_SELECT')\n );\n\n case EmbeddedFlowComponentType.AuthFlowSelect:\n return options.fetchAuthFlows ? (\n <BaseAuthFlowSelect key={key} {...resourceSelectProps()} fetchAuthFlows={options.fetchAuthFlows} />\n ) : (\n skipUnsupported('AUTH_FLOW_SELECT')\n );\n\n case EmbeddedFlowComponentType.UserTypeSelect:\n return options.fetchUserTypes ? (\n <BaseUserTypeSelect key={key} {...resourceSelectProps()} fetchUserTypes={options.fetchUserTypes} />\n ) : (\n skipUnsupported('USER_TYPE_SELECT')\n );\n\n case EmbeddedFlowComponentType.Block: {\n if (component.components && component.components.length > 0) {\n const formClass: string = css({\n display: 'flex',\n flexDirection: 'column',\n gap: `calc(${theme?.vars?.spacing?.unit ?? '4px'} * 2)`,\n });\n\n const blockComponents: any = component.components\n .map((childComponent: any, index: any) =>\n createAuthComponentFromFlow(\n childComponent,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n authType,\n {\n ...options,\n key: childComponent.id || `${component.id}_${index}`,\n },\n ),\n )\n .filter(Boolean);\n\n // The submit button's `type=\"submit\"` (and pressing Enter in a field) would\n // otherwise trigger the browser's native form submission — a GET request to\n // the current URL with all field values (including passwords) as query params.\n // Actual submission is handled entirely via `onClick`/`onSubmit` above.\n return (\n <form\n id={component.id}\n key={key}\n className={cx(component.classes, formClass)}\n onSubmit={(event: FormEvent<HTMLFormElement>): void => event.preventDefault()}\n >\n {blockComponents}\n </form>\n );\n }\n return null;\n }\n\n case EmbeddedFlowComponentType.RichText: {\n const richTextAction: EmbeddedFlowComponentAction | undefined = component.action;\n\n const dispatchRichTextAction = (): void => {\n if (!richTextAction || !options.onSubmit) {\n return;\n }\n const eventTypeValue = String(richTextAction.eventType ?? EmbeddedFlowEventType.Submit);\n const shouldSkipValidation: boolean = eventTypeValue.toUpperCase() === String(EmbeddedFlowEventType.Trigger);\n const syntheticAction: EmbeddedFlowComponent = {\n eventType: eventTypeValue,\n id: `${component.id}_action`,\n ref: richTextAction.ref,\n type: EmbeddedFlowComponentType.Action,\n };\n const formData: Record<string, string> = {};\n Object.keys(formValues).forEach((field: string) => {\n formData[field] = formValues[field];\n });\n options.onSubmit(syntheticAction, formData, shouldSkipValidation);\n };\n\n // Sentinel-anchor contract: only anchors carrying `data-action-ref` equal to\n // richTextAction.ref dispatch the action. Anchors without the sentinel (or with\n // a non-matching one) are treated as ordinary links and are ignored here.\n const isMatchingSentinelAnchor = (anchor: HTMLAnchorElement): boolean =>\n anchor.getAttribute('data-action-ref') === richTextAction?.ref;\n\n const handleRichTextClick: React.MouseEventHandler<HTMLDivElement> | undefined = richTextAction\n ? (event: React.MouseEvent<HTMLDivElement>): void => {\n const anchor: HTMLAnchorElement | null = (event.target as HTMLElement).closest('a');\n if (!anchor || !isMatchingSentinelAnchor(anchor)) {\n return;\n }\n event.preventDefault();\n dispatchRichTextAction();\n }\n : undefined;\n\n const handleRichTextKeyDown: React.KeyboardEventHandler<HTMLDivElement> | undefined = richTextAction\n ? (event: React.KeyboardEvent<HTMLDivElement>): void => {\n if (event.key !== 'Enter' && event.key !== ' ') {\n return;\n }\n const anchor: HTMLAnchorElement | null = (event.target as HTMLElement).closest('a');\n if (!anchor || !isMatchingSentinelAnchor(anchor)) {\n return;\n }\n event.preventDefault();\n dispatchRichTextAction();\n }\n : undefined;\n\n return (\n // Sentinel anchors are made keyboard-operable via the container's onKeyDown\n // (Enter/Space activate the matching anchor). Authors should ensure the anchor\n // is focusable (`href` or `tabIndex`); the click+keydown delegation covers both\n // pointer and keyboard activation once focus lands on the anchor.\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n key={key}\n className={getRichTextClass()}\n onClick={handleRichTextClick}\n onKeyDown={handleRichTextKeyDown}\n // Manually sanitizes with `DOMPurify`.\n // IMPORTANT: DO NOT REMOVE OR MODIFY THIS SANITIZATION STEP.\n dangerouslySetInnerHTML={{__html: DOMPurify.sanitize(resolveEmojiUrisInHtml(resolve(component.label)))}}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Image: {\n const explicitHeight: string = resolve(component.height?.toString());\n const explicitWidth: string = resolve(component.width?.toString());\n return (\n <ImageComponent\n key={key}\n component={\n {\n config: {\n alt: resolve(component.alt) || resolve(component.label) || 'Image',\n height: explicitHeight || (options.inStack ? '50' : 'auto'),\n src: resolve(component.src),\n width: explicitWidth || (options.inStack ? '50' : '100%'),\n },\n } as any\n }\n formErrors={undefined!}\n formValues={undefined!}\n isFormValid={false}\n isLoading={false}\n onInputChange={(): void => {\n throw new Error('Function not implemented.');\n }}\n touchedFields={undefined!}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Icon: {\n const iconName: string = component.name || '';\n const IconComponent: any = flowIconRegistry[iconName];\n if (!IconComponent) {\n logger.warn(`Unknown icon name: \"${iconName}\". Skipping render.`);\n return null;\n }\n return <IconComponent key={key} size={component.size || 24} color={component.color || 'currentColor'} />;\n }\n\n case EmbeddedFlowComponentType.Stack: {\n const direction: string = (component as any).direction || 'row';\n const gap: number = (component as any).gap ?? 2;\n const align: string = (component as any).align || 'center';\n const justify: string = (component as any).justify || 'flex-start';\n\n // `items` is the number of slots across the main axis and `direction` picks\n // that axis: with `row` it is the column count (items: 2 with four buttons\n // renders a 2 x 2 grid), and with `column` it is the row count and children\n // flow into further columns. Fewer than two slots keeps the flex layout, so\n // stacks authored before grid support are unaffected.\n const rawItems: string | number | undefined = component.items;\n const parsedItems: number =\n typeof rawItems === 'string' ? Number(rawItems) : typeof rawItems === 'number' ? rawItems : NaN;\n const items: number | null =\n Number.isFinite(parsedItems) && Math.floor(parsedItems) >= 2\n ? Math.min(Math.floor(parsedItems), MAX_STACK_ITEMS)\n : null;\n // CSS Grid has no reverse auto-flow, so the reverse variants fall back to\n // their base axis rather than silently becoming a row.\n const isColumn: boolean = direction.startsWith('column');\n const gridJustify: string = component.justify ?? 'stretch';\n // Equal `1fr` tracks fill the container, leaving `justify-content` no free\n // space to distribute. Content-sized tracks restore it, so every justify\n // value has a visible effect while the default stays an even split.\n const track: string = gridJustify === 'stretch' ? '1fr' : 'auto';\n\n const stackStyle: CSSProperties =\n items !== null\n ? {\n alignItems: component.align ?? 'stretch',\n display: 'grid',\n gap: `${gap * 0.5}rem`,\n gridAutoFlow: isColumn ? 'column' : 'row',\n justifyContent: gridJustify,\n width: '100%',\n ...(isColumn\n ? {gridTemplateRows: `repeat(${items}, ${track})`}\n : {gridTemplateColumns: `repeat(${items}, ${track})`}),\n }\n : {\n alignItems: align,\n display: 'flex',\n flexDirection: direction as CSSProperties['flexDirection'],\n flexWrap: 'wrap',\n gap: `${gap * 0.5}rem`,\n justifyContent: justify,\n };\n\n const stackClass: string = css(stackStyle as CSSInterpolation);\n\n const stackChildren: (ReactElement | null)[] = component.components\n ? component.components.map((childComponent: any, index: number) =>\n createAuthComponentFromFlow(\n childComponent,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n authType,\n {\n ...options,\n inStack: true,\n key: childComponent.id || `${component.id}_${index}`,\n },\n ),\n )\n : [];\n\n return (\n <div key={key} id={component.id} className={cx(component.classes, stackClass)}>\n {stackChildren}\n </div>\n );\n }\n\n case EmbeddedFlowComponentType.Consent: {\n const consentPromptRawData: ConsentPromptData | string | undefined = options.additionalData?.['consentPrompt'];\n\n return (\n <Consent\n key={key}\n consentData={consentPromptRawData as any}\n formValues={formValues}\n onInputChange={onInputChange}\n t={options.t}\n />\n );\n }\n\n case EmbeddedFlowComponentType.Timer: {\n const textTemplate: string = resolve((component as any).label) || 'Time remaining: {time}';\n const timeoutMs: number = Number(options.additionalData?.['stepTimeout']) || 0;\n const expiresIn: number = timeoutMs > 0 ? Math.max(0, Math.floor((timeoutMs - Date.now()) / 1000)) : 0;\n\n return <FlowTimer key={key} expiresIn={expiresIn} textTemplate={textTemplate} />;\n }\n\n case EmbeddedFlowComponentType.CopyableText: {\n const sourceKey: string | undefined = (component as any).source;\n const value: string = sourceKey && options.additionalData ? String(options.additionalData[sourceKey] ?? '') : '';\n const labelText: string | undefined = resolve((component as any).label) || undefined;\n\n return <CopyableText key={key} label={labelText} masked={Boolean(component.masked)} value={value} />;\n }\n\n case EmbeddedFlowComponentType.KeyValueList: {\n const sourceKey: string | undefined = component.source;\n const pairs: KeyValuePair[] = parseKeyValuePairs(\n sourceKey && options.additionalData ? options.additionalData[sourceKey] : undefined,\n ).map((pair: KeyValuePair) => ({...pair, label: resolve(pair.label)}));\n\n // An empty panel tells the user nothing, so a list with no pairs renders nothing at all.\n if (pairs.length === 0) {\n return null;\n }\n\n return <KeyValueList key={key} label={resolve(component.label) || undefined} pairs={pairs} />;\n }\n\n default:\n // Gracefully handle unsupported component types by returning null\n logger.warn(`Unsupported component type: ${component.type}. Skipping render.`);\n return null;\n }\n};\n\n/**\n * Processes an array of components and renders them as React elements for sign-in.\n */\nexport const renderSignInComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /** @internal */\n _customRenderers?: ComponentRendererMap;\n /** @internal */\n _theme?: any;\n /** Additional data from the flow response */\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /** Flag to determine if the step timeline has expired */\n isTimeoutDisabled?: boolean;\n /** Flow metadata for resolving {{meta(...)}} expressions at render time */\n meta?: FlowMetadataResponse | null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' | 'medium' | 'large';\n /** Translation function for resolving {{t(...)}} expressions at render time */\n t?: UseTranslation['t'];\n variant?: any;\n /** Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signin',\n {\n ...options,\n key: component.id || index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/**\n * Processes an array of components and renders them as React elements for sign-up.\n */\nexport const renderSignUpComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /** @internal */\n _customRenderers?: ComponentRendererMap;\n /** @internal */\n _theme?: any;\n /** Additional data from the flow response */\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /** Flow metadata for resolving {{meta(...)}} expressions at render time */\n meta?: FlowMetadataResponse | null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' | 'medium' | 'large';\n /** Translation function for resolving {{t(...)}} expressions at render time */\n t?: UseTranslation['t'];\n variant?: any;\n /** Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signup',\n {\n ...options,\n key: component.id || index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/**\n * Processes an array of components and renders them as React elements for recovery flow.\n */\nexport const renderRecoveryComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /** @internal */\n _customRenderers?: ComponentRendererMap;\n /** @internal */\n _theme?: any;\n /** Additional data from the flow response */\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n inputClassName?: string;\n /** Flag to determine if the step timeline has expired */\n isTimeoutDisabled?: boolean;\n /** Flow metadata for resolving {{meta(...)}} expressions at render time */\n meta?: FlowMetadataResponse | null;\n onInputBlur?: (name: string) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' | 'medium' | 'large';\n /** Translation function for resolving {{t(...)}} expressions at render time */\n t?: UseTranslation['t'];\n variant?: any;\n /** Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'recovery',\n {\n ...options,\n key: component.id || index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n\n/**\n * Processes an array of components and renders them as React elements for invite user.\n * This is used by both InviteUser and AcceptInvite components.\n */\nexport const renderInviteUserComponents = (\n components: EmbeddedFlowComponent[],\n formValues: Record<string, string>,\n touchedFields: Record<string, boolean>,\n formErrors: Record<string, string>,\n isLoading: boolean,\n isFormValid: boolean,\n resetForm: () => void,\n onInputChange: (name: string, value: string) => void,\n options?: {\n /** @internal */\n _customRenderers?: ComponentRendererMap;\n /** @internal */\n _theme?: any;\n /** Additional data from the flow response */\n additionalData?: Record<string, any>;\n buttonClassName?: string;\n /** Function to fetch child organization units for OU_SELECT components. */\n fetchOrganizationUnitChildren?: (\n parentId: string,\n limit: number,\n offset: number,\n ) => Promise<OrganizationUnitListResponse>;\n inputClassName?: string;\n /** Data source for AUTH_FLOW_SELECT fields. */\n fetchAuthFlows?: FetchAuthFlows;\n /** Data source for USER_SELECT fields. */\n fetchUsers?: FetchUsers;\n /** Data source for USER_TYPE_SELECT fields. */\n fetchUserTypes?: FetchUserTypes;\n /** Flow metadata for resolving {{meta(...)}} expressions at render time */\n meta?: FlowMetadataResponse | null;\n onInputBlur?: (name: string) => void;\n /** Called with the error of a failed picker load. The form itself shows no error for it. */\n onPickerError?: (error: Error) => void;\n onSubmit?: (component: EmbeddedFlowComponent, data?: Record<string, any>, skipValidation?: boolean) => void;\n size?: 'small' | 'medium' | 'large';\n /** Translation function for resolving {{t(...)}} expressions at render time */\n t?: UseTranslation['t'];\n variant?: any;\n /** Vendor namespace used to derive affix sentinel keys for prefix/postfix-bearing inputs. */\n vendor?: string;\n },\n): ReactElement[] =>\n components\n .map((component: any, index: any) =>\n createAuthComponentFromFlow(\n component,\n formValues,\n touchedFields,\n formErrors,\n isLoading,\n isFormValid,\n resetForm,\n onInputChange,\n 'signup',\n {\n ...options,\n key: component.id || index,\n },\n ),\n )\n .filter((x): x is ReactElement => x !== null);\n"],"mappings":"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"}

package/dist/components/auth/flow/Consent.d.ts ADDED Viewed

@@ -0,0 +1,68 @@
+import { type ConsentPurposeData } from '@thunderid/browser';
+import { FC, ReactNode } from 'react';
+import { UseTranslation } from '../../../hooks/useTranslation';
+/**
+ * Backward-compatible consent purpose type exported by @thunderid/react.
+ *
+ * Some consumers import this name directly; keep it as an alias to the v2 model.
+ */
+export type ConsentPurpose = ConsentPurposeData;
+/**
+ * Render props exposed by Consent when using the render-prop pattern.
+ */
+export interface ConsentRenderProps {
+    /** Current form values - used to read optional checkbox state. */
+    formValues: Record<string, string>;
+    /** Callback invoked when a user toggles an optional attribute. */
+    onInputChange: (name: string, value: string) => void;
+    /** The resolved list of consent purposes parsed from `consentData`. */
+    purposes: ConsentPurposeData[];
+}
+/**
+ * Props for the Consent component.
+ */
+export interface ConsentProps {
+    /**
+     * Render-props callback. When provided, the default consent UI is replaced with
+     * whatever JSX the callback returns. The parsed `purposes` list is injected so
+     * consumers do not need to re-parse `consentData` themselves.
+     *
+     * @example
+     * ```tsx
+     * <Consent consentData={raw} formValues={formInputs} onInputChange={onChange} t={t}>
+     *   {({ purposes, formValues, onInputChange, t }) => (
+     *     <div>
+     *       {purposes.map(p => <MyConsentSection key={p.purposeId} purpose={p} />)}
+     *     </div>
+     *   )}
+     * </Consent>
+     * ```
+     */
+    children?: (props: ConsentRenderProps) => ReactNode;
+    /**
+     * The raw JSON string returned by the backend in `additionalData.consentPrompt`.
+     */
+    consentData?: string | ConsentPurposeData[] | {
+        purposes: ConsentPurposeData[];
+    };
+    /**
+     * Current form values - used to read optional checkbox state.
+     */
+    formValues: Record<string, string>;
+    /**
+     * Callback invoked when a user toggles an optional attribute.
+     */
+    onInputChange: (name: string, value: string) => void;
+    /**
+     * translation data
+     */
+    t?: UseTranslation['t'];
+}
+/**
+ * Consent component renders the list of purposes and their associated attributes (essential and optional)
+ * based on the data provided by the backend. It allows users to toggle optional attributes while essential
+ * attributes are displayed as read-only.
+ */
+declare const Consent: FC<ConsentProps>;
+export default Consent;
+//# sourceMappingURL=Consent.d.ts.map

package/dist/components/auth/flow/Consent.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Consent.d.ts","sourceRoot":"","sources":["../../../../src/components/auth/flow/Consent.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,KAAK,kBAAkB,EAAgB,MAAM,oBAAoB,CAAC;AAC1E,OAAO,EAAmB,EAAE,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAMtD,OAAO,EAAC,cAAc,EAAC,MAAM,+BAA+B,CAAC;AAG7D;;;;GAIG;AACH,MAAM,MAAM,cAAc,GAAG,kBAAkB,CAAC;AAEhD;;GAEG;AACH,MAAM,WAAW,kBAAkB;IACjC,kEAAkE;IAClE,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,kEAAkE;IAClE,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,uEAAuE;IACvE,QAAQ,EAAE,kBAAkB,EAAE,CAAC;CAChC;AAED;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B;;;;;;;;;;;;;;;OAeG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,SAAS,CAAC;IACpD;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,kBAAkB,EAAE,GAAG;QAAC,QAAQ,EAAE,kBAAkB,EAAE,CAAA;KAAC,CAAC;IAC/E;;OAEG;IACH,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC;;OAEG;IACH,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAErD;;OAEG;IACH,CAAC,CAAC,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;CACzB;AAED;;;;GAIG;AACH,QAAA,MAAM,OAAO,EAAE,EAAE,CAAC,YAAY,CA2J7B,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/dist/components/auth/flow/Consent.js ADDED Viewed

@@ -0,0 +1,156 @@
+import { css } from "../../../styles/emotion.js";
+import Info_default from "../../primitives/Icons/Info.js";
+import Typography_default from "../../primitives/Typography/Typography.js";
+import Toggle_default from "../../primitives/Toggle/Toggle.js";
+import ConsentCheckboxList_default, { getConsentOptionalKey } from "./ConsentCheckboxList.js";
+import Tooltip_default from "../../primitives/Tooltip/Tooltip.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/auth/flow/Consent.tsx
+/**
+* Consent component renders the list of purposes and their associated attributes (essential and optional)
+* based on the data provided by the backend. It allows users to toggle optional attributes while essential
+* attributes are displayed as read-only.
+*/
+const Consent = ({ consentData, formValues, onInputChange, children, t }) => {
+	const purposesContainerClass = css({
+		display: "flex",
+		flexDirection: "column",
+		gap: "1rem",
+		marginTop: "0.25rem"
+	});
+	const purposeItemClass = css({ paddingBottom: "1rem" });
+	const sectionClass = css({ marginTop: "0.5rem" });
+	const sectionHeaderClass = css({
+		alignItems: "center",
+		display: "flex",
+		gap: "4px",
+		marginBottom: "10px"
+	});
+	const optionalSectionHeaderClass = css({
+		alignItems: "center",
+		display: "flex",
+		justifyContent: "space-between",
+		marginBottom: "10px",
+		paddingRight: "4px"
+	});
+	const optionalSectionLabelClass = css({
+		alignItems: "center",
+		display: "flex",
+		gap: "4px"
+	});
+	/** Resolve i18n keys */
+	const resolve = (text) => {
+		if (!text || !t) return text || "";
+		return t(text);
+	};
+	const essentialInfo = resolve(`consent.essential_claims.info`);
+	const optionalInfo = resolve(`consent.optional_claims.info`);
+	const permissionInfo = resolve(`consent.authorize_scope.info`);
+	/**
+	* Falls back to default config values if essential/optional
+	* keys cannot be resolved via translation files .
+	*/
+	const essentialLabel = resolve(`consent.essential_claims`) || "Essential Attributes";
+	const optionalLabel = resolve(`consent.optional_claims`) || "Optional Attributes";
+	const permissionLabel = resolve(`consent.authorize_scope`) || "Permissions";
+	/**
+	* Method to check whether master toggle button is checked or not
+	* @param purpose Purpose object
+	* @param checked boolean variable to check, whether toggle is checked or unchecked
+	*/
+	const handleChange = (purpose, checked) => {
+		const checkValue = checked ? "true" : "false";
+		purpose.optional.map((opt) => {
+			onInputChange(getConsentOptionalKey(purpose.purposeId, opt.name), checkValue);
+		});
+	};
+	/**
+	* Check all optional claims are selected or not
+	* @param purpose Purpose object
+	* @returns boolean value to denote all optional claims are selected
+	*/
+	const checkOptValue = (purpose) => {
+		return purpose.optional.every((opt) => {
+			return formValues[getConsentOptionalKey(purpose.purposeId, opt.name)] === "true";
+		});
+	};
+	if (!consentData) return null;
+	let purposes = [];
+	try {
+		const parsed = typeof consentData === "string" ? JSON.parse(consentData) : consentData;
+		purposes = Array.isArray(parsed) ? parsed : parsed.purposes || [];
+	} catch (e) {
+		return null;
+	}
+	if (purposes.length === 0) return null;
+	if (children) return /* @__PURE__ */ jsx(Fragment, { children: children({
+		formValues,
+		onInputChange,
+		purposes
+	}) });
+	return /* @__PURE__ */ jsx("div", {
+		className: purposesContainerClass,
+		children: purposes.map((purpose, purposeIndex) => /* @__PURE__ */ jsxs("div", {
+			className: purposeItemClass,
+			children: [purpose.essential && purpose.essential.length > 0 && /* @__PURE__ */ jsxs("div", {
+				className: sectionClass,
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: sectionHeaderClass,
+					children: [/* @__PURE__ */ jsx(Typography_default, {
+						variant: "subtitle2",
+						fontWeight: "bold",
+						children: essentialLabel
+					}), essentialInfo !== "" && /* @__PURE__ */ jsx(Tooltip_default, {
+						helperText: essentialInfo,
+						children: /* @__PURE__ */ jsx(Info_default, {
+							width: "1rem",
+							height: "1rem"
+						})
+					})]
+				}), /* @__PURE__ */ jsx(ConsentCheckboxList_default, {
+					variant: "ESSENTIAL",
+					purpose,
+					formValues,
+					onInputChange,
+					t
+				})]
+			}), purpose.optional && purpose.optional.length > 0 && /* @__PURE__ */ jsxs("div", {
+				className: sectionClass,
+				children: [/* @__PURE__ */ jsxs("div", {
+					className: optionalSectionHeaderClass,
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: optionalSectionLabelClass,
+						children: [/* @__PURE__ */ jsx(Typography_default, {
+							variant: "subtitle2",
+							fontWeight: "bold",
+							children: purpose.type === "permissions" ? permissionLabel : optionalLabel
+						}), Boolean(purpose.type === "permissions" ? permissionInfo : optionalInfo) && /* @__PURE__ */ jsx(Tooltip_default, {
+							helperText: purpose.type === "permissions" ? permissionInfo : optionalInfo,
+							children: /* @__PURE__ */ jsx(Info_default, {
+								width: "1rem",
+								height: "1rem"
+							})
+						})]
+					}), /* @__PURE__ */ jsx(Toggle_default, {
+						id: `consent_opt_${purpose.purposeId}_all`,
+						checked: checkOptValue(purpose),
+						"aria-label": "Toggle all optional attributes",
+						onChange: (e) => handleChange(purpose, e.target.checked)
+					})]
+				}), /* @__PURE__ */ jsx(ConsentCheckboxList_default, {
+					variant: "OPTIONAL",
+					purpose,
+					formValues,
+					onInputChange,
+					t
+				})]
+			})]
+		}, purpose.purposeId || purposeIndex))
+	});
+};
+var Consent_default = Consent;
+//#endregion
+export { Consent_default as default };
+//# sourceMappingURL=Consent.js.map

package/dist/components/auth/flow/Consent.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Consent.js","names":["Consent: FC<ConsentProps>","purposesContainerClass: string","purposeItemClass: string","sectionClass: string","sectionHeaderClass: string","optionalSectionHeaderClass: string","optionalSectionLabelClass: string","purposes: ConsentPurposeData[]","parsed: ConsentPurposeData[] | {purposes: ConsentPurposeData[]}","Typography","Tooltip","Info","ConsentCheckboxList","Toggle"],"sources":["../../../../src/components/auth/flow/Consent.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {type ConsentPurposeData, PromptElement} from '@thunderid/browser';\nimport {type ChangeEvent, FC, ReactNode} from 'react';\nimport ConsentCheckboxList, {getConsentOptionalKey} from './ConsentCheckboxList';\nimport Typography from '../../primitives/Typography/Typography';\nimport Toggle from '../../primitives/Toggle/Toggle';\nimport {Info} from '../../primitives/Icons';\nimport Tooltip from '../../primitives/Tooltip/Tooltip';\nimport {UseTranslation} from '../../../hooks/useTranslation';\nimport {css} from '../../../styles/emotion';\n\n/**\n * Backward-compatible consent purpose type exported by @thunderid/react.\n *\n * Some consumers import this name directly; keep it as an alias to the v2 model.\n */\nexport type ConsentPurpose = ConsentPurposeData;\n\n/**\n * Render props exposed by Consent when using the render-prop pattern.\n */\nexport interface ConsentRenderProps {\n /** Current form values - used to read optional checkbox state. */\n formValues: Record<string, string>;\n /** Callback invoked when a user toggles an optional attribute. */\n onInputChange: (name: string, value: string) => void;\n /** The resolved list of consent purposes parsed from `consentData`. */\n purposes: ConsentPurposeData[];\n}\n\n/**\n * Props for the Consent component.\n */\nexport interface ConsentProps {\n /**\n * Render-props callback. When provided, the default consent UI is replaced with\n * whatever JSX the callback returns. The parsed `purposes` list is injected so\n * consumers do not need to re-parse `consentData` themselves.\n *\n * @example\n * ```tsx\n * <Consent consentData={raw} formValues={formInputs} onInputChange={onChange} t={t}>\n * {({ purposes, formValues, onInputChange, t }) => (\n * <div>\n * {purposes.map(p => <MyConsentSection key={p.purposeId} purpose={p} />)}\n * </div>\n * )}\n * </Consent>\n * ```\n */\n children?: (props: ConsentRenderProps) => ReactNode;\n /**\n * The raw JSON string returned by the backend in `additionalData.consentPrompt`.\n */\n consentData?: string | ConsentPurposeData[] | {purposes: ConsentPurposeData[]};\n /**\n * Current form values - used to read optional checkbox state.\n */\n formValues: Record<string, string>;\n /**\n * Callback invoked when a user toggles an optional attribute.\n */\n onInputChange: (name: string, value: string) => void;\n\n /**\n * translation data\n */\n t?: UseTranslation['t'];\n}\n\n/**\n * Consent component renders the list of purposes and their associated attributes (essential and optional)\n * based on the data provided by the backend. It allows users to toggle optional attributes while essential\n * attributes are displayed as read-only.\n */\nconst Consent: FC<ConsentProps> = ({consentData, formValues, onInputChange, children, t}: ConsentProps) => {\n // Computed per render (not at module scope): a CSP nonce configured on <ThunderIDProvider>\n // isn't known until the provider renders, and Emotion needs it applied before any style\n // insertion happens. These are static, so Emotion's own cache dedupes the repeat calls to a\n // no-op after the first render — this isn't a real per-render cost.\n const purposesContainerClass: string = css({\n display: 'flex',\n flexDirection: 'column',\n gap: '1rem',\n marginTop: '0.25rem',\n });\n const purposeItemClass: string = css({paddingBottom: '1rem'});\n const sectionClass: string = css({marginTop: '0.5rem'});\n const sectionHeaderClass: string = css({alignItems: 'center', display: 'flex', gap: '4px', marginBottom: '10px'});\n const optionalSectionHeaderClass: string = css({\n alignItems: 'center',\n display: 'flex',\n justifyContent: 'space-between',\n marginBottom: '10px',\n paddingRight: '4px',\n });\n const optionalSectionLabelClass: string = css({alignItems: 'center', display: 'flex', gap: '4px'});\n\n /** Resolve i18n keys */\n const resolve = (text: string | undefined): string => {\n if (!text || !t) {\n return text || '';\n }\n return t(text);\n };\n\n const essentialInfo = resolve(`consent.essential_claims.info`);\n const optionalInfo = resolve(`consent.optional_claims.info`);\n const permissionInfo = resolve(`consent.authorize_scope.info`);\n /**\n * Falls back to default config values if essential/optional\n * keys cannot be resolved via translation files .\n */\n const essentialLabel = resolve(`consent.essential_claims`) || 'Essential Attributes';\n const optionalLabel = resolve(`consent.optional_claims`) || 'Optional Attributes';\n const permissionLabel = resolve(`consent.authorize_scope`) || 'Permissions';\n\n /**\n * Method to check whether master toggle button is checked or not\n * @param purpose Purpose object\n * @param checked boolean variable to check, whether toggle is checked or unchecked\n */\n const handleChange = (purpose: ConsentPurposeData, checked: boolean): void => {\n const checkValue = checked ? 'true' : 'false';\n purpose.optional.map((opt: PromptElement) => {\n const key: string = getConsentOptionalKey(purpose.purposeId, opt.name);\n onInputChange(key, checkValue);\n });\n };\n\n /**\n * Check all optional claims are selected or not\n * @param purpose Purpose object\n * @returns boolean value to denote all optional claims are selected\n */\n const checkOptValue = (purpose: ConsentPurposeData): boolean => {\n return purpose.optional.every((opt: PromptElement) => {\n const key: string = getConsentOptionalKey(purpose.purposeId, opt.name);\n return formValues[key] === 'true';\n });\n };\n\n if (!consentData) return null;\n\n let purposes: ConsentPurposeData[] = [];\n\n try {\n const parsed: ConsentPurposeData[] | {purposes: ConsentPurposeData[]} =\n typeof consentData === 'string' ? JSON.parse(consentData) : consentData;\n\n purposes = Array.isArray(parsed) ? parsed : parsed.purposes || [];\n } catch (e) {\n // Failed to parse consent prompt data\n return null;\n }\n\n if (purposes.length === 0) return null;\n\n if (children) {\n return <>{children({formValues, onInputChange, purposes: purposes})}</>;\n }\n\n return (\n <div className={purposesContainerClass}>\n {purposes.map((purpose: ConsentPurposeData, purposeIndex: number) => (\n <div key={purpose.purposeId || purposeIndex} className={purposeItemClass}>\n {/* TODO: Uncomment when the backend supports multiple purposes for a application */}\n {/* <Typography variant=\"h6\" fontWeight={600} gutterBottom color=\"inherit\">\n {purpose.purposeName}\n </Typography>\n <Typography variant=\"body2\" color=\"inherit\" style={{marginBottom: '1rem', opacity: 0.85}}>\n {purpose.description}\n </Typography> */}\n\n {purpose.essential && purpose.essential.length > 0 && (\n <div className={sectionClass}>\n <div className={sectionHeaderClass}>\n <Typography variant=\"subtitle2\" fontWeight=\"bold\">\n {essentialLabel}\n </Typography>\n {essentialInfo !== '' && (\n <Tooltip helperText={essentialInfo}>\n <Info width=\"1rem\" height=\"1rem\" />\n </Tooltip>\n )}\n </div>\n <ConsentCheckboxList\n variant=\"ESSENTIAL\"\n purpose={purpose}\n formValues={formValues}\n onInputChange={onInputChange}\n t={t}\n />\n </div>\n )}\n\n {purpose.optional && purpose.optional.length > 0 && (\n <div className={sectionClass}>\n <div className={optionalSectionHeaderClass}>\n <div className={optionalSectionLabelClass}>\n <Typography variant=\"subtitle2\" fontWeight=\"bold\">\n {purpose.type === 'permissions' ? permissionLabel : optionalLabel}\n </Typography>\n {/* Show tooltip for optional claims/permissions according to their type */}\n {Boolean(purpose.type === 'permissions' ? permissionInfo : optionalInfo) && (\n <Tooltip helperText={purpose.type === 'permissions' ? permissionInfo : optionalInfo}>\n <Info width=\"1rem\" height=\"1rem\" />\n </Tooltip>\n )}\n </div>\n <Toggle\n id={`consent_opt_${purpose.purposeId}_all`}\n checked={checkOptValue(purpose)}\n aria-label=\"Toggle all optional attributes\"\n onChange={(e: ChangeEvent<HTMLInputElement>): void => handleChange(purpose, e.target.checked)}\n />\n </div>\n <ConsentCheckboxList\n variant=\"OPTIONAL\"\n purpose={purpose}\n formValues={formValues}\n onInputChange={onInputChange}\n t={t}\n />\n </div>\n )}\n </div>\n ))}\n </div>\n );\n};\n\nexport default Consent;\n"],"mappings":"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"}

package/dist/components/auth/flow/ConsentCheckboxList.d.ts ADDED Viewed

@@ -0,0 +1,83 @@
+import { type ConsentPurposeData } from '@thunderid/browser';
+import { FC, ReactNode } from 'react';
+import { UseTranslation } from '../../../hooks/useTranslation';
+/**
+ * Computes the form value key for tracking an optional attribute's consent state.
+ *
+ * @param purposeId - The ID of the consent purpose.
+ * @param attrName - The name of the attribute.
+ * @returns A stable form key string.
+ */
+export declare const getConsentOptionalKey: (purposeId: string, attrName: string) => string;
+/**
+ * ConsentInputVariant defines whether the ConsentCheckboxList is rendering essential (read-only) or
+ * optional (toggleable) attributes.
+ */
+export type ConsentInputVariant = 'ESSENTIAL' | 'OPTIONAL';
+/**
+ * Render props exposed by ConsentCheckboxList when using the render-prop pattern.
+ */
+export interface ConsentCheckboxListRenderProps {
+    /** The list of attribute names to render. */
+    attributes: string[];
+    /**
+     * Call this when an optional attribute checkbox is toggled.
+     * No-op for ESSENTIAL attributes (they cannot be changed).
+     */
+    handleChange: (attrName: string, checked: boolean) => void;
+    /**
+     * Returns the current checked state for the given attribute name.
+     * Always returns true for ESSENTIAL attributes.
+     */
+    isChecked: (attrName: string) => boolean;
+    /** Whether the list is rendering essential or optional attributes. */
+    variant: ConsentInputVariant;
+}
+/**
+ * Props for the ConsentCheckboxList component.
+ */
+export interface ConsentCheckboxListProps {
+    /**
+     * Render-props callback. When provided, the default checkbox list UI is replaced
+     * with whatever JSX the callback returns.
+     *
+     * @example
+     * ```tsx
+     * <ConsentCheckboxList variant="OPTIONAL" purpose={purpose} formValues={formValues} onInputChange={onChange}>
+     *   {({ attributes, isChecked, handleChange }) => (
+     *     <ul>
+     *       {attributes.map(attr => (
+     *         <li key={attr}>
+     *           <Checkbox checked={isChecked(attr)} onChange={e => handleChange(attr, e.target.checked)} />
+     *           {attr}
+     *         </li>
+     *       ))}
+     *     </ul>
+     *   )}
+     * </ConsentCheckboxList>
+     * ```
+     */
+    children?: (props: ConsentCheckboxListRenderProps) => ReactNode;
+    /** Current form values - used to read optional checkbox state */
+    formValues: Record<string, string>;
+    /** Callback invoked when an optional attribute checkbox is toggled */
+    onInputChange: (name: string, value: string) => void;
+    /** The consent purpose data containing attribute lists */
+    purpose: ConsentPurposeData;
+    /** Whether to render essential (disabled) or optional (toggleable) attributes */
+    variant: ConsentInputVariant;
+    /**
+     * translation data
+     */
+    t?: UseTranslation['t'];
+}
+/**
+ * Renders a list of consent attribute checkboxes.
+ *
+ * - ESSENTIAL variant: renders read-only checked checkboxes for required attributes.
+ * - OPTIONAL variant: renders toggleable checkboxes for optional attributes.
+ *   Opt-in is the default when no prior form value exists.
+ */
+declare const ConsentCheckboxList: FC<ConsentCheckboxListProps>;
+export default ConsentCheckboxList;
+//# sourceMappingURL=ConsentCheckboxList.d.ts.map

package/dist/components/auth/flow/ConsentCheckboxList.d.ts.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ConsentCheckboxList.d.ts","sourceRoot":"","sources":["../../../../src/components/auth/flow/ConsentCheckboxList.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAC,KAAK,kBAAkB,EAAgC,MAAM,oBAAoB,CAAC;AAC1F,OAAO,EAAmB,EAAE,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAMtD,OAAO,EAAC,cAAc,EAAC,MAAM,+BAA+B,CAAC;AAE7D;;;;;;GAMG;AACH,eAAO,MAAM,qBAAqB,GAAI,WAAW,MAAM,EAAE,UAAU,MAAM,KAAG,MAChC,CAAC;AAE7C;;;GAGG;AACH,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG,UAAU,CAAC;AAE3D;;GAEG;AACH,MAAM,WAAW,8BAA8B;IAC7C,6CAA6C;IAC7C,UAAU,EAAE,MAAM,EAAE,CAAC;IACrB;;;OAGG;IACH,YAAY,EAAE,CAAC,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3D;;;OAGG;IACH,SAAS,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,OAAO,CAAC;IACzC,sEAAsE;IACtE,OAAO,EAAE,mBAAmB,CAAC;CAC9B;AAED;;GAEG;AACH,MAAM,WAAW,wBAAwB;IACvC;;;;;;;;;;;;;;;;;;;OAmBG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,8BAA8B,KAAK,SAAS,CAAC;IAChE,iEAAiE;IACjE,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC,sEAAsE;IACtE,aAAa,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,0DAA0D;IAC1D,OAAO,EAAE,kBAAkB,CAAC;IAC5B,iFAAiF;IACjF,OAAO,EAAE,mBAAmB,CAAC;IAC7B;;OAEG;IACH,CAAC,CAAC,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC;CACzB;AAED;;;;;;GAMG;AACH,QAAA,MAAM,mBAAmB,EAAE,EAAE,CAAC,wBAAwB,CAoGrD,CAAC;AAEF,eAAe,mBAAmB,CAAC"}

package/dist/components/auth/flow/ConsentCheckboxList.js ADDED Viewed

@@ -0,0 +1,84 @@
+import { cx } from "../../../styles/emotion.js";
+import useTheme_default from "../../../contexts/Theme/useTheme.js";
+import Typography_default from "../../primitives/Typography/Typography.js";
+import ConsentCheckboxList_styles_default from "./ConsentCheckboxList.styles.js";
+import Toggle_default from "../../primitives/Toggle/Toggle.js";
+import { bem, withVendorCSSClassPrefix } from "@thunderid/browser";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/auth/flow/ConsentCheckboxList.tsx
+/**
+* Computes the form value key for tracking an optional attribute's consent state.
+*
+* @param purposeId - The ID of the consent purpose.
+* @param attrName - The name of the attribute.
+* @returns A stable form key string.
+*/
+const getConsentOptionalKey = (purposeId, attrName) => `__consent_opt__${purposeId}__${attrName}`;
+/**
+* Renders a list of consent attribute checkboxes.
+*
+* - ESSENTIAL variant: renders read-only checked checkboxes for required attributes.
+* - OPTIONAL variant: renders toggleable checkboxes for optional attributes.
+*   Opt-in is the default when no prior form value exists.
+*/
+const ConsentCheckboxList = ({ variant, purpose, formValues, onInputChange, children, t }) => {
+	const { theme, colorScheme } = useTheme_default();
+	const styles = ConsentCheckboxList_styles_default(theme, colorScheme);
+	const resolve = (text) => {
+		if (!text || !t) return text || "";
+		const key = `consent.${text}`;
+		const translated = t(key);
+		return translated === key ? text : translated;
+	};
+	const attributes = (variant === "ESSENTIAL" ? purpose.essential : purpose.optional).map((e) => e.name);
+	if (!attributes || attributes.length === 0) return null;
+	const isEssential = variant === "ESSENTIAL";
+	const isChecked = (attrName) => {
+		if (isEssential) return true;
+		return formValues[getConsentOptionalKey(purpose.purposeId, attrName)] === "true";
+	};
+	const handleChange = (attrName, checked) => {
+		onInputChange(getConsentOptionalKey(purpose.purposeId, attrName), checked ? "true" : "false");
+	};
+	if (children) return /* @__PURE__ */ jsx(Fragment, { children: children({
+		attributes,
+		handleChange,
+		isChecked,
+		variant
+	}) });
+	return /* @__PURE__ */ jsx("div", {
+		className: cx(withVendorCSSClassPrefix(bem("consent-checkbox-list")), styles["listContainer"]),
+		children: attributes.map((attr) => {
+			const inputId = `consent_${isEssential ? "ess" : "opt"}_${purpose.purposeId}_${attr}`;
+			const checked = isChecked(attr);
+			return /* @__PURE__ */ jsx("div", {
+				className: cx(withVendorCSSClassPrefix(bem("consent-checkbox-list", "item")), styles["listItem"]),
+				children: /* @__PURE__ */ jsxs("div", {
+					className: cx(withVendorCSSClassPrefix(bem("consent-checkbox-list", "row")), styles["listRow"]),
+					children: [/* @__PURE__ */ jsxs("div", {
+						className: cx(withVendorCSSClassPrefix(bem("consent-checkbox-list", "label-container")), styles["labelContainer"]),
+						children: [/* @__PURE__ */ jsx("div", { className: cx(withVendorCSSClassPrefix(bem("consent-checkbox-list", "bullet")), styles["bullet"]) }), /* @__PURE__ */ jsx(Typography_default, {
+							variant: "body2",
+							className: cx(withVendorCSSClassPrefix(bem("consent-checkbox-list", "typography")), styles["typography"]),
+							children: resolve(attr)
+						})]
+					}), isEssential ? /* @__PURE__ */ jsx(Typography_default, {
+						variant: "body2",
+						children: resolve("required") || "Required"
+					}) : /* @__PURE__ */ jsx(Toggle_default, {
+						id: inputId,
+						checked,
+						disabled: isEssential,
+						onChange: isEssential ? void 0 : (e) => handleChange(attr, e.target.checked)
+					})]
+				})
+			}, attr);
+		})
+	});
+};
+var ConsentCheckboxList_default = ConsentCheckboxList;
+//#endregion
+export { ConsentCheckboxList_default as default, getConsentOptionalKey };
+//# sourceMappingURL=ConsentCheckboxList.js.map

package/dist/components/auth/flow/ConsentCheckboxList.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"ConsentCheckboxList.js","names":["ConsentCheckboxList: FC<ConsentCheckboxListProps>","useTheme","styles: Record<string, string>","useStyles","key: string","translated: string","attributes: string[]","isEssential: boolean","checked: boolean","Typography","Toggle"],"sources":["../../../../src/components/auth/flow/ConsentCheckboxList.tsx"],"sourcesContent":["// Copyright 2026 The ThunderID Authors\n// SPDX-License-Identifier: Apache-2.0\n\nimport {type ConsentPurposeData, withVendorCSSClassPrefix, bem} from '@thunderid/browser';\nimport {type ChangeEvent, FC, ReactNode} from 'react';\nimport useStyles from './ConsentCheckboxList.styles';\nimport useTheme from '../../../contexts/Theme/useTheme';\nimport {cx} from '../../../styles/emotion';\nimport Toggle from '../../primitives/Toggle/Toggle';\nimport Typography from '../../primitives/Typography/Typography';\nimport {UseTranslation} from '../../../hooks/useTranslation';\n\n/**\n * Computes the form value key for tracking an optional attribute's consent state.\n *\n * @param purposeId - The ID of the consent purpose.\n * @param attrName - The name of the attribute.\n * @returns A stable form key string.\n */\nexport const getConsentOptionalKey = (purposeId: string, attrName: string): string =>\n `__consent_opt__${purposeId}__${attrName}`;\n\n/**\n * ConsentInputVariant defines whether the ConsentCheckboxList is rendering essential (read-only) or\n * optional (toggleable) attributes.\n */\nexport type ConsentInputVariant = 'ESSENTIAL' | 'OPTIONAL';\n\n/**\n * Render props exposed by ConsentCheckboxList when using the render-prop pattern.\n */\nexport interface ConsentCheckboxListRenderProps {\n /** The list of attribute names to render. */\n attributes: string[];\n /**\n * Call this when an optional attribute checkbox is toggled.\n * No-op for ESSENTIAL attributes (they cannot be changed).\n */\n handleChange: (attrName: string, checked: boolean) => void;\n /**\n * Returns the current checked state for the given attribute name.\n * Always returns true for ESSENTIAL attributes.\n */\n isChecked: (attrName: string) => boolean;\n /** Whether the list is rendering essential or optional attributes. */\n variant: ConsentInputVariant;\n}\n\n/**\n * Props for the ConsentCheckboxList component.\n */\nexport interface ConsentCheckboxListProps {\n /**\n * Render-props callback. When provided, the default checkbox list UI is replaced\n * with whatever JSX the callback returns.\n *\n * @example\n * ```tsx\n * <ConsentCheckboxList variant=\"OPTIONAL\" purpose={purpose} formValues={formValues} onInputChange={onChange}>\n * {({ attributes, isChecked, handleChange }) => (\n * <ul>\n * {attributes.map(attr => (\n * <li key={attr}>\n * <Checkbox checked={isChecked(attr)} onChange={e => handleChange(attr, e.target.checked)} />\n * {attr}\n * </li>\n * ))}\n * </ul>\n * )}\n * </ConsentCheckboxList>\n * ```\n */\n children?: (props: ConsentCheckboxListRenderProps) => ReactNode;\n /** Current form values - used to read optional checkbox state */\n formValues: Record<string, string>;\n /** Callback invoked when an optional attribute checkbox is toggled */\n onInputChange: (name: string, value: string) => void;\n /** The consent purpose data containing attribute lists */\n purpose: ConsentPurposeData;\n /** Whether to render essential (disabled) or optional (toggleable) attributes */\n variant: ConsentInputVariant;\n /**\n * translation data\n */\n t?: UseTranslation['t'];\n}\n\n/**\n * Renders a list of consent attribute checkboxes.\n *\n * - ESSENTIAL variant: renders read-only checked checkboxes for required attributes.\n * - OPTIONAL variant: renders toggleable checkboxes for optional attributes.\n * Opt-in is the default when no prior form value exists.\n */\nconst ConsentCheckboxList: FC<ConsentCheckboxListProps> = ({\n variant,\n purpose,\n formValues,\n onInputChange,\n children,\n t,\n}: ConsentCheckboxListProps) => {\n const {theme, colorScheme}: ReturnType<typeof useTheme> = useTheme();\n const styles: Record<string, string> = useStyles(theme, colorScheme);\n\n const resolve = (text: string | undefined): string => {\n if (!text || !t) {\n return text || '';\n }\n\n const key: string = `consent.${text}`;\n const translated: string = t(key);\n return translated === key ? text : translated;\n };\n\n const attributes: string[] = (variant === 'ESSENTIAL' ? purpose.essential : purpose.optional).map(\n (e): string => e.name,\n );\n\n if (!attributes || attributes.length === 0) {\n return null;\n }\n\n const isEssential: boolean = variant === 'ESSENTIAL';\n\n const isChecked = (attrName: string): boolean => {\n if (isEssential) {\n return true;\n }\n const key: string = getConsentOptionalKey(purpose.purposeId, attrName);\n // Default to be false when there's no explicit form value\n return formValues[key] === 'true';\n };\n\n const handleChange = (attrName: string, checked: boolean): void => {\n const key: string = getConsentOptionalKey(purpose.purposeId, attrName);\n onInputChange(key, checked ? 'true' : 'false');\n };\n\n if (children) {\n return <>{children({attributes, handleChange, isChecked, variant})}</>;\n }\n\n return (\n <div className={cx(withVendorCSSClassPrefix(bem('consent-checkbox-list')), styles['listContainer'])}>\n {attributes.map((attr: string) => {\n const inputId = `consent_${isEssential ? 'ess' : 'opt'}_${purpose.purposeId}_${attr}`;\n const checked: boolean = isChecked(attr);\n\n return (\n <div\n key={attr}\n className={cx(withVendorCSSClassPrefix(bem('consent-checkbox-list', 'item')), styles['listItem'])}\n >\n <div className={cx(withVendorCSSClassPrefix(bem('consent-checkbox-list', 'row')), styles['listRow'])}>\n <div\n className={cx(\n withVendorCSSClassPrefix(bem('consent-checkbox-list', 'label-container')),\n styles['labelContainer'],\n )}\n >\n <div\n className={cx(withVendorCSSClassPrefix(bem('consent-checkbox-list', 'bullet')), styles['bullet'])}\n />\n <Typography\n variant=\"body2\"\n className={cx(\n withVendorCSSClassPrefix(bem('consent-checkbox-list', 'typography')),\n styles['typography'],\n )}\n >\n {resolve(attr)}\n </Typography>\n </div>\n {isEssential ? (\n <Typography variant=\"body2\">{resolve('required') || 'Required'}</Typography>\n ) : (\n <Toggle\n id={inputId}\n checked={checked}\n disabled={isEssential}\n onChange={\n isEssential\n ? undefined\n : (e: ChangeEvent<HTMLInputElement>): void => handleChange(attr, e.target.checked)\n }\n />\n )}\n </div>\n </div>\n );\n })}\n </div>\n );\n};\n\nexport default ConsentCheckboxList;\n"],"mappings":";;;;;;;;;;;;;;;;AAmBA,MAAa,yBAAyB,WAAmB,aACvD,kBAAkB,UAAU,IAAI;;;;;;;;AA0ElC,MAAMA,uBAAqD,EACzD,SACA,SACA,YACA,eACA,UACA,QAC8B;CAC9B,MAAM,EAAC,OAAO,gBAA4CC,kBAAU;CACpE,MAAMC,SAAiCC,mCAAU,OAAO,YAAY;CAEpE,MAAM,WAAW,SAAqC;AACpD,MAAI,CAAC,QAAQ,CAAC,EACZ,QAAO,QAAQ;EAGjB,MAAMC,MAAc,WAAW;EAC/B,MAAMC,aAAqB,EAAE,IAAI;AACjC,SAAO,eAAe,MAAM,OAAO;;CAGrC,MAAMC,cAAwB,YAAY,cAAc,QAAQ,YAAY,QAAQ,UAAU,KAC3F,MAAc,EAAE,KAClB;AAED,KAAI,CAAC,cAAc,WAAW,WAAW,EACvC,QAAO;CAGT,MAAMC,cAAuB,YAAY;CAEzC,MAAM,aAAa,aAA8B;AAC/C,MAAI,YACF,QAAO;AAIT,SAAO,WAFa,sBAAsB,QAAQ,WAAW,SAAS,MAE3C;;CAG7B,MAAM,gBAAgB,UAAkB,YAA2B;AAEjE,gBADoB,sBAAsB,QAAQ,WAAW,SAAS,EACnD,UAAU,SAAS,QAAQ;;AAGhD,KAAI,SACF,QAAO,0CAAG,SAAS;EAAC;EAAY;EAAc;EAAW;EAAQ,CAAC,GAAI;AAGxE,QACE,oBAAC;EAAI,WAAW,GAAG,yBAAyB,IAAI,wBAAwB,CAAC,EAAE,OAAO,iBAAiB;YAChG,WAAW,KAAK,SAAiB;GAChC,MAAM,UAAU,WAAW,cAAc,QAAQ,MAAM,GAAG,QAAQ,UAAU,GAAG;GAC/E,MAAMC,UAAmB,UAAU,KAAK;AAExC,UACE,oBAAC;IAEC,WAAW,GAAG,yBAAyB,IAAI,yBAAyB,OAAO,CAAC,EAAE,OAAO,YAAY;cAEjG,qBAAC;KAAI,WAAW,GAAG,yBAAyB,IAAI,yBAAyB,MAAM,CAAC,EAAE,OAAO,WAAW;gBAClG,qBAAC;MACC,WAAW,GACT,yBAAyB,IAAI,yBAAyB,kBAAkB,CAAC,EACzE,OAAO,kBACR;iBAED,oBAAC,SACC,WAAW,GAAG,yBAAyB,IAAI,yBAAyB,SAAS,CAAC,EAAE,OAAO,UAAU,GACjG,EACF,oBAACC;OACC,SAAQ;OACR,WAAW,GACT,yBAAyB,IAAI,yBAAyB,aAAa,CAAC,EACpE,OAAO,cACR;iBAEA,QAAQ,KAAK;QACH;OACT,EACL,cACC,oBAACA;MAAW,SAAQ;gBAAS,QAAQ,WAAW,IAAI;OAAwB,GAE5E,oBAACC;MACC,IAAI;MACK;MACT,UAAU;MACV,UACE,cACI,UACC,MAA2C,aAAa,MAAM,EAAE,OAAO,QAAQ;OAEtF;MAEA;MArCD,KAsCD;IAER;GACE;;AAIV,kCAAe"}

package/dist/components/auth/flow/ConsentCheckboxList.styles.d.ts.map ADDED Viewed

	@@ -0,0 +1 @@
1	+ {"version":3,"file":"ConsentCheckboxList.styles.d.ts","sourceRoot":"","sources":["../../../../src/components/auth/flow/ConsentCheckboxList.styles.ts"],"names":[],"mappings":"AAGA,OAAO,EAAC,KAAK,EAAC,MAAM,oBAAoB,CAAC;AAIzC,QAAA,MAAM,SAAS,GAAI,OAAO,KAAK,EAAE,aAAa,MAAM,KAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAsCzE,CAAC;AAEJ,eAAe,SAAS,CAAC"}