UI library for Design EngineersEngineers

import AnimatedFrameworks from "@/registry/eldoraui/animated-frameworks"

export function AnimatedFrameworksExample() {
  return (
    <AnimatedFrameworks
      cardTitle="Universal Compatibility"
      cardDescription="Works seamlessly with Next.js, React, HTML, Apple, GitHub, OpenAI, and more fits everywhere."
    />
  )
}

import ClerkOTP from "@/registry/eldoraui/clerk-otp"

export function ClerkOTPDemo2() {
  return (
    <ClerkOTP
      delay={3500} // Time interval (in ms) after which the OTP animation resets.
      cardTitle="Multifactor Authentication"
      cardDescription="Each user's self-serve multifactor settings are enforced automatically during sign-in."
      whileHover={false} // Normal animation behavior
    />
  )
}

"use client"

import FancyTestimonialsSlider from "@/registry/eldoraui/testimonal-slider"

export function TestimonalSliderDemo() {
  const testimonials = [
    {
      img: "https://avatar.vercel.sh/karthik",
      quote: "EldoraUI's components make building UIs effortless great work!",
      name: "Karthik",
      role: "Developer",
    },
    {
      img: "https://avatar.vercel.sh/nick",
      quote:
        "EldoraUI simplifies complex designs with ready-to-use components.",
      name: "Nick",
      role: "Designer",
    },
    {
      img: "https://avatar.vercel.sh/amelia",
      quote: "With EldoraUI, creating responsive UIs is a breeze.",
      name: "Amelia",
      role: "Tester",
    },
  ]
  return (
    <div className="bg-background relative h-[400px] w-full overflow-hidden rounded-lg border sm:h-[500px]">
      <div className="mt-8 flex justify-center px-4 sm:mt-16 sm:px-12">
        <FancyTestimonialsSlider
          testimonials={testimonials}
          autorotateTiming={5000}
        />
      </div>
    </div>
  )
}

import { Map } from "@/registry/eldoraui/map"

export function MapDemo() {
  return (
    <div className="relative mx-auto h-[400px] w-full max-w-[600px]">
      <Map />
    </div>
  )
}