Alexander Brown
1ab63807e9
fix: reserve scrollbar gutter on textareas to prevent hover reflow (#12280)
*PR Created by the Glary-Bot Agent*
---
Adds the Tailwind 4.3 `scrollbar-gutter-stable` utility to the shared
shadcn `Textarea` wrapper and the `ModelInfoPanel` description textarea
so the layout no longer shifts when a vertical scrollbar appears on
hover or focus.
The wrapper edit propagates to all four consumers (`WidgetTextarea`,
`WidgetMarkdown`, `ComfyHubDescribeStep`, `ComfyHubCreateProfileForm`).
The `ModelInfoPanel` site uses a native `<textarea>` that bypasses the
wrapper, so it is fixed inline.
The `overflow-hidden hover:overflow-auto` performance pattern from
#10804 is intentionally preserved.
## Verification
- Typecheck, eslint, oxlint, oxfmt, stylelint clean on changed files
- `Textarea.test.ts`, `WidgetTextarea.test.ts`,
`WidgetMarkdown.test.ts`, `ComfyHubDescribeStep.test.ts`,
`ModelInfoPanel.test.ts` — all 68 tests pass
- `pnpm build` succeeds; the production CSS bundle contains the
`scrollbar-gutter:stable` rule
- Storybook (`UI/Textarea`): confirmed
`getComputedStyle(textarea).scrollbarGutter === 'stable'` on Default,
WithLabel, and overflowing-content scenarios
Fixes FE-697
## Screenshots


┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-12280-fix-reserve-scrollbar-gutter-on-textareas-to-prevent-hover-reflow-3606d73d3650816f9947e20134abf59e)
by [Unito](https://www.unito.io)
---------
Co-authored-by: Glary-Bot <glary-bot@users.noreply.github.com>
Co-authored-by: github-actions <github-actions@github.com>
2026-05-15 01:48:35 +00:00
..
2026-04-28 08:52:49 +00:00
2026-04-19 04:58:34 +00:00
2026-03-15 22:46:47 +09:00
2026-03-15 22:46:47 +09:00
2026-05-08 12:11:06 +00:00
2025-12-29 15:03:34 -08:00
2026-03-27 09:11:26 +09:00
2026-03-15 22:46:47 +09:00
2026-03-28 13:08:52 -07:00
2026-05-06 02:40:01 +00:00
2026-05-14 20:06:51 +00:00
2026-05-04 20:25:55 -04:00
2026-05-06 02:40:01 +00:00
2026-03-15 22:46:47 +09:00
2026-03-27 16:04:36 -04:00
2026-03-28 23:19:04 -07:00
2026-05-12 20:33:05 +00:00
2026-05-11 18:51:52 +00:00
2025-12-08 19:48:11 -07:00
2026-03-15 22:46:47 +09:00
2025-12-08 19:48:11 -07:00
2026-04-13 00:13:04 -04:00
2026-01-16 22:11:00 -07:00
2026-05-14 20:09:48 +00:00
2026-05-14 20:09:48 +00:00
2026-03-15 22:46:47 +09:00
2026-03-15 22:46:47 +09:00
2026-03-24 12:25:18 -07:00
2026-05-06 02:40:01 +00:00
2026-05-14 02:26:11 +00:00
2026-05-13 20:30:45 +00:00
2026-05-13 20:35:57 +00:00
2026-03-29 08:27:53 +09:00
2026-05-07 02:49:02 -07:00
2026-03-27 09:11:26 +09:00
2026-05-15 01:48:35 +00:00
2026-03-15 22:46:47 +09:00
2026-04-16 12:54:12 +00:00
2026-04-28 19:13:12 -04:00
2026-05-07 15:36:32 -07:00
2026-04-28 02:18:31 +00:00
2026-05-07 15:36:32 -07:00
2026-04-10 19:47:20 +00:00
2026-05-14 12:28:21 -07:00
2026-04-28 02:18:31 +00:00
2026-04-15 11:42:22 +00:00
2026-04-15 11:42:22 +00:00
2026-04-28 02:18:31 +00:00
2026-04-10 19:47:20 +00:00
2026-05-12 14:42:31 +00:00
2026-05-07 10:27:15 +00:00
2026-04-08 11:28:59 -07:00
2026-04-14 23:33:11 +00:00
2026-04-28 02:18:31 +00:00
2026-04-13 20:43:25 +00:00
2026-04-16 12:54:12 +00:00
2026-05-14 12:28:21 -07:00
2026-04-28 02:18:31 +00:00
2026-04-28 17:21:55 +00:00
2026-04-15 15:25:47 +00:00
2026-04-28 09:46:25 -04:00
2026-04-16 12:54:12 +00:00
2026-04-16 12:54:12 +00:00
2026-05-05 11:17:30 +00:00
2026-04-13 15:50:11 +00:00
2026-04-16 12:38:01 +00:00
2026-04-15 15:25:47 +00:00
2026-04-09 20:50:56 -07:00
2026-04-08 11:28:59 -07:00
2026-04-08 11:28:59 -07:00
2026-04-16 09:44:06 +00:00
2026-04-13 20:43:25 +00:00
2026-05-12 15:06:13 +09:00
2026-05-08 12:11:06 +00:00
2026-05-13 22:39:32 -07:00
2026-04-11 01:25:14 +00:00
2026-04-28 02:18:31 +00:00
2026-05-01 09:35:29 +00:00
2026-04-10 19:47:20 +00:00
2026-04-13 20:43:25 +00:00
2026-04-11 01:25:14 +00:00
2026-04-20 17:35:17 -07:00
2026-04-16 13:43:02 +09:00
2026-04-11 01:25:14 +00:00
2026-04-15 15:25:47 +00:00
2026-05-04 20:30:42 +00:00
2026-04-15 16:52:41 +00:00
2026-05-04 20:30:42 +00:00
2026-04-20 22:43:28 +00:00
2026-05-12 15:06:13 +09:00
2026-04-15 10:50:44 -04:00
2026-04-16 09:48:13 +00:00
2026-04-09 20:50:56 -07:00
2026-04-15 15:25:47 +00:00
2026-04-14 17:40:23 +00:00
2026-05-05 20:24:13 -07:00
2026-04-10 19:47:20 +00:00
2026-04-09 20:50:56 -07:00
2026-05-04 12:54:52 -07:00
2026-05-05 08:47:07 +00:00
2026-04-14 17:40:23 +00:00
2026-04-28 22:02:42 +00:00
2026-04-08 11:28:59 -07:00
2026-05-13 10:35:16 +00:00
2026-04-09 20:50:56 -07:00
2026-04-28 08:33:42 -04:00
2026-05-04 20:31:15 -04:00
2026-05-04 20:31:15 -04:00
2026-04-13 20:43:25 +00:00
2026-05-13 20:33:19 +00:00
2026-04-23 22:17:16 -04:00
2026-04-15 15:25:47 +00:00
2026-05-11 18:51:52 +00:00
2026-04-15 16:52:41 +00:00
2026-04-11 01:25:14 +00:00
2026-04-30 17:30:04 +00:00
2026-04-28 02:18:31 +00:00
2026-04-13 20:43:25 +00:00
2026-05-04 15:52:33 -07:00
2026-04-15 15:25:47 +00:00
2026-04-29 20:52:58 +00:00
2026-04-28 22:02:33 +00:00
2026-04-23 19:33:18 +00:00
2026-04-08 11:28:59 -07:00
2026-04-13 20:43:25 +00:00
2026-05-13 10:19:39 -04:00
2026-04-13 20:43:25 +00:00
2026-05-06 01:54:18 -07:00
2026-05-06 05:08:35 +00:00
2026-04-08 11:28:59 -07:00
2026-05-06 15:07:57 +00:00
2026-05-02 05:40:45 +00:00
2026-04-10 19:47:20 +00:00
2026-04-13 20:43:25 +00:00
2026-04-13 20:43:25 +00:00
2026-04-08 11:28:59 -07:00
2026-04-14 17:40:23 +00:00
2026-04-14 17:40:23 +00:00
2026-04-15 15:25:47 +00:00
2026-04-28 09:46:25 -04:00
2026-05-06 02:40:01 +00:00
2026-04-28 02:18:31 +00:00
2026-04-15 15:25:47 +00:00
2026-04-30 16:15:53 -07:00
2026-05-14 02:26:11 +00:00
2026-05-04 20:30:42 +00:00
2026-05-04 20:30:42 +00:00
2026-05-14 02:26:11 +00:00
2026-04-13 20:43:25 +00:00
2026-05-14 15:54:40 -07:00
2026-04-08 11:28:59 -07:00
2026-05-13 19:19:54 +00:00
2026-04-14 17:40:23 +00:00
2026-05-04 12:54:52 -07:00
2026-04-08 11:28:59 -07:00
2026-04-11 01:25:14 +00:00
2026-04-13 20:43:25 +00:00
2026-04-15 15:25:47 +00:00
2026-04-22 11:29:08 -07:00
2026-04-11 01:25:14 +00:00
2026-04-13 22:15:45 +00:00
2026-05-04 21:51:50 +00:00
2026-04-16 12:54:12 +00:00
2026-05-01 09:09:31 +00:00
2026-04-13 20:43:25 +00:00
2026-05-11 09:28:23 +00:00
2026-04-11 01:25:14 +00:00