fix: harden kumo base component styling

components/ui/button.tsx

@@ -6,6 +6,8 @@ import {
   type LinkButtonProps as KumoLinkButtonProps,
 } from "@cloudflare/kumo/components/button";
 
+import { cn } from "@/lib/utils";
+
 type ButtonVariant = "default" | "secondary" | "outline" | "ghost" | "destructive";
 type ButtonSize = "default" | "sm" | "lg" | "icon";
 
@@ -35,10 +37,11 @@ export type LinkButtonProps = Omit<KumoLinkButtonProps, "variant" | "size"> & {
 };
 
 export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function Button(
-  { variant = "default", size = "default", ...props },
+  { className, variant = "default", size = "default", ...props },
   ref,
 ): React.ReactElement {
   const kumoProps = {
+    className: cn("teatea-button", `teatea-button-${variant}`, className),
     ref,
     shape: size === "icon" ? "square" : "base",
     size: sizeMap[size],
@@ -52,8 +55,16 @@ export const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(function
 });
 
 export const LinkButton = React.forwardRef<HTMLAnchorElement, LinkButtonProps>(function LinkButton(
-  { variant = "default", size = "default", ...props },
+  { className, variant = "default", size = "default", ...props },
   ref,
 ): React.ReactElement {
-  return <KumoLinkButton ref={ref} size={sizeMap[size]} variant={variantMap[variant]} {...props} />;
+  return (
+    <KumoLinkButton
+      ref={ref}
+      className={cn("teatea-button", `teatea-button-${variant}`, className)}
+      size={sizeMap[size]}
+      variant={variantMap[variant]}
+      {...props}
+    />
+  );
 });