feat: add core UI components and baseline tests

2026-03-19 16:56:27 +08:00
parent 12642e0a92
commit 063179933c
73 changed files with 5756 additions and 2 deletions
@@ -0,0 +1,68 @@
+import { cva } from "../lib/cva";
+
+export const dropdownMenuContentVariants = cva(
+  [
+    "z-50 min-w-[12rem] overflow-hidden rounded-[var(--radius-md)] border border-[var(--color-border)] bg-[var(--color-card)] p-1.5 text-[var(--color-card-foreground)] shadow-[var(--shadow-md)] outline-none",
+    "data-[state=open]:motion-enter-rise data-[state=closed]:motion-exit-drop",
+    "data-[side=bottom]:origin-top data-[side=left]:origin-right data-[side=right]:origin-left data-[side=top]:origin-bottom"
+  ],
+  {
+    variants: {
+      size: {
+        sm: "min-w-[11rem]",
+        md: "min-w-[13rem]",
+        lg: "min-w-[15rem]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+
+export const dropdownMenuItemVariants = cva(
+  [
+    "relative flex cursor-default select-none items-center gap-2 rounded-[calc(var(--radius-sm)-4px)] px-2.5 py-2 text-sm outline-none",
+    "text-[var(--color-foreground)] transition-colors duration-[var(--dur-fast)] ease-[var(--ease-standard)]",
+    "focus:bg-[var(--color-surface)] focus:text-[var(--color-foreground)] data-[highlighted]:bg-[var(--color-surface)] data-[highlighted]:text-[var(--color-foreground)]",
+    "data-[disabled]:pointer-events-none data-[disabled]:opacity-45"
+  ],
+  {
+    variants: {
+      inset: {
+        false: "",
+        true: "pl-8"
+      },
+      variant: {
+        default: "",
+        destructive:
+          "text-[var(--color-destructive)] data-[highlighted]:bg-[color-mix(in_oklch,var(--color-destructive)_12%,var(--color-card))] data-[highlighted]:text-[var(--color-destructive)]"
+      }
+    },
+    defaultVariants: {
+      inset: false,
+      variant: "default"
+    }
+  }
+);
+
+export const dropdownMenuLabelVariants = cva(
+  [
+    "px-2.5 py-2 text-xs font-medium uppercase tracking-[var(--tracking-caps)] text-[var(--color-muted-foreground)]"
+  ],
+  {
+    variants: {
+      inset: {
+        false: "",
+        true: "pl-8"
+      }
+    },
+    defaultVariants: {
+      inset: false
+    }
+  }
+);
+
+export const dropdownMenuSeparatorVariants = cva([
+  "-mx-1 my-1 h-px bg-[var(--color-border)]"
+]);