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,59 @@
+import * as React from 'react'
+import { cn } from '@/lib/utils'
+
+/**
+ * Card / Panel — surface block с radius-card, border-line. Замена для
+ * {@code @nstart/ui} Panel. Используем сложно через {@link CardHeader},
+ * {@link CardContent}, {@link CardFooter}.
+ */
+export const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  function Card({ className, ...props }, ref) {
+    return (
+      <div
+        ref={ref}
+        className={cn(
+          'rounded-lg border border-line bg-surface text-ink shadow-sm',
+          className,
+        )}
+        {...props}
+      />
+    )
+  },
+)
+
+export const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  function CardHeader({ className, ...props }, ref) {
+    return <div ref={ref} className={cn('flex flex-col gap-1.5 p-4', className)} {...props} />
+  },
+)
+
+export const CardTitle = React.forwardRef<HTMLHeadingElement, React.HTMLAttributes<HTMLHeadingElement>>(
+  function CardTitle({ className, ...props }, ref) {
+    return (
+      <h3
+        ref={ref}
+        className={cn('text-base font-semibold leading-tight text-ink', className)}
+        {...props}
+      />
+    )
+  },
+)
+
+export const CardDescription = React.forwardRef<
+  HTMLParagraphElement,
+  React.HTMLAttributes<HTMLParagraphElement>
+>(function CardDescription({ className, ...props }, ref) {
+  return <p ref={ref} className={cn('text-sm text-ink-2', className)} {...props} />
+})
+
+export const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  function CardContent({ className, ...props }, ref) {
+    return <div ref={ref} className={cn('p-4 pt-0', className)} {...props} />
+  },
+)
+
+export const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+  function CardFooter({ className, ...props }, ref) {
+    return <div ref={ref} className={cn('flex items-center p-4 pt-0', className)} {...props} />
+  },
+)