{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-text-reveal-box",
  "title": "Text Reveal Box Demo",
  "description": "Scroll-pinned manifesto copy with word-by-word highlight reveal.",
  "registryDependencies": ["@soralabs/text-reveal-box"],
  "files": [
    {
      "path": "registry/demo/primitives/texts/text-reveal-box/index.tsx",
      "content": "\"use client\";\n\nimport { useEffect, useRef, useState } from \"react\";\nimport { CatalogScrollHint } from \"@/components/catalog/catalog-scroll-hint\";\nimport { resolveScrollRoot } from \"@/lib/catalog/resolve-scroll-root\";\nimport { waitForScrollerReady } from \"@/lib/scroll/scroller-ready\";\nimport { TextRevealBox } from \"@/components/sora-ui/texts/text-reveal-box\";\n\nconst PARAGRAPHS = [\n  \"We work at the intersection of systems design and psychological tension. Every project ships only when the player feels watched from the first frame and never fully shakes it after the last.\",\n];\n\nexport default function TextRevealBoxExample() {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const [scroller, setScroller] = useState<Element | Window | undefined>();\n\n  useEffect(() => {\n    const node = rootRef.current;\n    if (!node) {\n      return;\n    }\n\n    const resolved = resolveScrollRoot(node);\n\n    waitForScrollerReady(resolved)\n      .then(() => {\n        setScroller(resolved);\n      })\n      .catch(() => {\n        /* preview unmounted */\n      });\n  }, []);\n\n  return (\n    <div className=\"w-full\" ref={rootRef}>\n      <CatalogScrollHint label=\"Scroll to reveal text word by word\" />\n\n      {scroller ? (\n        <TextRevealBox\n          classNames={{\n            paragraph:\n              \"text-[clamp(1.5rem,2.5vw,4.5rem)] font-medium leading-none tracking-[-0.02em]\",\n          }}\n          containerQuery\n          embedded\n          paragraphs={PARAGRAPHS}\n          pinDuration={4}\n          scroller={scroller}\n          variant=\"minimal\"\n        />\n      ) : null}\n    </div>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/sora-ui/demo/texts/text-reveal-box.tsx"
    }
  ],
  "type": "registry:ui"
}
