TextInput: text size ignores `size`; add a `text-input-control` target
- Dominant language
- TypeScript
- Stars
- 13.1k
- Forks
- 1.1k
- Avg merge
- 1d 15h
- Merged PRs (30d)
- 687
Description
**Version**: `@astryxdesign/core` 0.5.2, `@astryxdesign/theme-neutral` 0.5.2
## What I'm seeing
`size="sm" | "md" | "lg"` on `TextInput` changes the height of the control (24 / 32 / 40px via `--size-element-*`) and nothing else. The typed text and the placeholder stay at `--text-body-size` (14px in neutral) in all three. A `sm` input is therefore body-size text squeezed into a 24px box, and an `lg` input is the same 14px text floating in a 40px box.
`TextArea` behaves the same way: `sm` and `md` add no styles to the control at all, `lg` only adds vertical padding.
Quick repro:
```tsx
```
Inspect the three `` elements: computed `font-size` is identical.
## What I'd expect
Two options, in order of preference:
1. **Let typography follow `size`.** Something like `sm → --font-size-sm`, `md → --font-size-base`, `lg → --font-size-lg`, so a compact toolbar search and a hero form field don't share the exact same type. The field label already adapts to the size, so the control is the odd one out.
2. **If keeping the type fixed is intentional, expose a `text-input-control` theme target** on the inner ``, the way 0.5.1 added `text-area-control` for `TextArea`. Right now the only reachable targets are `text-input` (the wrapper), `field` and `field-label`. Setting a font size on the wrapper does nothing because the control sets its own, so a theme has no sanctioned way to adjust this per size. With the target we could decide the scale in our own theme and leave the default alone.
Contributor guide
Research direction
Start with the TextInput and TextArea implementations and compare their size styles with the existing text-area-control target added in 0.5.1. Reproduce the three TextInput sizes and inspect computed font sizes; done means either typography follows sm/md/lg or the inner input exposes a documented text-input-control theme target, with corresponding behavior verified for TextArea.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- typescript
- Domain
- design, frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Active
- Clarity
- Mostly clear
- Newbie friendliness
- 68/100