feat: add useSlot for slot-based component customization

[cheton]

Overview

Introduces useSlot to @tonic-ui/react-hooks as the foundation for the v3 slots/slotProps API. The hook provides a standardized way to define customizable component slots, replacing ad-hoc TransitionComponent/ TransitionProps and PopperComponent/PopperProps props.

• useSlot(name, { slot, slotProps, additionalProps, ref }) returns [ElementType, mergedProps]; slotProps (user) takes precedence over additionalProps (component defaults); refs are merged via useMergeRefs
• Migrates ModalContent as the reference implementation: adds slots/ slotProps props with deprecation warnings for TransitionComponent/ TransitionProps

[codesandbox]

Review or Edit in CodeSandbox

Open the branch in Web Editor • VS Code • Insiders

Open Preview

[changeset-bot]

⚠️ No Changeset found

Latest commit: 2c8cbaa

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
tonic-ui	Ready	Preview, Comment	Apr 5, 2026 4:37am

[codecov]

Bundle Report

Changes will increase total bundle size by 8.1kB (0.27%) ⬆️. This is within the configured threshold ✅

Detailed changes

Bundle name	Size	Change
@tonic-ui/react-cjs	894.37kB	4.09kB (0.46%) ⬆️
@tonic-ui/react-esm	844.31kB	4.0kB (0.48%) ⬆️

Affected Assets, Files, and Routes:

view changes for bundle: @tonic-ui/react-esm

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
modal/ModalContent.js	1.48kB	4.66kB	46.6% ⚠️
utils/useSlot.js (New)	2.52kB	2.52kB	100.0% 🚀

Files in modal/ModalContent.js:

• ./src/modal/ModalContent.js → Total Size: 3.81kB

Files in utils/useSlot.js:

• ./src/utils/useSlot.js → Total Size: 2.27kB

view changes for bundle: @tonic-ui/react-cjs

Assets Changed:

Asset Name	Size Change	Total Size	Change (%)
modal/ModalContent.js	1.48kB	4.8kB	44.34% ⚠️
utils/useSlot.js (New)	2.62kB	2.62kB	100.0% 🚀

Files in modal/ModalContent.js:

• ./src/modal/ModalContent.js → Total Size: 4.11kB

Files in utils/useSlot.js:

• ./src/utils/useSlot.js → Total Size: 2.43kB

[codesandbox-ci]

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

[codecov]

Codecov Report

❌ Patch coverage is 91.66667% with 2 lines in your changes missing coverage. Please review.
✅ Project coverage is 81.65%. Comparing base (d7ae486) to head (2c8cbaa).

Files with missing lines	Patch %	Lines
packages/react/src/modal/ModalContent.js	83.33%	2 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##               v2    #1126      +/-   ##
==========================================
+ Coverage   81.64%   81.65%   +0.01%     
==========================================
  Files         447      448       +1     
  Lines        7572     7589      +17     
  Branches       48       48              
==========================================
+ Hits         6182     6197      +15     
- Misses       1372     1374       +2     
  Partials       18       18              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

[trendmicro-frontend-bot]

Tonic UI Demo

On 2026-04-05 04:42:55 +0000, PR #1126 (2c8cbaa) was successfully deployed. You can view it at the following link:
https://trendmicro-frontend.github.io/tonic-ui-demo/react/pr-1126/