feat(react): modernize component APIs and layouts#1
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: e44c5ee637
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| <input | ||
| type="hidden" | ||
| name={name} | ||
| {...(form !== undefined ? { form } : {})} | ||
| value={resolvedValue ?? ""} |
There was a problem hiding this comment.
When a Combobox participates in a form via name, this hidden input is the submitted control, but hidden inputs do not participate in constraint validation and the proxy is not disabled. As a result, <Combobox name="plan" required> can submit an empty value instead of blocking, and <Combobox name="plan" disabled> still posts its last value; use a real visually-hidden form control that mirrors required/disabled like Select does, or otherwise propagate those semantics.
Useful? React with 👍 / 👎.
| <DateRangeField | ||
| value={selected.start} | ||
| onCommit={(date) => commit({ start: date, end: selected.end })} |
There was a problem hiding this comment.
When min or max is set, the calendar disables out-of-bounds days, but typed segment edits still call commit directly from DateRangeField without checking minDate/maxDate. A keyboard user can therefore enter and emit dates outside the allowed range through onValueChange and the native date values; apply the same bounds check before committing field edits.
Useful? React with 👍 / 👎.
| onClick={(event: MouseEvent<HTMLElement>) => { | ||
| preventDisabledInteraction(event); | ||
| if (!isDisabled) { | ||
| (providedOnClick as (e: MouseEvent<HTMLElement>) => void)?.(event); | ||
| } |
There was a problem hiding this comment.
When asChild is disabled or loading and the child element has its own onClick or a custom component performs navigation in that handler, Slot composes the child's handler before this Button handler, so the action can run before preventDisabledInteraction is called. Guard in capture phase or compose the disabled handling ahead of the child so disabled asChild buttons are inert.
Useful? React with 👍 / 👎.
1 participant
Why
Modernize Velune component APIs, responsive layouts, accessibility, and bundle architecture while keeping documentation and quality gates aligned.
What Changed
Verification
Visual Evidence
Updated component examples are available in Storybook and the documentation app.
Public API and Release
Migration: replace Stack spacing with Stack gap.
Component Quality
Reviewer Notes
Review the new component APIs, responsive class generation, shared dialog primitive, and in-house interaction implementations most closely.