From 845e11d33022bb957104e91a5b8f73e45e5bc1e0 Mon Sep 17 00:00:00 2001
From: munzzyy <colemunz@gmail.com>
Date: Sun, 5 Jul 2026 16:59:18 -0500
Subject: [PATCH 1/3] fix(Button): default htmlType to button to stop
 accidental form submits

Button and IconButton both accept an htmlType prop but never defaulted
it, so the native button fell back to the browser default of
type=submit. Any Button or IconButton inside a form submitted that
form on click unless htmlType was set explicitly.

Default htmlType to 'button' on both components. Consumers who want
submit behavior still opt in with htmlType="submit".

Closes #1092
---
 .changeset/fix-button-htmltype-default.md     |  5 +++++
 src/components/Button/Button.test.tsx         | 17 ++++++++++++++++-
 src/components/Button/Button.tsx              |  2 +-
 src/components/IconButton/IconButton.test.tsx | 17 ++++++++++++++++-
 src/components/IconButton/IconButton.tsx      |  2 +-
 5 files changed, 39 insertions(+), 4 deletions(-)
 create mode 100644 .changeset/fix-button-htmltype-default.md

diff --git a/.changeset/fix-button-htmltype-default.md b/.changeset/fix-button-htmltype-default.md
new file mode 100644
index 000000000..e6696f930
--- /dev/null
+++ b/.changeset/fix-button-htmltype-default.md
@@ -0,0 +1,5 @@
+---
+'@clickhouse/click-ui': patch
+---
+
+Default `htmlType` to `"button"` on `Button` and `IconButton`. Both components already accepted an `htmlType` prop, but left it undefined by default, so the native `<button>` fell back to the browser's own default of `type="submit"`. Any `Button` or `IconButton` rendered inside a `<form>` without an explicit `htmlType` would submit that form on click. Consumers who want a submit button still set `htmlType="submit"` explicitly.
diff --git a/src/components/Button/Button.test.tsx b/src/components/Button/Button.test.tsx
index e9aa762f8..f72ef8a4f 100644
--- a/src/components/Button/Button.test.tsx
+++ b/src/components/Button/Button.test.tsx
@@ -121,7 +121,7 @@ describe('Button', () => {
   });
 
   describe('Button HTML types', () => {
-    it('should not default to any type when consumer does not specify it, thus behaving as type=submit', () => {
+    it('should default to type=button so it does not submit an enclosing form', () => {
       const handleSubmit = vi.fn();
 
       const { getByRole } = renderCUI(
@@ -132,8 +132,23 @@ describe('Button', () => {
 
       const button = getByRole('button');
 
+      expect(button).toHaveAttribute('type', 'button');
+      fireEvent.click(button);
       expect(handleSubmit).not.toHaveBeenCalled();
+    });
+
+    it('should submit an enclosing form when htmlType="submit" is set explicitly', () => {
+      const handleSubmit = vi.fn(e => e.preventDefault());
+
+      const { getByRole } = renderCUI(
+        <form onSubmit={handleSubmit}>
+          <Button htmlType="submit" />
+        </form>
+      );
+
+      const button = getByRole('button');
       fireEvent.click(button);
+
       expect(handleSubmit).toHaveBeenCalled();
     });
 
diff --git a/src/components/Button/Button.tsx b/src/components/Button/Button.tsx
index 98858af42..9e36ecbb3 100644
--- a/src/components/Button/Button.tsx
+++ b/src/components/Button/Button.tsx
@@ -33,7 +33,7 @@ export const Button = forwardRef<HTMLButtonElement, ButtonProps>(
   (
     {
       type = 'primary',
-      htmlType,
+      htmlType = 'button',
       iconLeft,
       iconRight,
       align = 'center',
diff --git a/src/components/IconButton/IconButton.test.tsx b/src/components/IconButton/IconButton.test.tsx
index 8486ae67d..879f56c6f 100644
--- a/src/components/IconButton/IconButton.test.tsx
+++ b/src/components/IconButton/IconButton.test.tsx
@@ -40,7 +40,7 @@ describe('Button', () => {
   });
 
   describe('Button HTML types', () => {
-    it('should not default to any type when consumer does not specify it, thus behaving as type=submit', () => {
+    it('should default to type=button so it does not submit an enclosing form', () => {
       const handleSubmit = vi.fn();
 
       const { getByRole } = renderCUI(
@@ -51,8 +51,23 @@ describe('Button', () => {
 
       const button = getByRole('button');
 
+      expect(button).toHaveAttribute('type', 'button');
+      fireEvent.click(button);
       expect(handleSubmit).not.toHaveBeenCalled();
+    });
+
+    it('should submit an enclosing form when htmlType="submit" is set explicitly', () => {
+      const handleSubmit = vi.fn(e => e.preventDefault());
+
+      const { getByRole } = renderCUI(
+        <form onSubmit={handleSubmit}>
+          <IconButton icon="user" htmlType="submit" />
+        </form>
+      );
+
+      const button = getByRole('button');
       fireEvent.click(button);
+
       expect(handleSubmit).toHaveBeenCalled();
     });
 
diff --git a/src/components/IconButton/IconButton.tsx b/src/components/IconButton/IconButton.tsx
index c697422c8..d91a8b338 100644
--- a/src/components/IconButton/IconButton.tsx
+++ b/src/components/IconButton/IconButton.tsx
@@ -26,7 +26,7 @@ const iconButtonVariants = cva(styles.iconbutton, {
 });
 
 export const IconButton = forwardRef<HTMLButtonElement, IconButtonProps>(
-  ({ type = 'primary', htmlType, icon, size, disabled, className, ...props }, ref) => {
+  ({ type = 'primary', htmlType = 'button', icon, size, disabled, className, ...props }, ref) => {
     const iconName = icon ? icon.toString() : 'unknown icon';
 
     return (

From 8fade1cbdf665ae664e43fc3aaf016ed4c5f77ae Mon Sep 17 00:00:00 2001
From: munzzyy <colemunz@gmail.com>
Date: Mon, 6 Jul 2026 12:24:45 -0500
Subject: [PATCH 2/3] fix(SplitButton): default htmlType to button; mark
 release as minor

Extends the Button/IconButton fix to SplitButton, which has the same
submit-by-default gap. Bumped the changeset from patch to minor since
defaulting htmlType is a behavior change for any consumer relying on
the old default-submit fallback.
---
 .changeset/fix-button-htmltype-default.md     |  6 ++--
 .../SplitButton/SplitButton.test.tsx          | 36 +++++++++++++++++++
 src/components/SplitButton/SplitButton.tsx    |  2 +-
 3 files changed, 41 insertions(+), 3 deletions(-)

diff --git a/.changeset/fix-button-htmltype-default.md b/.changeset/fix-button-htmltype-default.md
index e6696f930..f3182c835 100644
--- a/.changeset/fix-button-htmltype-default.md
+++ b/.changeset/fix-button-htmltype-default.md
@@ -1,5 +1,7 @@
 ---
-'@clickhouse/click-ui': patch
+'@clickhouse/click-ui': minor
 ---
 
-Default `htmlType` to `"button"` on `Button` and `IconButton`. Both components already accepted an `htmlType` prop, but left it undefined by default, so the native `<button>` fell back to the browser's own default of `type="submit"`. Any `Button` or `IconButton` rendered inside a `<form>` without an explicit `htmlType` would submit that form on click. Consumers who want a submit button still set `htmlType="submit"` explicitly.
+Default `htmlType` to `"button"` on `Button`, `IconButton`, and `SplitButton`. All three already accepted an `htmlType` prop, but left it undefined by default, so the native `<button>` fell back to the browser's own default of `type="submit"`. Any of these rendered inside a `<form>` without an explicit `htmlType` would submit that form on click.
+
+**This is a behavior change, not just a bugfix.** If your app relied on the old (buggy) default-submit behavior — for example a `Button` inside a `<form>` that you expected to submit without ever passing `htmlType="submit"` — set `htmlType="submit"` explicitly to keep that behavior. Marked as a minor release rather than patch because of this risk.
diff --git a/src/components/SplitButton/SplitButton.test.tsx b/src/components/SplitButton/SplitButton.test.tsx
index 96c7f7ad6..cc312494f 100644
--- a/src/components/SplitButton/SplitButton.test.tsx
+++ b/src/components/SplitButton/SplitButton.test.tsx
@@ -201,6 +201,24 @@ describe('SplitButton', () => {
       }
     );
 
+    it('defaults to type=button so it does not submit an enclosing form', () => {
+      const handleSubmit = vi.fn(e => e.preventDefault());
+      const { getByText } = renderCUI(
+        <form onSubmit={handleSubmit}>
+          <SplitButton menu={menuItems}>
+            <div>SplitButton Main Trigger</div>
+          </SplitButton>
+        </form>
+      );
+
+      const button = getByText('SplitButton Main Trigger').closest('button');
+      expect(button).toHaveAttribute('type', 'button');
+
+      fireEvent.click(getByText('SplitButton Main Trigger'));
+
+      expect(handleSubmit).not.toHaveBeenCalled();
+    });
+
     it('does not submit an enclosing form when htmlType="button"', () => {
       const handleSubmit = vi.fn(e => e.preventDefault());
       const { getByText } = renderCUI(
@@ -218,5 +236,23 @@ describe('SplitButton', () => {
 
       expect(handleSubmit).not.toHaveBeenCalled();
     });
+
+    it('submits an enclosing form when htmlType="submit" is set explicitly', () => {
+      const handleSubmit = vi.fn(e => e.preventDefault());
+      const { getByText } = renderCUI(
+        <form onSubmit={handleSubmit}>
+          <SplitButton
+            menu={menuItems}
+            htmlType="submit"
+          >
+            <div>SplitButton Main Trigger</div>
+          </SplitButton>
+        </form>
+      );
+
+      fireEvent.click(getByText('SplitButton Main Trigger'));
+
+      expect(handleSubmit).toHaveBeenCalled();
+    });
   });
 });
diff --git a/src/components/SplitButton/SplitButton.tsx b/src/components/SplitButton/SplitButton.tsx
index ecd503ac2..a8a25075f 100644
--- a/src/components/SplitButton/SplitButton.tsx
+++ b/src/components/SplitButton/SplitButton.tsx
@@ -8,7 +8,7 @@ import { SplitButtonProps, Menu, ButtonType } from './SplitButton.types';
 
 export const SplitButton = ({
   type = 'primary',
-  htmlType,
+  htmlType = 'button',
   disabled,
   menu,
   dir,

From 792339da0f483d68e34e689a19f1e8c9485bbe47 Mon Sep 17 00:00:00 2001
From: Cole Munz <colemunz@gmail.com>
Date: Thu, 9 Jul 2026 21:13:48 -0500
Subject: [PATCH 3/3] fix(changeset): bump htmlType default change to major

Ran the changeset through this repo's own version tool: bumping a
0.9.0 package with a 'major' changeset produces 1.0.0, not a clamped
0.10.0 - there's no pre-1.0 downgrade in .changeset/config.json, so
changesets applies semver.inc('0.9.0', 'major') straight. Went with
major anyway per review since minor undersold the risk, and called
that consequence out in the changeset body so it's not a surprise at
release time.

Rewrote the migration note to name who's affected (a Button,
IconButton, or SplitButton inside a form that relied on the old
implicit type=submit) and the one-line fix (pass htmlType="submit").
---
 .changeset/fix-button-htmltype-default.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/.changeset/fix-button-htmltype-default.md b/.changeset/fix-button-htmltype-default.md
index f3182c835..d125236ee 100644
--- a/.changeset/fix-button-htmltype-default.md
+++ b/.changeset/fix-button-htmltype-default.md
@@ -1,7 +1,7 @@
 ---
-'@clickhouse/click-ui': minor
+'@clickhouse/click-ui': major
 ---
 
 Default `htmlType` to `"button"` on `Button`, `IconButton`, and `SplitButton`. All three already accepted an `htmlType` prop, but left it undefined by default, so the native `<button>` fell back to the browser's own default of `type="submit"`. Any of these rendered inside a `<form>` without an explicit `htmlType` would submit that form on click.
 
-**This is a behavior change, not just a bugfix.** If your app relied on the old (buggy) default-submit behavior — for example a `Button` inside a `<form>` that you expected to submit without ever passing `htmlType="submit"` — set `htmlType="submit"` explicitly to keep that behavior. Marked as a minor release rather than patch because of this risk.
+**Breaking change.** This affects any consumer with a `Button`, `IconButton`, or `SplitButton` inside a `<form>` that relied on the old default-submit behavior — i.e. you never passed `htmlType` and expected a click to submit the form anyway. To keep that behavior, pass `htmlType="submit"` explicitly on the affected button.