{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tabs-02",
  "title": "Underlined Tabs",
  "description": "Tabs with underlined style",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "tabs",
    "button"
  ],
  "files": [
    {
      "path": "src/components/customized/tabs/tabs-02.tsx",
      "content": "import { Copy } from \"lucide-react\";\nimport { Button } from \"@/registry/ui/button\";\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from \"@/registry/ui/tabs\";\n\nconst tabs = [\n  {\n    name: \"pnpm\",\n    value: \"pnpm\",\n    content: \"pnpm dlx shadcn@latest add tabs\",\n  },\n  {\n    name: \"npm\",\n    value: \"npm\",\n    content: \"npx shadcn@latest add tabs\",\n  },\n  {\n    name: \"yarn\",\n    value: \"yarn\",\n    content: \"npx shadcn@latest add tabs\",\n  },\n  {\n    name: \"bun\",\n    value: \"bun\",\n    content: \"bunx --bun shadcn@latest add tabs\",\n  },\n];\n\nexport default function TabsUnderlinedDemo() {\n  return (\n    <Tabs className=\"w-full max-w-xs\" defaultValue={tabs[0].value}>\n      <TabsList className=\"w-full justify-start rounded-none border-b bg-background p-0\">\n        {tabs.map((tab) => (\n          <TabsTrigger\n            className=\"h-full rounded-none border-transparent border-b-2 bg-background data-[state=active]:border-primary data-[state=active]:shadow-none\"\n            key={tab.value}\n            value={tab.value}\n          >\n            <code className=\"text-[13px]\">{tab.name}</code>\n          </TabsTrigger>\n        ))}\n      </TabsList>\n\n      {tabs.map((tab) => (\n        <TabsContent key={tab.value} value={tab.value}>\n          <div className=\"flex h-10 items-center justify-between gap-2 rounded-md border pr-1.5 pl-3\">\n            <code className=\"text-[13px]\">{tab.content}</code>\n            <Button className=\"h-7 w-7\" size=\"icon\" variant=\"secondary\">\n              <Copy className=\"h-3.5! w-3.5!\" />\n            </Button>\n          </div>\n        </TabsContent>\n      ))}\n    </Tabs>\n  );\n}\n",
      "type": "registry:component"
    }
  ],
  "type": "registry:component"
}