{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-text-reveal",
  "title": "Text Reveal Demo",
  "description": "Word-by-word and character-by-character scroll-driven text reveal.",
  "registryDependencies": [
    "@unlumen-ui/text-reveal"
  ],
  "files": [
    {
      "path": "registry/demo/components/unlumen/text-reveal/index.tsx",
      "content": "\"use client\";\n\nimport { TextReveal } from \"@/components/unlumen-ui/primitives/text-reveal\";\n\ninterface TextRevealDemoProps {\n  splitBy?: \"words\" | \"characters\";\n  staggerDelay?: number;\n  duration?: number;\n  once?: boolean;\n}\n\nexport const TextRevealDemo = ({\n  splitBy = \"words\",\n  staggerDelay = 0.05,\n  duration = 0.5,\n  once = true,\n}: TextRevealDemoProps) => {\n  return (\n    <div className=\"w-full max-w-3xl mx-auto px-6 py-24 space-y-24\">\n      {/* Hero Section */}\n      <div className=\"space-y-6\">\n        <TextReveal\n          text=\"Blur-Driven Text Animation\"\n          as=\"h1\"\n          splitBy={splitBy}\n          staggerDelay={staggerDelay}\n          duration={duration}\n          once={once}\n          className=\"text-5xl md:text-6xl font-bold tracking-tight text-foreground\"\n        />\n\n        <TextReveal\n          text=\"Every word appears exactly when you need it — viewport-triggered, blur-based, zero configuration required.\"\n          as=\"p\"\n          splitBy={splitBy}\n          staggerDelay={staggerDelay}\n          duration={duration}\n          once={once}\n          className=\"text-lg md:text-xl font-medium text-muted-foreground leading-relaxed\"\n        />\n      </div>\n\n      {/* Word by Word Section */}\n      <div className=\"space-y-6\">\n        <h2 className=\"text-sm font-semibold text-muted-foreground uppercase tracking-wider\">\n          Word by Word\n        </h2>\n\n        <TextReveal\n          text=\"Elegant animations that reveal your message progressively. Each word fades in with a subtle blur-to-sharp transition as it enters the viewport. Perfect for engaging storytelling and creating compelling visual narratives.\"\n          as=\"p\"\n          splitBy={splitBy}\n          staggerDelay={staggerDelay}\n          duration={duration}\n          once={once}\n          className=\"text-2xl md:text-3xl font-medium text-foreground leading-relaxed\"\n        />\n      </div>\n\n      {/* Character by Character Section */}\n      <div className=\"space-y-6\">\n        <h2 className=\"text-sm font-semibold text-muted-foreground uppercase tracking-wider\">\n          Character by Character\n        </h2>\n\n        <TextReveal\n          text=\"For maximum precision, animate character by character.\"\n          as=\"p\"\n          splitBy={splitBy}\n          staggerDelay={staggerDelay}\n          duration={duration}\n          once={once}\n          className=\"text-xl md:text-2xl font-medium text-foreground leading-relaxed\"\n        />\n      </div>\n\n      {/* Large Quote */}\n      <div className=\"space-y-6 pt-12 border-t border-border\">\n        <TextReveal\n          text=\"The viewport-triggered animation feels natural and immersive, adapting perfectly to different screen sizes.\"\n          as=\"h3\"\n          splitBy={splitBy}\n          staggerDelay={staggerDelay}\n          duration={duration}\n          once={once}\n          className=\"text-3xl md:text-4xl font-bold text-foreground leading-relaxed italic\"\n        />\n\n        <p className=\"text-muted-foreground\">— Design System Documentation</p>\n      </div>\n    </div>\n  );\n};\n\nexport default TextRevealDemo;\n",
      "type": "registry:example"
    }
  ],
  "meta": {
    "demoProps": {
      "TextRevealDemo": {
        "splitBy": {
          "value": "words",
          "options": {
            "Words": "words",
            "Characters": "characters"
          }
        },
        "staggerDelay": {
          "value": 0.05,
          "min": 0.01,
          "max": 0.2,
          "step": 0.01
        },
        "duration": {
          "value": 0.5,
          "min": 0.1,
          "max": 2,
          "step": 0.1
        },
        "once": {
          "value": true
        }
      }
    }
  },
  "type": "registry:example"
}