feat: add native PCI-compliant credit card input (iOS + Android) (#51)

### Description

Adds a `NativeCreditCard` component that replaces the WebView-based card
input with platform-native text fields (`UITextField` on iOS, `EditText`
on Android). Card data stays in native Swift/Kotlin memory and never
enters the JavaScript heap. Tokenization uses NaCl-encrypted
communication (Curve25519-XSalsa20-Poly1305 via vendored TweetNaCl) with
Bolt's tokenizer service, matching the protocol used by the existing
WebView iframe. The native component coexists with the existing WebView
implementation — merchants opt in by changing a single import.

Includes all PCI security controls: screen capture prevention (SR-7),
accessibility hardening (SR-8), memory zeroing on all exit paths (SR-2),
debug/simulator detection (SR-12), jailbreak/root detection (SR-13),
runtime integrity checks (SR-15), ProGuard/R8 rules (SR-14), dark mode
support, native `setStyles()` with full prop wiring, and validation
error parity with the WebView. Transport security is provided by NaCl
`crypto_box` end-to-end encryption — a MITM cannot decrypt the payload
without the server's private key. Also bumps React Native from 0.84 to
0.85.

### Testing

- **Unit tests**: 27 new tests across 3 test files
(`NativeCreditCard.test.tsx`, `NativeCreditCardComponent.test.tsx`,
`useNativeCreditCardController.test.ts`) covering namespace exports,
component rendering, prop forwarding, all 4 event types, tokenize
success/error/unmounted/malformed JSON/null fields/null native module,
and `setStyles`. Updated `index.test.tsx` with export validation. All
147 tests pass.
- **iOS manual**: `yarn example ios` → "Native" tab renders card fields,
card brand icon appears on BIN detection (Visa/MC/Amex/Discover), PAN
masks on blur, validation errors highlight red, tokenization succeeds
with Bolt sandbox, screen capture overlay appears during recording,
`setStyles()` applies changes, dark mode colors update on trait change.
- **Android manual**: `yarn example android` → same flows verified with
compound drawable icons, postal code watcher enables button,
`FLAG_SECURE` applied on attach and cleared on detach, TalkBack
announces "Card number ending in XXXX" without reading full PAN, dark
mode colors respond to night mode.
- **Coexistence**: "WebView" tab continues to work alongside "Native"
tab with no interference.
- **TypeScript**: `npx tsc --noEmit` passes with 0 errors.
- **Lint**: `npx eslint` passes with 0 errors.
- **npm pack**: should be tested with a fresh Expo project before
release per established process.

### Security Review

> [!IMPORTANT]
> A security review is required for every PR in this repository to
comply with PCI requirements.

- [x] I have considered and reviewed security implications of this PR
and included the summary below.

#### Security Impact Summary

This PR introduces native handling of cardholder data (PAN, CVV, expiry)
in Swift and Kotlin. Security controls implemented:

- **SR-1 CHD isolation**: Card data exists only in native `UInt8[]` /
`CharArray` buffers, never crosses the JS bridge as strings.
- **SR-2 Memory zeroing**: All card buffers explicitly zeroed after
tokenization on every exit path (success, failure, timeout, view
unmount). Local copies in the TurboModule completion handler also
zeroed. Client secret key zeroed in-place after decryption (no Swift CoW
copy). Postal field text cleared.
- **SR-5 CVV masked**: `isSecureTextEntry` /
`TYPE_NUMBER_VARIATION_PASSWORD` at all times.
- **SR-6 PAN masked**: Only last 4 visible after field loses focus.
- **SR-7 Screen capture**: iOS monitors
`UIScreen.capturedDidChangeNotification` and overlays card fields when
recording. Android applies `FLAG_SECURE` on attach and clears on detach.
- **SR-8 Accessibility**: iOS PAN returns "ending in XXXX" for
VoiceOver, CVV sets `isAccessibilityElement = false`. Android PAN uses
custom `AccessibilityDelegate` showing masked value.
- **SR-9 No disk persistence**: `autocorrectionType = .no`,
`IMPORTANT_FOR_AUTOFILL_NO`, `TYPE_TEXT_FLAG_NO_SUGGESTIONS`,
`dispatchFreezeSelfOnly` prevents `Bundle` serialization.
- **SR-12 Debug detection**: Detects debug builds and
simulators/emulators. Logs warning in production for jailbroken/rooted
devices only — does not block during development.
- **SR-13 Jailbreak/root detection**: iOS checks Cydia/apt paths and
sandbox escape. Android checks su binaries, test-keys, and root
management apps. Reports via `BoltDeviceIntegrity.integrityReport()`.
- **SR-14 ProGuard**: `proguard-rules.pro` with `-keepclassmembers` for
crypto and zeroing methods, `-keepnames` for bridge registration.
Consumer rules applied via `defaultConfig`.
- **SR-15 Runtime integrity**: iOS verifies code signing validity.
Android verifies APK signature presence.
- **Encrypted tokenization**: PAN/CVV encrypted via NaCl `crypto_box`
(Curve25519-XSalsa20-Poly1305) before transmission. Plaintext bytes
zeroed immediately after encryption. No `String` intermediaries for CHD
(FR-3.4). Transport protection provided by end-to-end encryption — MITM
cannot decrypt without server's private key.
- **Crypto safety**: `SecRandomCopyBytes` return checked — aborts on
PRNG failure. Empty token responses rejected.
- **Dark mode**: Dynamic colors on both platforms prevent UI artifacts
that could expose field state.
- **PCI SSS certification**: In progress. Native component labeled as
beta. WebView remains the production SAQ A path until certification
completes.

Author: arstiefel

BoltReactNativeSdk.podspec

@@ -13,8 +13,10 @@ Pod::Spec.new do |s|
   s.platforms    = { :ios => min_ios_version_supported }
   s.source       = { :git => "https://github.com/BoltApp/bolt-react-native-sdk.git", :tag => "#{s.version}" }
 
-  s.source_files = "ios/**/*.{h,m,mm,swift,cpp}"
-  s.private_header_files = "ios/**/*.h"
+  s.source_files = "ios/**/*.{h,m,mm,swift,cpp,c}"
+  s.public_header_files = "ios/tweetnacl.h", "ios/tweetnacl-bridge.h"
+  s.private_header_files = "ios/BoltReactNativeSdk.h"
+  s.resource_bundles = { "BoltCardBrandAssets" => ["ios/CardBrandAssets/*.png"] }
 
   install_modules_dependencies(s)
 end

README.md

@@ -8,7 +8,8 @@ Bolt React Native SDK for payments. Provides Credit Card tokenization, 3D Secure
 
 ## Architecture
 
-- **Credit Card & 3DS** — WebView-based, loading secure pages from `connect.bolt.com`. Card data never touches your app (PCI compliant).
+- **Credit Card (WebView)** — WebView-based, loading secure pages from `connect.bolt.com`. Card data never touches your app (PCI SAQ A compliant).
+- **Credit Card (Native)** — Platform-native text fields (`UITextField` on iOS, `EditText` on Android). Card data stays in native memory, never enters the JS heap. Requires Bolt PCI SSS certification for SAQ A — see [Native Credit Card (Beta)](#7-native-credit-card-beta) below.
 - **Apple Pay & Google Pay** — Native Fabric view components for buttons (`PKPaymentButton` on iOS, `PayButton` on Android) with TurboModules for the payment sheet.
 
 ## Installation
@@ -269,6 +270,101 @@ cc.setStyles({
 });
 ```
 
+### 7. Native Credit Card (Beta)
+
+> **Note:** The native card input is in beta. Card data is kept in native memory and never enters the JS heap. PCI SSS certification is in progress — contact your Bolt representative for the latest compliance guidance.
+
+The `NativeCreditCard` component uses platform-native text fields instead of a WebView. Benefits include faster rendering (no WebView cold-start), native autofill, iOS 17+ card camera scanner support, and built-in security controls (screen capture prevention, accessibility protection, memory zeroing).
+
+```typescript
+import { NativeCreditCard } from '@boltpay/react-native/payments';
+
+function CheckoutScreen() {
+  const cc = NativeCreditCard.useController();
+
+  cc.on('valid', () => setCanSubmit(true));
+  cc.on('error', (msg) => setFieldError(msg));
+
+  const handlePayment = async () => {
+    const result = await cc.tokenize();
+    if (result instanceof Error) {
+      console.error(result.message);
+      return;
+    }
+    // result: { token?, last4?, bin?, network?, expiration?, postal_code? }
+  };
+
+  return (
+    <>
+      <NativeCreditCard.Component
+        controller={cc}
+        showPostalCode={true}
+      />
+      <Button onPress={handlePayment} title="Pay" />
+    </>
+  );
+}
+```
+
+The `NativeCreditCard` API mirrors `CreditCard` — same `useController()` / `Component` / `on()` / `tokenize()` pattern. The two implementations coexist; merchants opt in to native by importing `NativeCreditCard` instead of `CreditCard`.
+
+#### Styling
+
+Native fields use `NativeCardFieldStyles` instead of CSS custom properties:
+
+```typescript
+cc.setStyles({
+  textColor: '#333333',
+  fontSize: 16,
+  placeholderColor: '#9ca3af',
+  borderColor: '#d1d5db',
+  borderRadius: 10,
+  backgroundColor: '#fafafa',
+});
+```
+
+Or pass initial styles via controller options:
+
+```typescript
+const cc = NativeCreditCard.useController({
+  styles: { textColor: '#333', borderRadius: 8 },
+});
+```
+
+#### Migrating from WebView to Native
+
+The migration is a one-line import change. The controller API (`on()`, `tokenize()`) and `TokenResult` shape are identical.
+
+```diff
+- import { CreditCard } from '@boltpay/react-native/payments';
++ import { NativeCreditCard } from '@boltpay/react-native/payments';
+
+- const cc = CreditCard.useController({
+-   styles: { '--bolt-input-backgroundColor': '#fafafa' },
+-   showBillingZIPField: true,
+- });
++ const cc = NativeCreditCard.useController();
+
+- <CreditCard.Component controller={cc} style={styles.cardInput} />
++ <NativeCreditCard.Component controller={cc} showPostalCode={true} style={styles.cardInput} />
+```
+
+**What stays the same:**
+
+- `cc.on('valid' | 'error' | 'focus' | 'blur', callback)` — identical API
+- `cc.tokenize()` — returns `Promise<TokenResult | Error>`, same shape
+- `TokenResult` — `{ token?, last4?, bin?, network?, expiration?, postal_code? }`
+
+**What changes:**
+
+|                    | WebView (`CreditCard`)                               | Native (`NativeCreditCard`)                             |
+| ------------------ | ---------------------------------------------------- | ------------------------------------------------------- |
+| Import             | `CreditCard`                                         | `NativeCreditCard`                                      |
+| Postal code prop   | `showBillingZIPField` (on controller options)        | `showPostalCode` (on Component)                         |
+| Styling            | CSS custom properties (`--bolt-*`) via `setStyles()` | `NativeCardFieldStyles` (`textColor`, `fontSize`, etc.) |
+| WebView dependency | Requires `react-native-webview`                      | No WebView needed                                       |
+| PCI compliance     | SAQ A (production-ready)                             | SAQ A pending PCI SSS certification (beta)              |
+
 ## API Reference
 
 ### Root (`@boltpay/react-native`)
@@ -282,13 +378,15 @@ cc.setStyles({
 
 ### Payments (`@boltpay/react-native/payments`)
 
-| Export                               | Description                                                               |
-| ------------------------------------ | ------------------------------------------------------------------------- |
-| `CreditCard.Component`               | WebView-based credit card input                                           |
-| `CreditCard.useController(options?)` | Returns a controller with `tokenize()`, `on()`, and `setStyles()`         |
-| `useThreeDSecure()`                  | Hook returning `{ Component, fetchReferenceID(), challengeWithConfig() }` |
-| `ApplePay`                           | Native `PKPaymentButton` (iOS only, renders nothing on Android)           |
-| `GoogleWallet`                       | Native Google Pay `PayButton` (Android only, renders nothing on iOS)      |
+| Export                                     | Description                                                               |
+| ------------------------------------------ | ------------------------------------------------------------------------- |
+| `CreditCard.Component`                     | WebView-based credit card input (PCI SAQ A)                               |
+| `CreditCard.useController(options?)`       | Returns a controller with `tokenize()`, `on()`, and `setStyles()`         |
+| `NativeCreditCard.Component`               | Native platform credit card input (Beta — PCI SSS pending)                |
+| `NativeCreditCard.useController(options?)` | Returns a controller with `tokenize()`, `on()`, and `setStyles()`         |
+| `useThreeDSecure()`                        | Hook returning `{ Component, fetchReferenceID(), challengeWithConfig() }` |
+| `ApplePay`                                 | Native `PKPaymentButton` (iOS only, renders nothing on Android)           |
+| `GoogleWallet`                             | Native Google Pay `PayButton` (Android only, renders nothing on iOS)      |
 
 ### Credit Card Controller
 
@@ -313,15 +411,15 @@ cc.setStyles({
 
 ### GoogleWallet Props
 
-| Prop           | Type                        | Default   | Description                                                                                           |
-| -------------- | --------------------------- | --------- | ----------------------------------------------------------------------------------------------------- |
+| Prop           | Type                        | Default   | Description                                                                                                       |
+| -------------- | --------------------------- | --------- | ----------------------------------------------------------------------------------------------------------------- |
 | `config`       | `GooglePayConfig`           | required  | Presentation options: currency, amount, label, billing address format. Merchant config is auto-fetched from Bolt. |
-| `onComplete`   | `(GooglePayResult) => void` | required  | Called with token, bin, expiration, and billing address on success                                    |
-| `onError`      | `(Error) => void`           | —         | Called on payment failure or cancellation                                                             |
-| `buttonType`   | `GooglePayButtonType`       | `'plain'` | Maps to Google Pay `ButtonConstants.ButtonType`. Button text is rendered natively and auto-localized. |
-| `buttonTheme`  | `GooglePayButtonTheme`      | `'dark'`  | Button color theme: `'dark'` or `'light'`. Maps to `ButtonConstants.ButtonTheme`.                     |
-| `borderRadius` | `number`                    | —         | Corner radius in dp applied to the Google Pay button                                                  |
-| `style`        | `ViewStyle`                 | —         | Container style overrides (height, margin, etc.)                                                      |
+| `onComplete`   | `(GooglePayResult) => void` | required  | Called with token, bin, expiration, and billing address on success                                                |
+| `onError`      | `(Error) => void`           | —         | Called on payment failure or cancellation                                                                         |
+| `buttonType`   | `GooglePayButtonType`       | `'plain'` | Maps to Google Pay `ButtonConstants.ButtonType`. Button text is rendered natively and auto-localized.             |
+| `buttonTheme`  | `GooglePayButtonTheme`      | `'dark'`  | Button color theme: `'dark'` or `'light'`. Maps to `ButtonConstants.ButtonTheme`.                                 |
+| `borderRadius` | `number`                    | —         | Corner radius in dp applied to the Google Pay button                                                              |
+| `style`        | `ViewStyle`                 | —         | Container style overrides (height, margin, etc.)                                                                  |
 
 ### 3D Secure
 
@@ -339,6 +437,7 @@ cc.setStyles({
 - `ThreeDSError` — Error subclass with numeric `code` (1001–1010)
 - `CreditCardId` — `{ id: string, expiration: string }` (from Bolt's Add Card API)
 - `CreditCardInfo` — `CreditCardId | TokenResult` (input for `fetchReferenceID`)
+- `NativeCardFieldStyles` — `{ textColor?, fontSize?, placeholderColor?, borderColor?, borderWidth?, borderRadius?, backgroundColor?, fontFamily? }` (for `NativeCreditCard`)
 - `EventType` — `'error' | 'valid' | 'blur' | 'focus'`
 - `ApplePayResult` — `{ token, bin?, expiration?, billingContact?, boltReference? }`
 - `ApplePayButtonType` — Apple-approved button label variants (`'plain'`, `'buy'`, `'checkout'`, `'book'`, `'subscribe'`, `'donate'`, `'order'`, `'setUp'`, `'inStore'`, `'reload'`, `'addMoney'`, `'topUp'`, `'rent'`, `'support'`, `'contribute'`, `'tip'`)

android/build.gradle

@@ -46,6 +46,10 @@ android {
     buildConfig true
   }
 
+  defaultConfig {
+    consumerProguardFiles 'proguard-rules.pro'
+  }
+
   buildTypes {
     release {
       minifyEnabled false

android/proguard-rules.pro

@@ -0,0 +1,22 @@
+# SR-14: ProGuard/R8 rules for credit card data handling classes.
+#
+# These rules ensure critical crypto and zeroing methods are not
+# optimized away or inlined by R8. Class names are NOT kept (allowing
+# obfuscation) — only the specific methods needed for correctness.
+
+# Keep NaCl crypto methods from being removed or inlined
+-keepclassmembers class com.boltreactnativesdk.creditcardfield.TweetNaCl {
+    public static int crypto_box_keypair(byte[], byte[]);
+    public static int crypto_box(byte[], byte[], long, byte[], byte[], byte[]);
+    public static int crypto_box_open(byte[], byte[], long, byte[], byte[], byte[]);
+    public static void randombytes(byte[]);
+}
+
+# Ensure buffer zeroing calls are not optimized away
+-keepclassmembers class com.boltreactnativesdk.creditcardfield.BoltCardFieldView {
+    public void zeroAllBuffers();
+}
+
+# Keep React Native ViewManager and Module names for bridge registration
+-keepnames class com.boltreactnativesdk.creditcardfield.BoltCardFieldManager
+-keepnames class com.boltreactnativesdk.creditcardfield.BoltCardFieldModule

android/src/main/java/com/boltreactnativesdk/BoltReactNativeSdkPackage.kt

@@ -6,13 +6,16 @@ import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.module.model.ReactModuleInfo
 import com.facebook.react.module.model.ReactModuleInfoProvider
 import com.facebook.react.uimanager.ViewManager
+import com.boltreactnativesdk.creditcardfield.BoltCardFieldManager
+import com.boltreactnativesdk.creditcardfield.BoltCardFieldModule
 
 class BoltReactNativeSdkPackage : BaseReactPackage() {
   override fun getModule(name: String, reactContext: ReactApplicationContext): NativeModule? {
     return when (name) {
       BoltReactNativeSdkModule.NAME -> BoltReactNativeSdkModule(reactContext)
       GooglePayModule.NAME -> GooglePayModule(reactContext)
       NetworkingModule.NAME -> NetworkingModule(reactContext)
+      BoltCardFieldModule.NAME -> BoltCardFieldModule(reactContext)
       else -> null
     }
   }
@@ -42,13 +45,21 @@ class BoltReactNativeSdkPackage : BaseReactPackage() {
         needsEagerInit = false,
         isCxxModule = false,
         isTurboModule = false
+      ),
+      BoltCardFieldModule.NAME to ReactModuleInfo(
+        name = BoltCardFieldModule.NAME,
+        className = BoltCardFieldModule.NAME,
+        canOverrideExistingModule = false,
+        needsEagerInit = false,
+        isCxxModule = false,
+        isTurboModule = false
       )
     )
   }
 
   override fun createViewManagers(
     reactContext: ReactApplicationContext
   ): List<ViewManager<*, *>> {
-    return listOf(GooglePayButtonViewManager())
+    return listOf(GooglePayButtonViewManager(), BoltCardFieldManager())
   }
 }

android/src/main/java/com/boltreactnativesdk/creditcardfield/BoltCardFieldEvents.kt

@@ -0,0 +1,35 @@
+package com.boltreactnativesdk.creditcardfield
+
+import com.facebook.react.bridge.Arguments
+import com.facebook.react.bridge.WritableMap
+import com.facebook.react.uimanager.events.Event
+
+/**
+ * DirectEventHandler events for BoltCreditCardField.
+ * ADR-4: Use direct events (not bubbling) for component-scoped state signals.
+ *
+ * Event names use the "top" prefix convention required by Fabric.
+ */
+
+class OnValidEvent(surfaceId: Int, viewId: Int) : Event<OnValidEvent>(surfaceId, viewId) {
+    override fun getEventName(): String = "topCardValid"
+    override fun getEventData(): WritableMap = Arguments.createMap()
+}
+
+class OnErrorEvent(surfaceId: Int, viewId: Int, private val message: String) :
+    Event<OnErrorEvent>(surfaceId, viewId) {
+    override fun getEventName(): String = "topCardError"
+    override fun getEventData(): WritableMap = Arguments.createMap().apply {
+        putString("message", message)
+    }
+}
+
+class OnFocusEvent(surfaceId: Int, viewId: Int) : Event<OnFocusEvent>(surfaceId, viewId) {
+    override fun getEventName(): String = "topCardFocus"
+    override fun getEventData(): WritableMap = Arguments.createMap()
+}
+
+class OnBlurEvent(surfaceId: Int, viewId: Int) : Event<OnBlurEvent>(surfaceId, viewId) {
+    override fun getEventName(): String = "topCardBlur"
+    override fun getEventData(): WritableMap = Arguments.createMap()
+}

android/src/main/java/com/boltreactnativesdk/creditcardfield/BoltCardFieldManager.kt

@@ -0,0 +1,95 @@
+package com.boltreactnativesdk.creditcardfield
+
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.SimpleViewManager
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.viewmanagers.BoltCreditCardFieldManagerDelegate
+import com.facebook.react.viewmanagers.BoltCreditCardFieldManagerInterface
+
+/**
+ * Fabric ViewManager for the native credit card input.
+ *
+ * The @ReactModule name MUST exactly match the string passed to
+ * codegenNativeComponent('BoltCreditCardField') in the TypeScript spec.
+ */
+@ReactModule(name = BoltCardFieldManager.NAME)
+class BoltCardFieldManager :
+    SimpleViewManager<BoltCardFieldView>(),
+    BoltCreditCardFieldManagerInterface<BoltCardFieldView> {
+
+    companion object {
+        const val NAME = "BoltCreditCardField"
+    }
+
+    private val delegate = BoltCreditCardFieldManagerDelegate(this)
+
+    override fun getDelegate(): ViewManagerDelegate<BoltCardFieldView> = delegate
+
+    override fun getName(): String = NAME
+
+    override fun createViewInstance(context: ThemedReactContext): BoltCardFieldView {
+        return BoltCardFieldView(context)
+    }
+
+    @ReactProp(name = "publishableKey")
+    override fun setPublishableKey(view: BoltCardFieldView, key: String?) {
+        // Stored for use by the companion TurboModule during tokenize
+    }
+
+    @ReactProp(name = "showPostalCode", defaultBoolean = false)
+    override fun setShowPostalCode(view: BoltCardFieldView, show: Boolean) {
+        view.updateShowPostalCode(show)
+    }
+
+    // Style props
+    @ReactProp(name = "styleTextColor")
+    override fun setStyleTextColor(view: BoltCardFieldView, color: String?) {
+        view.applyStyleTextColor(color)
+    }
+
+    @ReactProp(name = "styleFontSize", defaultFloat = 0f)
+    override fun setStyleFontSize(view: BoltCardFieldView, size: Float) {
+        view.applyStyleFontSize(size)
+    }
+
+    @ReactProp(name = "stylePlaceholderColor")
+    override fun setStylePlaceholderColor(view: BoltCardFieldView, color: String?) {
+        view.applyStylePlaceholderColor(color)
+    }
+
+    @ReactProp(name = "styleBorderColor")
+    override fun setStyleBorderColor(view: BoltCardFieldView, color: String?) {
+        view.applyStyleBorderColor(color)
+    }
+
+    @ReactProp(name = "styleBorderWidth", defaultFloat = 0f)
+    override fun setStyleBorderWidth(view: BoltCardFieldView, width: Float) {
+        view.applyStyleBorderWidth(width)
+    }
+
+    @ReactProp(name = "styleBorderRadius", defaultFloat = 0f)
+    override fun setStyleBorderRadius(view: BoltCardFieldView, radius: Float) {
+        view.applyStyleBorderRadius(radius)
+    }
+
+    @ReactProp(name = "styleBackgroundColor")
+    override fun setStyleBackgroundColor(view: BoltCardFieldView, color: String?) {
+        view.applyStyleBackgroundColor(color)
+    }
+
+    @ReactProp(name = "styleFontFamily")
+    override fun setStyleFontFamily(view: BoltCardFieldView, family: String?) {
+        view.applyStyleFontFamily(family)
+    }
+
+    override fun getExportedCustomDirectEventTypeConstants(): Map<String, Any>? {
+        return mapOf(
+            "topCardValid" to mapOf("registrationName" to "onCardValid"),
+            "topCardError" to mapOf("registrationName" to "onCardError"),
+            "topCardFocus" to mapOf("registrationName" to "onCardFocus"),
+            "topCardBlur"  to mapOf("registrationName" to "onCardBlur"),
+        )
+    }
+}