[React Doctor] Collapsed w-N h-N to size-N across 8 files

[github-actions]

Collapsed w-N h-N to size-N across 8 files — Tailwind v3.4 single-axis shorthand for square sizing, identical CSS output

The size-N utility ships both width and height from one token, so w-3 h-3 → size-3 and h-[18px] w-[18px] → size-[18px] produce byte-identical CSS. The rule only fires when both axes match (w-1/2 won't collapse; responsive prefixes suppress it).

Changes

• apps/e2e-app/src/App.tsx:309 — design-no-redundant-size-axes: w-12 h-12 → size-12 (gradient div)
• apps/e2e-app/src/App.tsx:336 — design-no-redundant-size-axes: w-8 h-8 → size-8 (animated-pulse)
• apps/e2e-app/src/App.tsx:339 — design-no-redundant-size-axes: w-8 h-8 → size-8 (animated-spin)
• apps/e2e-app/src/App.tsx:340 — design-no-redundant-size-axes: w-8 h-8 → size-8 (animated-bounce)
• apps/e2e-app/src/App.tsx:351 — design-no-redundant-size-axes: w-0 h-0 → size-0 (zero-size-element)
• apps/website/components/mobile-demo-animation.tsx:753 — design-no-redundant-size-axes: h-5 w-5 → size-5 (activity-row dot)
• apps/website/components/mobile-demo-animation.tsx:840 — design-no-redundant-size-axes: h-0 w-0 → size-0 (chart-label arrow)
• apps/website/components/github-button.tsx:17 — design-no-redundant-size-axes: h-[18px] w-[18px] → size-[18px] (GitHub icon)
• apps/website/components/homepage-demo.tsx:256 — design-no-redundant-size-axes: h-3 w-3 → size-3 (tooltip arrow)
• apps/website/components/ui/collapsible.tsx:49 — design-no-redundant-size-axes: w-3 h-3 → size-3 (ChevronDown)
• apps/website/components/ui/collapsible.tsx:51 — design-no-redundant-size-axes: w-3 h-3 → size-3 (ChevronRight)
• apps/website/components/view-docs-button.tsx:16 — design-no-redundant-size-axes: h-[15px] w-[15px] → size-[15px] (BookOpen icon)
• apps/website-v2/components/ui/navigation-menu.tsx:145 — design-no-redundant-size-axes: h-2 w-2 → size-2 (indicator arrow)
• apps/website-v2/components/ui/chart.tsx:293 — design-no-redundant-size-axes: h-2 w-2 → size-2 (legend swatch)

---

---

Note

Low Risk
Cosmetic class renames only; no logic, APIs, or asymmetric sizing changes.

Overview
This PR replaces paired equal width/height Tailwind classes with size-* across eight files in the e2e app, marketing site, and website-v2 UI kit. Examples include w-12 h-12 → size-12, h-3 w-3 → size-3, and arbitrary squares like h-[18px] w-[18px] → size-[18px].

Touches are limited to className strings on demo fixtures (gradient/animated/zero-size boxes), icons (GithubButton, ViewDocsButton), collapsible chevrons, chart legend swatches, navigation menu indicator diamonds, homepage tooltip carets, and mobile demo placeholders/arrows. Rendered layout should be unchanged; only class lists are shorter.

^{Reviewed by Cursor Bugbot for commit a1bd406. Bugbot is set up for automated code reviews on this repo. Configure here.}

---

Summary by cubic

Collapsed paired Tailwind width/height utilities into size-* across 8 files to remove redundancy with no visual changes. This uses tailwindcss v3.4 shorthand for square elements.

• Refactors
  • Replaced w-N h-N and h-[Npx] w-[Npx] with size-N / size-[Npx] in icons, indicators, and animated elements.
  • Output CSS and behavior are unchanged.
  • Applied only when width and height match; responsive or asymmetric cases were not changed.

^{Written for commit a1bd406. Summary will update on new commits.}

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
react-grab-storybook	Ready	Preview, Comment	May 30, 2026 3:43pm
react-grab-website	Ready	Preview, Comment	May 30, 2026 3:43pm