{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "demo-tilt-card-glare",
  "title": "Tilt Card Glare Demo",
  "description": "Tilt card with a moving light reflection following the tilt angle.",
  "registryDependencies": ["@soralabs/tilt-card"],
  "files": [
    {
      "path": "registry/demo/primitives/effects/tilt-card-glare/index.tsx",
      "content": "\"use client\";\n\nimport { TiltCard } from \"@/components/sora-ui/effects/tilt-card\";\n\nexport interface TiltCardGlareDemoProps {\n  glareMaxOpacity?: number;\n  rotationFactor?: number;\n}\n\nexport function TiltCardGlareDemo({\n  glareMaxOpacity = 0.05,\n  rotationFactor = 15,\n}: TiltCardGlareDemoProps) {\n  return (\n    <TiltCard\n      className=\"w-[280px] overflow-hidden rounded-xl bg-gradient-to-br from-zinc-800 to-zinc-950 p-6\"\n      glare\n      glareMaxOpacity={glareMaxOpacity}\n      rotationFactor={rotationFactor}\n    >\n      <div\n        className=\"flex flex-col gap-3\"\n        style={{ transform: \"translateZ(40px)\" }}\n      >\n        <p className=\"font-medium text-sm text-zinc-50\">Glare</p>\n        <p className=\"text-sm text-zinc-400\">\n          A light reflection sweeps across the surface as the card tilts,\n          selling the material.\n        </p>\n      </div>\n    </TiltCard>\n  );\n}\n\nexport default TiltCardGlareDemo;\n",
      "type": "registry:ui",
      "target": "components/sora-ui/demo/effects/tilt-card-glare.tsx"
    }
  ],
  "meta": {
    "demoProps": {
      "TiltCardGlareDemo": {
        "rotationFactor": {
          "value": 15,
          "min": 0,
          "max": 45,
          "step": 1
        },
        "glareMaxOpacity": {
          "value": 0.05,
          "min": 0,
          "max": 1,
          "step": 0.05
        }
      }
    }
  },
  "type": "registry:ui"
}
