Tonic UI PR

PR Description Generator

Generate well-structured PR descriptions following conventional commits and tonic-ui project conventions. Based on analysis of 885 commits and 721 PRs.

Pre-Work Checklist

CRITICAL: Always complete these steps BEFORE writing PR descriptions

• Run git commands to understand changes — Never write PR descriptions without seeing the actual changes
• Check commit history — Review recent commits to match repository style
• Identify changed files and scope — Determine which packages/components are affected

Run these commands in parallel:

git status              # See all changed files
git diff HEAD           # See all changes
git log --oneline -10   # See recent commit message style

For efficiency: Make all three Bash tool calls in a single message since they're independent.

Scope Rules

If asked to create a changeset for a non-monorepo project, explain that changesets are only used in Tonic UI and Tonic UI monorepos.

PR Title Format

Follow conventional commits:

<type>(<scope>): <short description>

Formatting rules:

• Lowercase first letter after type/scope (87% convention)
• Under 72 characters
• No period at end
• Wrap component/prop/package names in backticks (34% of PRs do this)

Types (by frequency in this repo):

Important — breaking as a type: This repo historically uses breaking: as a standalone type prefix (15 PRs), NOT the conventional feat!: notation. Only 1 PR uses the ! marker.

breaking: deprecate the rarely used FlatButton component
breaking: deprecate the second argument of CheckboxGroup onChange callback
feat(react/date-pickers)!: deprecate Calendar and replace it with DateCalendar  ← only 1 uses !

Scope conventions:

Common scopes: react/menu, react/table, react/scrollbar, react/checkbox, react/toast, react/date-pickers, styled-system, utils, react-hooks, react-icons, theme

Cross-repo references: When porting changes from/to Tonic UI, include [tonic-ui-pr-NNN] in the title.

Examples:

feat(react/scrollbar): add `scrollViewProps` to enable passing custom props
fix(react/menu): correct focus management on keyboard navigation
refactor(styled-system): migrate to semantic color tokens
docs: update `Table` component examples
chore(deps): bump webpack from 5.88.0 to 5.89.0
breaking: deprecate the `FlatButton` component
revert(react/InputGroup): restore pseudo-class styling

PR Body Template

Based on the actual patterns used in recent PRs (not a generic template):

## Summary

Closes #ISSUE_NUMBER (if applicable)

Brief 1-3 sentence description of the change.

Demo: https://trendmicro-frontend.github.io/tonic-ui-demo/react/pr-{PR_NUMBER}/components/{COMPONENT}/

## Changes

- **Component/File**: Description of change
- **Component/File**: Description of change

## Motivation

Why this change was needed. (Optional — include for non-trivial changes)

## Migration

Before/after code examples showing migration path. (Only for breaking changes)

Section usage guide:

• ## Summary — Always include. 1-3 sentences + optional demo link + optional Closes #NNN
• ## Changes — Always include for multi-file changes. Bullet list of what changed where.
• ## Motivation — Include when the "why" isn't obvious from the summary
• ## Migration — Only for breaking changes. Show before/after code examples.

Demo links: ~48% of PRs include a demo link. Format:

https://trendmicro-frontend.github.io/tonic-ui-demo/react/pr-{PR_NUMBER}/components/{COMPONENT}/
https://trendmicro-frontend.github.io/tonic-ui-demo/react/pr-{PR_NUMBER}/hooks/{HOOK_NAME}/

Issue references:

• Closes #NNN or Close #NNN — for GitHub issues (~10% of PRs)
• Related PR: #NNN or Depends on: #NNN — for PR dependencies (~2% of PRs)

What NOT to include:

• ## Testing section — never used in this repo
• Jira ticket references (TVO-XXXX, V1E-XXXX) — not used in this repo
• Figma links — only ~4% of PRs, include only if the user provides one

Changeset Entries

When the change affects a publishable package, generate a changeset file.

File Naming Convention

.changeset/tonic-ui-pr-{PR_NUMBER}.md

For multiple changesets on the same PR, use suffixes:

.changeset/tonic-ui-pr-943a.md
.changeset/tonic-ui-pr-943b.md

Or descriptive suffixes:

.changeset/tonic-ui-pr-987-modal-regression.md
.changeset/tonic-ui-pr-987-react-hooks.md

Changeset Format

---
"@tonic-ui/react": minor
---

feat(react/scrollbar): add `scrollViewProps` to enable passing custom props to the `ScrollView`

Description rules:

• Always single line
• Use conventional commit format matching the PR title
• Wrap component/prop names in backticks
• ~75 characters average length
• This description becomes the changelog entry