feat: move dashboard to apps/ so we can share ws proto

2026-05-02 13:38:49 -05:00
parent 5e4473df96
commit a66303eaef
124 changed files with 19499 additions and 426 deletions
@@ -0,0 +1,52 @@
+import { cn } from "@/lib/utils";
+
+/**
+ * Themed card primitive. Themes can restyle every card without touching
+ * call sites by setting CSS vars under the `card` component-style bucket:
+ *
+ *   componentStyles:
+ *     card:
+ *       clipPath: "polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px)"
+ *       border: "1px solid var(--color-ring)"
+ *       background: "linear-gradient(180deg, var(--color-card) 0%, transparent 100%)"
+ *       boxShadow: "0 0 0 1px var(--color-ring) inset, 0 0 24px -8px var(--warm-glow)"
+ *
+ * All properties are optional — vars that aren't set compute to their
+ * CSS initial value, so the default shadcn-y card keeps looking normal
+ * for themes that don't override anything.
+ */
+const CARD_STYLE: React.CSSProperties = {
+  clipPath: "var(--component-card-clip-path)",
+  borderImage: "var(--component-card-border-image)",
+  background: "var(--component-card-background)",
+  boxShadow: "var(--component-card-box-shadow)",
+};
+
+export function Card({ className, style, ...props }: React.HTMLAttributes<HTMLDivElement>) {
+  return (
+    <div
+      className={cn(
+        "border border-border bg-card/80 text-card-foreground w-full",
+        className,
+      )}
+      style={{ ...CARD_STYLE, ...style }}
+      {...props}
+    />
+  );
+}
+
+export function CardHeader({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
+  return <div className={cn("flex flex-col gap-1.5 p-4 border-b border-border", className)} {...props} />;
+}
+
+export function CardTitle({ className, ...props }: React.HTMLAttributes<HTMLHeadingElement>) {
+  return <h3 className={cn("font-expanded text-sm font-bold tracking-[0.08em] uppercase blend-lighter", className)} {...props} />;
+}
+
+export function CardDescription({ className, ...props }: React.HTMLAttributes<HTMLParagraphElement>) {
+  return <p className={cn("font-mondwest text-xs text-muted-foreground", className)} {...props} />;
+}
+
+export function CardContent({ className, ...props }: React.HTMLAttributes<HTMLDivElement>) {
+  return <div className={cn("p-4", className)} {...props} />;
+}