{"templateId":"markdown","versions":[{"version":"v1","label":"v1","link":"/products/checkout/react-native/v1/cvc-validator","default":false,"active":false,"folderId":"26950148"},{"version":"v2","label":"v2","link":"/products/checkout/react-native/v2/cvc-validator","default":false,"active":false,"folderId":"26950148"},{"version":"v3","label":"v3","link":"/products/checkout/react-native/v3/cvc-validator","default":false,"active":false,"folderId":"26950148"},{"version":"v4","label":"v4 (Latest)","link":"/products/checkout/react-native/cvc-validator","default":true,"active":true,"folderId":"26950148"}],"sharedDataIds":{"sidebar":"sidebar-products/checkout/react-native/sidebars.yaml"},"props":{"metadata":{"markdoc":{"tagList":["partial","admonition","code-snippet","tabs","tab"]},"custom_product":"Checkout","type":"markdown"},"seo":{"title":"CVC validation","description":"Worldpay for Developers - docs, code examples, resources and tools. Everything you need to build your omnichannel payment solution.","siteUrl":"https://docs.worldpay.com/access","image":"/access/assets/worldpay-logo-light.21b7daf79984773a9fcd7d4fbcb07ae5289dfffd6023c4c3dca720c7058e53dc.33f780a6.svg","keywords":"documentation, api, openapi, sdks, developer, payments, json, payouts, 3ds","jsonLd":{"@context":"https://schema.org","@type":"Organization","url":"https://docs.worldpay.com/access","name":"Worldpay"},"meta":[{"name":"google-site-verification","content":"zjziIKaP3ImsqsfhYnEBnq1R85UabiSwl7HTXuwtZuo"},{"name":"doc_product","content":"Access"},{"name":"doc_category","content":"Documentation"}],"llmstxt":{"hide":false,"sections":[{"title":"Payments API","description":"Payment orchestration API combining fraud assessment, 3ds authentication, SCA exemptions, Worldpay Token creation and a card or wallet based payment.","includeFiles":["products/payments/@20240601/**/*"],"excludeFiles":[]},{"title":"Payment Queries API","description":"Querying your payments data, based on a variety of parameters.","includeFiles":["products/payment-queries/@v1/**/*"],"excludeFiles":[]},{"title":"Card BIN Data API","description":"Provides detailed information about a card.","includeFiles":["products/card-bin/@v1/**/*"],"excludeFiles":[]},{"title":"3DS Authentication API","description":"Request 3DS authentication to protect against fraud, be SCA compliant and to shift liability using this standalone API.","includeFiles":["products/3ds/@v3/**/*"],"excludeFiles":[]},{"title":"FraudSight API","description":"Request a risk assessment and receive a response with an outcome (e.g. lowRisk) using this standalone API.","includeFiles":["products/fraudsight/@v1/**/*"],"excludeFiles":[]},{"title":"Checkout SDK","description":"Integrate using our clientside SDKs for both web and native devices. Benefit from SAQ-A/PCI-SSF compliance.","includeFiles":["products/checkout/web/@v2/**/*","products/checkout/ios/@v4/**/*","products/checkout/android/@v4/**/*","products/checkout/react-native/@v3/**/*","products/checkout/flutter/@v1/**/*"],"excludeFiles":[]},{"title":"Tokens API","description":"Minimizes the exposure of sensitive card details and increases the security of your customer's card details.","includeFiles":["products/tokens/@v3/**/*"],"excludeFiles":[]},{"title":"Card Payments API","description":"Request a card payment using this standalone API, requires separate requests for 3DS, Fraud assessment etc.","includeFiles":["products/card-payments/@v7/**/*"],"excludeFiles":[]},{"title":"Card Verifications API","description":"Verify your customer's card to maximize your authentication rates.","includeFiles":["products/card-verifications/@v6/**/*"],"excludeFiles":[]},{"title":"Account Payouts API","description":"Send funds to your customer's bank accounts and search for payouts using parameters.","includeFiles":["products/account-payouts/@20250101/**/*"],"excludeFiles":[]},{"title":"APMs","description":"Pay using eWallets, bank transfers, direct debits, local card schemes, Postpay and eInvoice/ Buy Now Pay Later.","includeFiles":["products/apms/@20240701/**/*"],"excludeFiles":[]},{"title":"Balance API","description":"Request your account details for a single account or all accounts under an entity.","includeFiles":["products/balance/@20250101/**/*"],"excludeFiles":[]},{"title":"Card Payouts API","description":"Send funds to your customer's cards.","includeFiles":["products/card-payouts/@v4/**/*"],"excludeFiles":[]},{"title":"Events (Webhooks)","description":"Receive status updates from Access Worldpay by setting up a webhook.","includeFiles":["products/events/@v1/**/*"],"excludeFiles":[]},{"title":"FX API","description":"Manage Foreign Exchange (FX) on your payments.","includeFiles":["products/fx/@v1/**/*"],"excludeFiles":[]},{"title":"Hosted Payment Pages (HPP) API","description":"Our low-code option to take payments securely at the lowest PCI compliance level - SAQ A.","includeFiles":["products/hosted-payment-pages/@v1/**/*"],"excludeFiles":[]},{"title":"Money Transfers API","description":"Money Transfer OCTs (Original Credit Transaction) allow funds to be pushed to an eligible card in 30 minutes or less.","includeFiles":["products/money-transfers/@v1/**/*"],"excludeFiles":[]},{"title":"Parties API","description":"Create parties, manage your payout instruments and beneficial owners and carry out identity verification checks.","includeFiles":["products/parties/@20250101/**/*"],"excludeFiles":[]},{"title":"SCA Exemptions API","description":"Maximize a frictionless checkout experience by using issuer data insights to apply exemptions.","includeFiles":["products/sca-exemptions/@v1/**/*"],"excludeFiles":[]},{"title":"Split Payments API","description":"Divide funds from a single payment amongst yourself and your parties/sellers.","includeFiles":["products/split-payments/@20250625/**/*"],"excludeFiles":[]},{"title":"Statements API","description":"Retrieve your account statement and see individual entries for all credits and debits.","includeFiles":["products/statements/@20250101/**/*"],"excludeFiles":[]},{"title":"Transfers API","description":"Transfer funds from source account to target account.","includeFiles":["products/transfers/@20250101/**/*"],"excludeFiles":[]},{"title":"Verified Tokens API","description":"Verified Tokens ensures that your customer's payment details are valid and CIT compliant when creating a token.","includeFiles":["products/verified-tokens/@v3/**/*"],"excludeFiles":[]}],"excludeFiles":[]}},"dynamicMarkdocComponents":[],"compilationErrors":[],"ast":{"$$mdtype":"Tag","name":"article","attributes":{},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Last updated"]},": 20 November 2025 | ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/checkout/react-native/changelog/"},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Change log"]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":1,"id":"cvc-validation","__idx":0},"children":["CVC validation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Validate your customer's CVC details before processing them."]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"warning","name":"Warning"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["The validation does not check if your customer's card details are correct. The validator only checks the formatting of"," ","the entered details."]}]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"get-started","__idx":1},"children":["Get started"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["To integrate the validation feature you must:"]},{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Initialize and configure the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," hook."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Create an implementation of a ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["CvcOnlyValidationEventListener"]}," to be notified of validation events."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Get an instance of the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["initialiseValidation"]}," function exposed by the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," hook."]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["Call that function once your UI components are present in the DOM in order to effectively initialize the validation."]}]},{"$$mdtype":"Tag","name":"Admonition","attributes":{"type":"info","name":"Full sample integration"},"children":[{"$$mdtype":"Tag","name":"p","attributes":{},"children":["You can see an example of the CVC validation integration"," ",{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"https://github.com/Worldpay/access-checkout-react-native/tree/v4.0.1/demo-app"},"children":["here"]},"."]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"configure-the-useaccesscheckout-hook","__idx":2},"children":["Configure the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," hook"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Before implementing validation, you must first configure the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," hook, if you haven't already."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["To do this, you must provide your ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["baseUrl"]}," and ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["checkoutId"]},", as well as the CVC identifier defined as the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["nativeID"]}," property within the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["AccessCheckoutTextInput"]}," component."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Here's an example."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/initialize-cvc-only.js","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import {useAccessCheckout, useCvcOnlyConfig} from '@worldpay/access-worldpay-checkout-react-native-sdk';\n\nexport default function CvcFlow() {\n\n  const {initialiseValidation} = useAccessCheckout({\n    baseUrl: 'https://try.access.worldpay.com',\n    checkoutId: 'YOUR_CHECKOUT_ID',\n    config: useCvcOnlyConfig({\n      cvcId: 'cvcInput'\n    }),\n  });\n}\n"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"parameters","__idx":3},"children":["Parameters"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Parameter"},"children":["Parameter"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["baseUrl"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"ul","attributes":{},"children":[{"$$mdtype":"Tag","name":"li","attributes":{},"children":["For testing use: ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["https://try.access.worldpay.com/"]}]},{"$$mdtype":"Tag","name":"li","attributes":{},"children":["For live use: ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["https://access.worldpay.com/"]}]}]}]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["checkoutId"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["Your unique checkout ID."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["cvcId"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["The nativeID assigned to your CVC ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["AccessCheckoutTextInput"]}," component."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"implement-the-validation-listener","__idx":4},"children":["Implement the validation listener"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["To receive validation events as your customer enters their cvc details, you are required to create your own implementation of"," ","the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["CvcOnlyValidationEventListener"]}," interface. Each function of this interface is optional, giving you the flexibility to listen only to the events that are relevant to your application."]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"div","attributes":{"label":"JavaScript","disable":false},"children":[{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/implement-cvc-only-validation-event-listener.js","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"const validationEventListener = {\n\n  onCvcValidChanged(isValid) {\n    // TODO: handle the cvc validation result\n  },\n\n  onValidationSuccess() {\n    // TODO: handle the form when the validation is complete i.e. all fields are valid\n  },\n};\n"},"children":[]}]},{"$$mdtype":"Tag","name":"div","attributes":{"label":"TypeScript","disable":false},"children":[{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/implement-cvc-only-validation-event-listener.ts","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import {\n  //...\n  CvcOnlyValidationEventListener,\n} from '@worldpay/access-worldpay-checkout-react-native-sdk';\n\nconst validationEventListener: CvcOnlyValidationEventListener = {\n\n  onCvcValidChanged(isValid: boolean): void {\n    // TODO: handle the cvc validation result\n  },\n\n  onValidationSuccess(): void {\n    // TODO: handle the form when the validation is complete i.e. all fields are valid\n  },\n};\n"},"children":[]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":3,"id":"methods","__idx":5},"children":["Methods"]},{"$$mdtype":"Tag","name":"div","attributes":{"className":"md-table-wrapper"},"children":[{"$$mdtype":"Tag","name":"table","attributes":{"className":"md"},"children":[{"$$mdtype":"Tag","name":"thead","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Method"},"children":["Method"]},{"$$mdtype":"Tag","name":"th","attributes":{"data-label":"Description"},"children":["Description"]}]}]},{"$$mdtype":"Tag","name":"tbody","attributes":{},"children":[{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onCvcValidChanged"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["This method is called with the validity of the CVC field. ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["isValid"]}," indicates whether the field is in a valid or invalid state."]}]},{"$$mdtype":"Tag","name":"tr","attributes":{},"children":[{"$$mdtype":"Tag","name":"td","attributes":{},"children":[{"$$mdtype":"Tag","name":"code","attributes":{},"children":["onValidationSuccess"]}]},{"$$mdtype":"Tag","name":"td","attributes":{},"children":["This method is called when all fields are in a valid state. You typically use this to enable the submit button."]}]}]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"configure-useaccesscheckout-to-enable-validation","__idx":6},"children":["Configure ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," to enable validation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["You must configure the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," hook to get an instance of the function which will be used to initialize validation for your UI. You can use the helper hook ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useCvcOnlyConfig"]}," to add the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["CvcOnlyValidationEventListener"]}," to the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]}," hook configuration which will expose a ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["initialiseValidation"]}," method."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Here's an example detailing how to do this."]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"div","attributes":{"label":"JavaScript","disable":false},"children":[{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/get-initialization-function.js","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import {useAccessCheckout, useCvcOnlyConfig} from '@worldpay/access-worldpay-checkout-react-native-sdk';\n\nexport default function CvcFlow() {\n  const validationEventListener = {\n    //...\n  }\n  const {initialiseValidation, ...} = useAccessCheckout({\n    ...\n    config: useCvcOnlyConfig({\n      cvcId: 'cvcInput',\n      validationConfig: {\n        validationListener: validationEventListener,\n      },\n    }),\n  });\n}\n"},"children":[]}]},{"$$mdtype":"Tag","name":"div","attributes":{"label":"TypeScript","disable":false},"children":[{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/get-initialization-function.tsx","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import {\n  useAccessCheckout,\n  useCvcOnlyConfig,\n  CvcOnlyValidationEventListener\n} from '@worldpay/access-worldpay-checkout-react-native-sdk';\n\nexport default function CvcFlow() {\n  const validationEventListener: CvcOnlyValidationEventListener = {\n    //...\n  }\n\n  const {initialiseValidation, ...} = useAccessCheckout({\n    ...\n    config: useCvcOnlyConfig({\n      cvcId: 'cvcInput',\n      validationConfig: {\n        validationListener: validationEventListener,\n      },\n    }),\n  });\n}\n"},"children":[]}]}]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"initialize-validation","__idx":7},"children":["Initialize validation"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["After configuring ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["useAccessCheckout"]},", initialize validation for your UI using the ",{"$$mdtype":"Tag","name":"code","attributes":{},"children":["initialiseValidation()"]}," function. Don't forget to ensure that your UI components for CVC are available in the DOM before doing so."]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Validation initialization is an asynchronous process so make sure to handle the promise returned by the function."]},{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/initialize-validation.js","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import React from 'react';\nimport {View} from 'react-native';\n// ...\n\nconst onLayout = () => {\n  initialiseValidation()\n    .then(() => {\n      // You may want to optionally perform some actions once validation has been successfully initialized.\n    })\n    .catch(e => {\n      // do something in case of error\n    });\n};\n\nreturn (\n  <View onLayout={onLayout}>\n    ...\n  </View>);\n"},"children":[]},{"$$mdtype":"Tag","name":"Heading","attributes":{"level":2,"id":"full-code-sample","__idx":8},"children":["Full code sample"]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":["Here's the full code sample of the steps above."]},{"$$mdtype":"Tag","name":"Tabs","attributes":{"size":"medium"},"children":[{"$$mdtype":"Tag","name":"div","attributes":{"label":"JavaScript","disable":false},"children":[{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/full-sample.js","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import React from 'react';\nimport {View} from 'react-native';\nimport {\n  AccessCheckoutTextInput,\n  useAccessCheckout,\n  useCvcOnlyConfig,\n} from '@worldpay/access-worldpay-checkout-react-native-sdk';\n\nexport default function CvcFlow() {\n\n  const validationEventListener = {\n    onCvcValidChanged(isValid) {\n      // TODO: handle the cvc validation result\n    },\n    onValidationSuccess() {\n      // TODO: handle the form when the validation is complete i.e. all fields are valid\n    },\n  };\n\n  const {initialiseValidation, ...} = useAccessCheckout({\n    baseUrl: 'https://try.access.worldpay.com',\n    checkoutId: 'YOUR_CHECKOUT_ID',\n    config: useCvcOnlyConfig({\n      cvcId: 'cvcInput',\n      validationConfig: {\n        validationListener: validationEventListener,\n      },\n    }),\n  });\n\n  const onLayout = () => {\n    initialiseValidation()\n      .then(() => {\n        // You may want to optionally perform some actions once validation has been successfully initialized.\n      })\n      .catch(e => {\n        // do something in case of error\n      });\n  };\n\n  return (\n    <View onLayout={onLayout}>\n      <AccessCheckoutTextInput\n        nativeID=\"cvcInput\"\n        placeholder=\"CVC\"\n      />\n    </View>\n  );\n}\n"},"children":[]}]},{"$$mdtype":"Tag","name":"div","attributes":{"label":"TypeScript","disable":false},"children":[{"$$mdtype":"Tag","name":"CodeBlock","attributes":{"file":"./code/validation/cvc-only/full-sample.tsx","language":"json","header":{"controls":{"copy":{}}},"lang":"json","source":"import React from 'react';\nimport {View} from 'react-native';\nimport {\n  AccessCheckoutTextInput,\n  useAccessCheckout,\n  useCvcOnlyConfig,\n  CvcOnlyValidationEventListener,\n} from '@worldpay/access-worldpay-checkout-react-native-sdk';\n\nexport default function CvcFlow() {\n\n  const validationEventListener: CvcOnlyValidationEventListener = {\n    onCvcValidChanged(isValid: boolean): void {\n      // TODO: handle the cvc validation result\n    },\n    onValidationSuccess(): void {\n      // TODO: handle the form when the validation is complete i.e. all fields are valid\n    },\n  };\n\n  const {initialiseValidation, ...} = useAccessCheckout({\n    baseUrl: 'https://try.access.worldpay.com',\n    checkoutId: 'YOUR_CHECKOUT_ID',\n    config: useCvcOnlyConfig({\n      cvcId: 'cvcInput',\n      validationConfig: {\n        validationListener: validationEventListener,\n      },\n    }),\n  });\n\n\n  const onLayout = () => {\n    initialiseValidation()\n      .then(() => {\n        // You may want to optionally perform some actions once validation has been successfully initialized.\n      })\n      .catch(e => {\n        // do something in case of error\n      });\n  };\n\n  return (\n    <View onLayout={onLayout}>\n      <AccessCheckoutTextInput\n        nativeID=\"cvcInput\"\n        placeholder=\"CVC\"\n      />\n    </View>\n  );\n}\n"},"children":[]}]}]},{"$$mdtype":"Tag","name":"br","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"hr","attributes":{},"children":[]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"strong","attributes":{},"children":["Next steps"]}]},{"$$mdtype":"Tag","name":"p","attributes":{},"children":[{"$$mdtype":"Tag","name":"MarkdownLink","attributes":{"href":"/products/checkout/react-native/card-and-cvc#create-a-session-for-cvc-only"},"children":["Create a CVC session"]}]}]},"headings":[{"value":"CVC validation","id":"cvc-validation","depth":1},{"value":"Get started","id":"get-started","depth":2},{"value":"Configure the useAccessCheckout hook","id":"configure-the-useaccesscheckout-hook","depth":2},{"value":"Parameters","id":"parameters","depth":3},{"value":"Implement the validation listener","id":"implement-the-validation-listener","depth":2},{"value":"Methods","id":"methods","depth":3},{"value":"Configure useAccessCheckout to enable validation","id":"configure-useaccesscheckout-to-enable-validation","depth":2},{"value":"Initialize validation","id":"initialize-validation","depth":2},{"value":"Full code sample","id":"full-code-sample","depth":2}],"frontmatter":{"seo":{"title":"CVC validation"}},"lastModified":"2025-11-26T14:54:42.000Z","pagePropGetterError":{"message":"","name":""}},"slug":"/products/checkout/react-native/cvc-validator","userData":{"isAuthenticated":false,"teams":["anonymous"]},"isPublic":true}