{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "tabs",
  "title": "Tabs",
  "description": "shadcn tabs as raised bevelled folder tabs joined to a bevelled panel, or an underline.",
  "dependencies": [
    "cn",
    "class-variance-authority",
    "radix-ui"
  ],
  "registryDependencies": [
    "@ui95/theme"
  ],
  "files": [
    {
      "path": "components/ui/tabs.tsx",
      "content": "\"use client\"\n\nimport { cva, type VariantProps } from \"class-variance-authority\"\nimport { cn } from \"cn\"\nimport { Tabs as TabsPrimitive } from \"radix-ui\"\nimport * as React from \"react\"\n\nfunction Tabs({\n  className,\n  orientation = \"horizontal\",\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Root>) {\n  return (\n    <TabsPrimitive.Root\n      data-slot=\"tabs\"\n      data-orientation={orientation}\n      orientation={orientation}\n      className={cn(\"group/tabs flex data-horizontal:flex-col\", className)}\n      {...props}\n    />\n  )\n}\n\nconst tabsListVariants = cva(\n  \"group/tabs-list inline-flex items-end text-foreground data-[orientation=vertical]:h-fit data-[orientation=vertical]:flex-col data-[orientation=vertical]:items-stretch\",\n  {\n    variants: {\n      variant: {\n        default:\n          \"data-[orientation=horizontal]:w-full\",\n        line: \"w-fit gap-3\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  }\n)\n\nfunction TabsList({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.List> &\n  VariantProps<typeof tabsListVariants>) {\n  return (\n    <TabsPrimitive.List\n      data-slot=\"tabs-list\"\n      data-variant={variant}\n      className={cn(tabsListVariants({ variant }), className)}\n      {...props}\n    />\n  )\n}\n\nfunction TabsTrigger({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {\n  return (\n    <TabsPrimitive.Trigger\n      data-slot=\"tabs-trigger\"\n      className={cn(\n        \"relative inline-flex h-8 items-center justify-center gap-2 px-3 font-pixel text-[16px] leading-none whitespace-nowrap uppercase data-[orientation=vertical]:justify-start disabled:pointer-events-none disabled:text-muted-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5\",\n        \"group-data-[variant=default]/tabs-list:pixel-border group-data-[variant=default]/tabs-list:border-border group-data-[variant=default]/tabs-list:bg-secondary group-data-[variant=default]/tabs-list:text-secondary-foreground group-data-[variant=default]/tabs-list:bevel-raised group-data-[variant=default]/tabs-list:offset-shadow-none group-data-[variant=default]/tabs-list:data-active:z-10 group-data-[variant=default]/tabs-list:data-active:bg-card group-data-[variant=default]/tabs-list:data-active:text-card-foreground\",\n        \"data-[orientation=horizontal]:group-data-[variant=default]/tabs-list:not-first:-ml-(--pixel) data-[orientation=horizontal]:group-data-[variant=default]/tabs-list:data-active:-mb-[calc(var(--pixel)*2)] data-[orientation=horizontal]:group-data-[variant=default]/tabs-list:data-active:[box-shadow:inset_calc(var(--pixel)*-1)_0_0_0_var(--bevel-lo),inset_var(--pixel)_var(--pixel)_0_0_var(--bevel-hi)] data-[orientation=horizontal]:group-data-[variant=default]/tabs-list:data-active:h-9 data-[orientation=horizontal]:group-data-[variant=default]/tabs-list:data-active:border-b-0\",\n        \"data-[orientation=vertical]:group-data-[variant=default]/tabs-list:not-first:-mt-(--pixel) data-[orientation=vertical]:group-data-[variant=default]/tabs-list:data-active:-mr-[calc(var(--pixel)*2)] data-[orientation=vertical]:group-data-[variant=default]/tabs-list:data-active:[box-shadow:inset_0_calc(var(--pixel)*-1)_0_0_var(--bevel-lo),inset_var(--pixel)_var(--pixel)_0_0_var(--bevel-hi)] data-[orientation=vertical]:group-data-[variant=default]/tabs-list:data-active:border-r-0\",\n        \"group-data-[variant=line]/tabs-list:px-1 group-data-[variant=line]/tabs-list:text-muted-foreground group-data-[variant=line]/tabs-list:hover:text-foreground group-data-[variant=line]/tabs-list:data-active:text-foreground\",\n        \"after:absolute after:hidden after:bg-foreground data-[orientation=horizontal]:after:inset-x-0 data-[orientation=horizontal]:after:bottom-0 data-[orientation=horizontal]:after:h-[calc(var(--pixel)*2)] data-[orientation=vertical]:after:inset-y-0 data-[orientation=vertical]:after:right-0 data-[orientation=vertical]:after:w-[calc(var(--pixel)*2)] group-data-[variant=line]/tabs-list:data-active:after:block\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nfunction TabsContent({\n  className,\n  ...props\n}: React.ComponentProps<typeof TabsPrimitive.Content>) {\n  return (\n    <TabsPrimitive.Content\n      data-slot=\"tabs-content\"\n      className={cn(\n        \"flex-1 text-xl leading-tight data-[orientation=horizontal]:pt-3 data-[orientation=vertical]:pl-3\",\n        \"[[data-slot=tabs-list][data-variant=default]~&]:pixel-border [[data-slot=tabs-list][data-variant=default]~&]:border-border [[data-slot=tabs-list][data-variant=default]~&]:bg-card [[data-slot=tabs-list][data-variant=default]~&]:p-3 [[data-slot=tabs-list][data-variant=default]~&]:text-card-foreground [[data-slot=tabs-list][data-variant=default]~&]:bevel-raised [[data-slot=tabs-list][data-variant=default]~&]:offset-shadow-none\",\n        className\n      )}\n      {...props}\n    />\n  )\n}\n\nexport { Tabs, TabsContent, TabsList, tabsListVariants, TabsTrigger }\n",
      "type": "registry:ui"
    }
  ],
  "meta": {
    "sounds": {
      "tab.select": {
        "note": "Light tactile, press only",
        "layers": [
          {
            "wave": "noise",
            "frequency": 0,
            "attack": 0.0003,
            "decay": 0.004,
            "gain": 0.45,
            "filter": {
              "type": "bandpass",
              "frequency": 4000,
              "q": 2.5
            }
          },
          {
            "wave": "square",
            "frequency": 2600,
            "attack": 0.0004,
            "decay": 0.003,
            "gain": 0.08
          }
        ]
      }
    }
  },
  "categories": [
    "ui"
  ],
  "type": "registry:ui"
}
