feat(ui): add navigation and picker primitives

2026-03-22 23:38:31 +08:00
parent a8c1d3f256
commit 4d67f4ad76
22 changed files with 2805 additions and 0 deletions
@@ -0,0 +1,34 @@
+import { cva } from "../lib/cva";
+import { getMotionRecipeClassNames } from "../lib/motion";
+
+export const breadcrumbVariants = cva(
+  "w-full text-[var(--color-muted-foreground)]"
+);
+
+export const breadcrumbListVariants = cva(
+  "flex flex-wrap items-center gap-x-2 gap-y-1.5"
+);
+
+export const breadcrumbItemVariants = cva(
+  "inline-flex min-w-0 items-center gap-2"
+);
+
+export const breadcrumbLinkVariants = cva(
+  [
+    "inline-flex min-w-0 items-center rounded-[var(--radius-sm)] text-sm font-medium",
+    "text-[var(--color-muted-foreground)] outline-none",
+    "transition-[color,background-color,box-shadow] duration-[var(--dur-fast)] ease-[var(--ease-standard)]",
+    "hover:text-[var(--color-foreground)] focus-visible:text-[var(--color-foreground)]",
+    "focus-visible:ring-2 focus-visible:ring-[var(--color-ring)] focus-visible:ring-offset-2",
+    "focus-visible:ring-offset-[var(--color-background)]",
+    getMotionRecipeClassNames("ring")
+  ]
+);
+
+export const breadcrumbCurrentVariants = cva(
+  "inline-flex min-w-0 items-center text-sm font-semibold text-[var(--color-foreground)]"
+);
+
+export const breadcrumbSeparatorVariants = cva(
+  "inline-flex size-4 shrink-0 items-center justify-center text-[var(--color-muted-foreground)]"
+);