{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "components-preloaders-greetings",
  "title": "Greeting Preloader",
  "description": "A greeting preloader that displays rapid greetings in different languages.",
  "dependencies": [
    "gsap",
    "framer-motion"
  ],
  "files": [
    {
      "path": "registry/components/preloaders/greetings/index.tsx",
      "content": "'use client';\nimport { useEffect, useRef, useState } from 'react';\nimport gsap from 'gsap';\nimport { motion, AnimatePresence } from 'framer-motion';\n\ninterface Greeting {\n  text: string;\n  language: string;\n}\n\ninterface DynamicTextProps {\n  onComplete?: () => void;\n  greetingList?: Greeting[];\n  intervalMs?: number;\n}\n\nconst defaultGreetings: Greeting[] = [\n  { text: 'Hello', language: 'English' },\n  { text: 'Bonjour', language: 'French' },\n  { text: '안녕하세요', language: 'Korean' },\n  { text: 'Hola', language: 'Spanish' },\n  { text: 'Ciao', language: 'Italian' },\n  { text: 'Hallo', language: 'German' },\n  { text: 'नमस्ते', language: 'Hindi' },\n  { text: 'こんにちは', language: 'Japanese' },\n];\n\nfunction DynamicText({\n  onComplete,\n  greetingList,\n  intervalMs = 300,\n}: DynamicTextProps) {\n  const greetings =\n    greetingList && greetingList.length > 0 ? greetingList : defaultGreetings;\n\n  const [currentIndex, setCurrentIndex] = useState(0);\n  const [isAnimating, setIsAnimating] = useState(true);\n\n  useEffect(() => {\n    if (!isAnimating) return;\n\n    const interval = setInterval(() => {\n      setCurrentIndex((prevIndex) => {\n        const nextIndex = prevIndex + 1;\n        if (nextIndex >= greetings.length) {\n          clearInterval(interval);\n          setIsAnimating(false);\n          if (onComplete) onComplete();\n          return prevIndex;\n        }\n        return nextIndex;\n      });\n    }, intervalMs);\n\n    return () => clearInterval(interval);\n  }, [isAnimating, greetings, onComplete, intervalMs]);\n\n  const textVariants = {\n    hidden: { y: 20, opacity: 0 },\n    visible: { y: 0, opacity: 1 },\n    exit: { y: -100, opacity: 0 },\n  };\n\n  return (\n    <section\n      className=\"flex min-h-50 items-center justify-center gap-1 p-4\"\n      aria-label=\"Rapid greetings in different languages\"\n    >\n      <div className=\"relative h-16 w-60 flex items-center justify-center overflow-visible\">\n        {isAnimating ? (\n          <AnimatePresence mode=\"popLayout\">\n            <motion.div\n              key={currentIndex}\n              className=\"absolute flex items-center gap-2 text-2xl xl:text-3xl font-medium text-foreground\"\n              aria-live=\"off\"\n              initial={textVariants.hidden}\n              animate={textVariants.visible}\n              exit={textVariants.exit}\n              transition={{ duration: 0.2, ease: 'easeOut' }}\n            >\n              <div\n                className=\"h-2 w-2 rounded-full bg-foreground\"\n                aria-hidden=\"true\"\n              />\n              {greetings[currentIndex].text}\n            </motion.div>\n          </AnimatePresence>\n        ) : (\n          <div className=\"flex items-center gap-2 text-2xl font-medium text-foreground\">\n            <div\n              className=\"h-2 w-2 rounded-full bg-foreground\"\n              aria-hidden=\"true\"\n            />\n            {greetings[currentIndex].text}\n          </div>\n        )}\n      </div>\n    </section>\n  );\n}\n\nexport default function GreetingPreloader({\n  greetings,\n  intervalMs = 300,\n  fullPage = true,\n}: {\n  greetings?: Greeting[];\n  intervalMs?: number;\n  fullPage?: boolean;\n}) {\n  const overlayRef = useRef<HTMLDivElement | null>(null);\n  const [done, setDone] = useState(false);\n\n  useEffect(() => {\n    const overlay = overlayRef.current;\n    if (!overlay) return;\n\n    gsap.set(overlay, { y: 0 });\n\n    if (!fullPage) return;\n\n    overlay.style.zIndex = '11000';\n    gsap.set(overlay, { zIndex: 11000 });\n    gsap.set('#navbar', { autoAlpha: 0, y: -30 });\n    gsap.set('#main-content h1, #main-content h2', { autoAlpha: 0, y: 30 });\n    gsap.set('#projectHeader', { autoAlpha: 0, y: 20 });\n    gsap.set('#hr', {\n      autoAlpha: 0,\n      scaleX: 0,\n      width: '100%',\n      transformOrigin: 'center center',\n    });\n  }, [fullPage]);\n\n  const handleComplete = () => {\n    const overlay = overlayRef.current;\n    if (!overlay) return;\n\n    const tl = gsap.timeline({\n      defaults: { ease: 'power2.out', duration: 0.8 },\n      onComplete: () => setDone(true),\n    });\n\n    tl.to(overlay, { yPercent: -110, duration: 1 });\n\n    if (!fullPage) return;\n\n    tl.to('#navbar', { y: 0, autoAlpha: 1, duration: 0.6 }, '-=0.6');\n    tl.to(\n      '#main-content h1, #main-content h2',\n      { y: 0, autoAlpha: 1, stagger: 0.12, duration: 0.8 },\n      '-=0.4',\n    );\n    tl.to('#projectHeader', { y: 0, autoAlpha: 1, duration: 0.6 }, '-=0.4');\n    tl.to(\n      '#hr',\n      {\n        scaleX: 1,\n        autoAlpha: 1,\n        duration: 0.8,\n        transformOrigin: 'center center',\n      },\n      '-=0.4',\n    );\n  };\n\n  if (done) return null;\n\n  return (\n    <div\n      ref={overlayRef}\n      className={\n        fullPage\n          ? 'fixed inset-0 z-9999 flex items-center justify-center bg-background'\n          : 'absolute inset-0 z-20 flex items-center justify-center bg-background'\n      }\n    >\n      <div className=\"text-center\">\n        <DynamicText\n          onComplete={handleComplete}\n          greetingList={greetings}\n          intervalMs={intervalMs}\n        />\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/odysseyui/greetings-preloader.tsx"
    }
  ],
  "type": "registry:ui"
}