{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "animated-tabs-shadcnui",
  "type": "registry:component",
  "title": "Animated Tabs",
  "description": "Tabs with sliding indicator animation",
  "registryDependencies": [
    "button"
  ],
  "dependencies": [
    "framer-motion",
    "react"
  ],
  "files": [
    {
      "path": "@uitripled/react-shadcn/src/components/components/tabs/animated-tabs.tsx",
      "content": "\"use client\";\n\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"@/components/ui/tabs\";\nimport { motion } from \"framer-motion\";\nimport { useState } from \"react\";\n\nexport function AnimatedTabs() {\n  const tabs = [\"Account\", \"Password\", \"Settings\"];\n  const [activeTab, setActiveTab] = useState(tabs[0]);\n\n  return (\n    <div className=\"flex items-center justify-center p-12\">\n      <Tabs\n        value={activeTab}\n        onValueChange={setActiveTab}\n        className=\"w-[400px]\"\n      >\n        <TabsList className=\"relative grid w-full grid-cols-3\">\n          {tabs.map((tab) => (\n            <TabsTrigger key={tab} value={tab} className=\"relative z-10\">\n              {tab}\n            </TabsTrigger>\n          ))}\n          <motion.div\n            layoutId=\"activeTab\"\n            className=\"absolute h-8 rounded-sm bg-[var(--card-bg)] shadow-sm\"\n            initial={false}\n            animate={{\n              x: tabs.indexOf(activeTab) * 133.33,\n              width: 133.33,\n            }}\n            transition={{ type: \"spring\", stiffness: 300, damping: 30 }}\n          />\n        </TabsList>\n        {tabs.map((tab) => (\n          <TabsContent key={tab} value={tab} className=\"mt-4\">\n            <motion.div\n              initial={{ opacity: 0, y: 10 }}\n              animate={{ opacity: 1, y: 0 }}\n              transition={{ duration: 0.3 }}\n              className=\"rounded-lg border  p-4\"\n            >\n              <p className=\"text-sm\">{tab} settings content goes here</p>\n            </motion.div>\n          </TabsContent>\n        ))}\n      </Tabs>\n    </div>\n  );\n}\n",
      "type": "registry:component",
      "target": "components/uitripled/animated-tabs-shadcnui.tsx"
    }
  ]
}