{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "ai-loading-skeleton-shadcnui",
  "type": "registry:component",
  "title": "AI Loading Skeleton",
  "description": "Loading state with diagonal shimmer gradient and opacity wave",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/motion-core/ai-loading-skeleton.tsx",
      "content": "\"use client\";\n\nimport { motion } from \"framer-motion\";\n\ntype SkeletonItemProps = {\n  width?: string;\n  height?: string;\n  className?: string;\n};\n\nfunction SkeletonItem({\n  width = \"100%\",\n  height = \"1rem\",\n  className = \"\",\n}: SkeletonItemProps) {\n  return (\n    <div className={`rounded bg-muted ${className}`} style={{ width, height }}>\n      <motion.div\n        animate={{\n          background: [\n            \"linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent)\",\n            \"linear-gradient(90deg, transparent, rgba(255,255,255,0.1), transparent)\",\n          ],\n          backgroundPosition: [\"200% 0\", \"-200% 0\"],\n        }}\n        transition={{\n          duration: 1.5,\n          repeat: Infinity,\n          ease: \"linear\",\n        }}\n        className=\"h-full w-full\"\n      />\n    </div>\n  );\n}\n\ntype AILoadingSkeletonProps = {\n  lines?: number;\n};\n\nexport function AILoadingSkeleton({ lines = 4 }: AILoadingSkeletonProps) {\n  return (\n    <div className=\"w-full max-w-md space-y-3 rounded-2xl border border-border bg-card p-6\">\n      {/* Avatar */}\n      <div className=\"flex items-center gap-3\">\n        <SkeletonItem width=\"3rem\" height=\"3rem\" className=\"rounded-full\" />\n        <div className=\"flex-1 space-y-2\">\n          <SkeletonItem width=\"60%\" />\n          <SkeletonItem width=\"40%\" />\n        </div>\n      </div>\n\n      {/* Content lines */}\n      <div className=\"space-y-2\">\n        {Array.from({ length: lines }).map((_, index) => (\n          <motion.div\n            key={index}\n            initial={{ opacity: 0 }}\n            animate={{ opacity: 1 }}\n            transition={{ delay: index * 0.1 }}\n          >\n            <SkeletonItem width={index === lines - 1 ? \"70%\" : \"100%\"} />\n          </motion.div>\n        ))}\n      </div>\n\n      {/* Actions */}\n      <div className=\"flex gap-2 pt-2\">\n        <SkeletonItem width=\"4rem\" height=\"2rem\" className=\"rounded-md\" />\n        <SkeletonItem width=\"4rem\" height=\"2rem\" className=\"rounded-md\" />\n      </div>\n    </div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/uitripled/ai-loading-skeleton-shadcnui.tsx"
    }
  ]
}