{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tabs",
  "title": "Tabs",
  "description": "in-page content switching",
  "dependencies": [
    "@rn-primitives/tabs@^1.5.2"
  ],
  "registryDependencies": [
    "@kit-native/lib-utils",
    "@kit-native/text"
  ],
  "files": [
    {
      "path": "components/ui/tabs.tsx",
      "content": "import { TextClassContext } from '@/components/ui/text';\nimport { cn } from '@/lib/utils';\nimport * as TabsPrimitive from '@rn-primitives/tabs';\nimport { Platform } from 'react-native';\n\nfunction Tabs({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n  return <TabsPrimitive.Root className={cn('flex flex-col gap-2', className)} {...props} />;\n}\n\nfunction TabsList({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.List>) {\n  return (\n    <TabsPrimitive.List\n      className={cn(\n        'bg-muted flex h-9 flex-row items-center justify-center rounded-lg p-[3px]',\n        Platform.select({ web: 'inline-flex w-fit', native: 'mr-auto' }),\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction TabsTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n  const { value } = TabsPrimitive.useRootContext();\n  return (\n    <TextClassContext.Provider\n      value={cn(\n        'text-foreground dark:text-muted-foreground text-sm font-medium',\n        value === props.value && 'dark:text-foreground'\n      )}>\n      <TabsPrimitive.Trigger\n        className={cn(\n          'flex h-[calc(100%-1px)] flex-row items-center justify-center gap-1.5 rounded-md border border-transparent px-2 py-1 shadow-none',\n          Platform.select({\n            web: 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:outline-ring inline-flex cursor-default whitespace-nowrap transition-[color,box-shadow] focus-visible:outline-1 focus-visible:ring-[3px] disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0',\n          }),\n          props.disabled && 'opacity-50',\n          props.value === value && 'bg-card dark:border-foreground/10 dark:bg-input/30',\n          className\n        )}\n        {...props}\n      />\n    </TextClassContext.Provider>\n  );\n}\n\nfunction TabsContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n  return (\n    <TabsPrimitive.Content\n      className={cn(Platform.select({ web: 'flex-1 outline-none' }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Tabs, TabsContent, TabsList, TabsTrigger };\n",
      "type": "registry:ui",
      "target": "components/ui/tabs.tsx"
    }
  ],
  "meta": {
    "exports": [
      "Tabs"
    ],
    "api": "<Tabs value onValueChange><TabsList><TabsTrigger value /></TabsList><TabsContent value /></Tabs>"
  },
  "docs": "Run `npx expo install --fix` afterwards so Expo SDK packages match your SDK. Needs the kit theme (`@kit-native/theme`) and `KitThemeProvider` from `@kit-native/lib-theme-context` at the root.",
  "categories": [
    "navigation"
  ],
  "type": "registry:ui"
}