ui: add protected dashboard CRUD screens and assignment docs

packages/ui/src/components/table.tsx

@@ -0,0 +1,53 @@
+import { cn } from "@minmon/ui/lib/utils";
+import * as React from "react";
+
+function Table({ className, ...props }: React.ComponentProps<"table">) {
+  return <table className={cn("w-full caption-bottom text-xs", className)} {...props} />;
+}
+
+function TableWrapper({ className, ...props }: React.ComponentProps<"div">) {
+  return <div className={cn("overflow-x-auto border", className)} {...props} />;
+}
+
+function TableHeader({ className, ...props }: React.ComponentProps<"thead">) {
+  return <thead className={cn("bg-muted/40", className)} {...props} />;
+}
+
+function TableBody({ className, ...props }: React.ComponentProps<"tbody">) {
+  return <tbody className={cn("[&_tr:last-child]:border-0", className)} {...props} />;
+}
+
+function TableRow({ className, ...props }: React.ComponentProps<"tr">) {
+  return <tr className={cn("border-b transition-colors hover:bg-muted/30", className)} {...props} />;
+}
+
+function TableHead({ className, ...props }: React.ComponentProps<"th">) {
+  return (
+    <th
+      className={cn(
+        "h-10 px-3 text-left align-middle text-[11px] font-medium uppercase tracking-[0.16em] text-muted-foreground",
+        className,
+      )}
+      {...props}
+    />
+  );
+}
+
+function TableCell({ className, ...props }: React.ComponentProps<"td">) {
+  return <td className={cn("px-3 py-2.5 align-middle", className)} {...props} />;
+}
+
+function TableCaption({ className, ...props }: React.ComponentProps<"caption">) {
+  return <caption className={cn("mt-3 text-xs text-muted-foreground", className)} {...props} />;
+}
+
+export {
+  Table,
+  TableBody,
+  TableCaption,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow,
+  TableWrapper,
+};