feat(admin-ui): shadcn primitives + @/ui barrel (Stage 2.1)

2026-05-10 21:47:24 +00:00
parent c11a70128c
commit 5d12c89c4f
36 changed files with 2826 additions and 28 deletions
@@ -0,0 +1,62 @@
+import * as React from 'react'
+import * as TabsPrimitive from '@radix-ui/react-tabs'
+import { cn } from '@/lib/utils'
+
+/**
+ * Radix Tabs — handoff style: bottom-border accent на active tab, weight 600.
+ * Use {@code <Tabs value onValueChange><TabsList>…</TabsList><TabsContent />}.
+ */
+
+export const Tabs = TabsPrimitive.Root
+
+export const TabsList = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.List>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(function TabsList({ className, ...props }, ref) {
+  return (
+    <TabsPrimitive.List
+      ref={ref}
+      className={cn(
+        'inline-flex h-10 items-center gap-1 border-b border-line w-full',
+        className,
+      )}
+      {...props}
+    />
+  )
+})
+
+export const TabsTrigger = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Trigger>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(function TabsTrigger({ className, ...props }, ref) {
+  return (
+    <TabsPrimitive.Trigger
+      ref={ref}
+      className={cn(
+        'inline-flex items-center justify-center whitespace-nowrap px-3.5 h-10 text-sm text-ink-2 -mb-px',
+        'border-b-2 border-transparent transition-all hover:text-ink',
+        'focus-visible:outline-none focus-visible:text-accent',
+        'disabled:pointer-events-none disabled:opacity-50',
+        'data-[state=active]:border-accent data-[state=active]:text-ink data-[state=active]:font-semibold',
+        className,
+      )}
+      {...props}
+    />
+  )
+})
+
+export const TabsContent = React.forwardRef<
+  React.ElementRef<typeof TabsPrimitive.Content>,
+  React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
+>(function TabsContent({ className, ...props }, ref) {
+  return (
+    <TabsPrimitive.Content
+      ref={ref}
+      className={cn(
+        'mt-3 focus-visible:outline-none',
+        className,
+      )}
+      {...props}
+    />
+  )
+})