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. Process

Process4

The Process4 component renders an interactive timeline with a changing image carousel, updating every 5 seconds and allowing manual step selection.

PreviousProcess3NextProcess5

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

Component path: src/blocks/process/Process4.tsx

Component usage path: src/app/blocks/process/process4/page.tsx

Preview link:

Props Details

Prop
Type
Description
Displayed as

heading

string

Main title for the component

"Our Process"

caption

string

Additional description or context

"Here’s a step-by-step guide through our process."

cards

ProcessCardProps[]

Array of cards for the timeline, each with a title, description, icon, and image

See example data above

https://www.saasable.io/blocks/process/process4