fix(ui): default Button type to button (#1252)

Co-authored-by: Isaac Sanchez <isanchez-hawkins@arize.com>

packages/ui/src/components/ui/button.test.tsx

@@ -0,0 +1,23 @@
+import { describe, expect, test } from "bun:test"
+
+import { Button } from "./button"
+
+describe("Button", () => {
+  test("defaults native buttons to type button", () => {
+    const element = Button({ children: "Cancel" })
+
+    expect(element.props.type).toBe("button")
+  })
+
+  test("preserves explicit native button types", () => {
+    const element = Button({ children: "Save", type: "submit" })
+
+    expect(element.props.type).toBe("submit")
+  })
+
+  test("does not default asChild buttons", () => {
+    const element = Button({ asChild: true, children: "Link" })
+
+    expect(element.props.type).toBe(undefined)
+  })
+})

packages/ui/src/components/ui/button.tsx

@@ -93,17 +93,22 @@ function Button({
   variant,
   size,
   asChild = false,
+  type,
   ...props
 }: React.ComponentProps<"button"> &
   VariantProps<typeof buttonVariants> & {
     asChild?: boolean
   }) {
   const Comp = asChild ? Slot : "button"
+  const typeProps = asChild
+    ? (type === undefined ? {} : { type })
+    : { type: type ?? "button" }
 
   return (
     <Comp
       data-slot="button"
       className={cn(buttonVariants({ variant, size, className }))}
+      {...typeProps}
       {...props}
     />
   )