diff --git a/packages/ui/src/components/ui/button.test.tsx b/packages/ui/src/components/ui/button.test.tsx new file mode 100644 index 00000000..281cf6d8 --- /dev/null +++ b/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) + }) +}) diff --git a/packages/ui/src/components/ui/button.tsx b/packages/ui/src/components/ui/button.tsx index 2b5ba2fa..328b4b8a 100644 --- a/packages/ui/src/components/ui/button.tsx +++ b/packages/ui/src/components/ui/button.tsx @@ -93,17 +93,22 @@ function Button({ variant, size, asChild = false, + type, ...props }: React.ComponentProps<"button"> & VariantProps & { asChild?: boolean }) { const Comp = asChild ? Slot : "button" + const typeProps = asChild + ? (type === undefined ? {} : { type }) + : { type: type ?? "button" } return ( )