feat(dapp-kit): add CSS variables for connect button sizing and layout

[Dru1DD]

Description

This PR adds additional CSS custom properties to mysten-dapp-kit-connect-button to allow consumers to customize button sizing and layout while preserving Shadow DOM encapsulation.

The change follows the existing --dapp-kit-* theming pattern and does not introduce any breaking changes or API modifications.

New CSS variables for the connect button:

--dapp-kit-button-height

--dapp-kit-button-min-width

--dapp-kit-button-padding-x

--dapp-kit-button-padding-y

--dapp-kit-button-radius

These variables are defined with sensible defaults and can be overridden by consumers to better integrate the button into custom layouts and design systems.

Why?

Currently, consumers have limited control over the visual dimensions of the connect button (padding, height, radius), which makes integration into existing UI systems difficult.

This approach:

1. Keeps Shadow DOM encapsulation intact
2. Avoids the need for deep selectors or ::part overrides
3. Aligns with the existing theming strategy used throughout dApp Kit

Example of usage

<mysten-dapp-kit-connect-button
	style="
		--dapp-kit-button-height: 48px;
		--dapp-kit-button-padding-x: 24px;
		--dapp-kit-button-radius: 999px;
	"
></mysten-dapp-kit-connect-button>

Backward compatibility

• No breaking changes
• Default appearance remains unchanged unless variables are overridden

---

AI Assistance Notice

Please disclose the usage of AI. This is primarily to help inform reviewers of how careful they need to review PRs, and to keep track of AI usage across our team. Please fill this out accurately, and do not modify the content or heading for this section!

• This PR was primarily written by AI.
• I used AI for docs / tests, but manually wrote the source code.
• I used AI to understand the problem space / repository.
• I did not use AI for this PR.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
sui-typescript-docs	Ignored	Preview	Feb 11, 2026 1:30pm

[williamrobertson13]

Thanks for the contribution! I think #888 is probably more aligned with the direction we want to go. Exposing a few extra CSS variables is easy enough, but we'd ideally like to keep the theme set relatively contained and simple. I think styling the exposed ::part makes sense for small one-off tweaks where you don't want to have to create a whole custom dropdown menu and connect button. cc @hayes-mysten