SaasAble Documentation
UI-Kit - V1.2.0
UI-Kit - V1.2.0
  • Getting Started
    • Prerequisites
    • Setup
    • Deployment
  • Development
    • Folder structure
    • Routing
    • Env Variables
    • Dependencies
    • SEO - Metadata
    • Favicon
    • MailerLite
    • Error Handling
    • Analytics
    • Branding
    • Components
      • About
        • About 1
        • About 2
        • About 3
      • Auth
        • Login
          • Login1
          • Login2
          • Login3
          • Login4
          • Login5
        • Forgot Password
        • New Password
        • OTP Verification
        • Register
      • Benefit
        • Benefit1
        • Benefit2
        • Benefit3
        • Benefit4
        • Benefit5
        • Benefit6
        • Benefit7
        • Benefit8
        • Benefit9
      • Blog
        • Blog1
        • Blog2
        • Blog3
        • Blog4
        • Blog5
        • Blog6
        • Blog7
      • Clientele
        • Clientele1
        • Clientele2
        • Clientele3
        • Clientele4
        • Clientele5
        • Clientele6
        • Clientele7
      • Contact-us
        • ContactUs1
        • ContactUs2
        • ContactUs3
        • ContactUs4
        • ContactUs5
        • ContactUs6
      • Cookie
        • Cookie1
        • Cookie2
        • Cookie3
      • Cta
        • Cta1
        • Cta2
        • Cta3
        • Cta4
        • Cta5
        • Cta6
        • Cta7
        • Cta8
        • Cta9
        • Cta10
        • Cta11
        • Cta12
      • Faq
        • Faq1
        • Faq2
        • Faq3
        • Faq4
        • Faq5
        • Faq6
        • Faq7
        • Faq8
      • Feature
        • Feature1
        • Feature2
        • Feature3
        • Feature4
        • Feature5
        • Feature6
        • Feature7
        • Feature8
        • Feature9
        • Feature10
        • Feature11
        • Feature12
        • Feature13
        • Feature14
        • Feature15
        • Feature16
        • Feature17
        • Feature18
        • Feature19
        • Feature20
        • Feature21
        • Feature22
        • Feature23
        • Feature24
        • Feature25
      • Footer
      • Gallery
        • Gallery1
        • Gallery2
        • Gallery3
        • Gallery4
      • Hero
        • Hero1
        • Hero2
        • Hero3
        • Hero4
        • Hero5
        • Hero6
        • Hero7
        • Hero8
        • Hero9
        • Hero10
        • Hero11
        • Hero12
        • Hero13
        • Hero14
        • Hero15
        • Hero16
        • Hero17
      • Integration
        • Integration1
        • Integration2
        • Integration3
        • Integration4
        • Integration5
        • Integration6
        • Integration7
        • Integration8
      • maintenance
        • Error404
      • MegaMenu
        • MegaMenu1
        • MegaMenu2
        • MegaMenu3
        • MegaMenu4
        • MegaMenu5
      • Navbar
        • NavMenu
        • Navbar-content
          • NavbarContent1
          • NavbarContent2
          • NavbarContent3
          • NavbarContent4
          • NavbarContent5
          • NavbarContent6
          • NavbarContent7
          • NavbarContent8
          • NavbarContent9
          • NavbarContent10
        • Navbar1
        • Navbar2
        • Navbar3
        • Navbar4
        • Navbar5
        • Navbar6
        • Navbar7
        • Navbar8
        • Navbar9
        • Navbar10
      • Other
        • Other1
        • Other2
        • Other3
      • Pricing
        • Pricing1
        • Pricing2
        • Pricing3
        • Pricing4
        • Pricing5
        • Pricing6
        • Pricing7
        • Pricing8
        • Pricing9
      • Process
        • Process1
        • Process2
        • Process3
        • Process4
        • Process5
        • Process6
        • Process7
      • SmallHero
        • SmallHero1
        • SmallHero2
        • SmallHero3
        • SmallHero4
        • SmallHero5
        • SmallHero6
        • SmallHero7
      • Team
        • Team1
        • Team2
        • Team3
        • Team4
        • Team5
        • Team6
        • Team7
        • Team8
      • Testimonial
        • Testimonial1
        • Testimonial2
        • Testimonial3
        • Testimonial4
        • Testimonial5
        • Testimonial6
        • Testimonial7
        • Testimonial8
        • Testimonial9
        • Testimonial10
        • Testimonial11
      • TopOffer
        • TopOffer1
        • TopOffer2
        • TopOffer3
        • TopOffer4
        • TopOffer5
      • ComingSoon
      • EarlyAccess
      • Onboard
  • Theming
    • Color
    • Typography
      • Font Family
    • Icon
      • Tabler
      • Custom/two tone
  • Global
    • Config
    • Styles
    • Component overrides
Powered by GitBook
On this page
  1. Development
  2. Components
  3. Auth

OTP Verification

The OTP Verification component renders an OTP verification page with a title, a caption showing an email address, an OTP input form, and a "Resend Code" link, styled with background elements .

PreviousNew PasswordNextRegister

All available props for the OtpVerification component are defined and handled within Component usage path file. This allows for easy modifications to the content of the OtpVerification section.

Component path: src/blocks/auth/OtpVerification.tsx

Component usage path: src/app/blocks/auth/otp-verification/page.tsx

Preview link:

Props Details

Prop Name
Type
Description
Displayed as

heading

string

Main title or heading for the OTP verification page.

"Enter the OTP"

caption

{ text: string; email: string }

Object containing the caption text and email address.

{ text: "A code has been sent to", email: "user@example.com" }

https://www.saasable.io/blocks/auth/otp-verification