rebrand to useSend (#210)

packages/ui/src/sheet.tsx

@@ -39,20 +39,23 @@ const SheetOverlay = React.forwardRef<
 
 SheetOverlay.displayName = SheetPrimitive.Overlay.displayName;
 
-const sheetVariants = cva("fixed z-50 gap-4 bg-background p-6 shadow-lg", {
-  variants: {
-    side: {
-      top: "inset-x-0 top-0 border-b",
-      bottom: "inset-x-0 bottom-0 border-t",
-      left: "inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm",
-      right:
-        "inset-y-0 right-[32px] h-[95%] rounded-2xl my-auto w-3/4 border-l sm:max-w-sm",
+const sheetVariants = cva(
+  "fixed z-50 grid gap-4 rounded-2xl border-2 bg-popover p-6 shadow-lg",
+  {
+    variants: {
+      side: {
+        top: "inset-x-0 top-0",
+        bottom: "inset-x-0 bottom-0",
+        left: "inset-y-0 left-0 h-full w-3/4 sm:max-w-sm",
+        right:
+          "inset-y-0 right-[32px] h-[95%] my-auto w-3/4 sm:max-w-sm",
+      },
     },
-  },
-  defaultVariants: {
-    side: "right",
-  },
-});
+    defaultVariants: {
+      side: "right",
+    },
+  }
+);
 
 interface SheetContentProps
   extends React.ComponentPropsWithoutRef<typeof SheetPrimitive.Content>,

packages/ui/src/typography.tsx

@@ -0,0 +1,54 @@
+import * as React from "react";
+import { cn } from "../lib/utils";
+
+// Simple typography primitives: H1, H2, BodyText
+// H1/H2 use mono font, slightly bolder and larger per request
+
+export interface TypographyProps extends React.HTMLAttributes<HTMLElement> {
+  asChild?: boolean;
+}
+
+export const H1 = React.forwardRef<HTMLHeadingElement, TypographyProps>(
+  ({ className, ...props }, ref) => (
+    <h1
+      ref={ref}
+      className={cn(
+        // font-mono, larger and a bit bolder
+        " font-mono text-xl font-medium",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+H1.displayName = "H1";
+
+export const H2 = React.forwardRef<HTMLHeadingElement, TypographyProps>(
+  ({ className, ...props }, ref) => (
+    <h2
+      ref={ref}
+      className={cn(
+        // font-mono, slightly smaller than H1, bold
+        "font-mono text-lg",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+H2.displayName = "H2";
+
+export const BodyText = React.forwardRef<HTMLParagraphElement, TypographyProps>(
+  ({ className, ...props }, ref) => (
+    <p
+      ref={ref}
+      className={cn(
+        // default body text styling
+        "leading-7 text-foreground/90",
+        className
+      )}
+      {...props}
+    />
+  )
+);
+BodyText.displayName = "BodyText";