Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
📝 WalkthroughWalkthroughComponents refactored from Radix UI's Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches
🧪 Generate unit tests (beta)
Comment |
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/raystack/components/button/button.tsx (1)
143-175:⚠️ Potential issue | 🟠 MajorRespect consumer-supplied
nativeButtonandfocusableWhenDisabled.These props are currently overridden, so callers can’t opt into native-button semantics with
renderor control focus behavior when disabled.🔧 Proposed fix
( { className, variant = 'solid', color = 'accent', size = 'normal', disabled, loading, loaderText, leadingIcon, trailingIcon, maxWidth, width, style = {}, children, render, + nativeButton, + focusableWhenDisabled, ...props }, ref ) => { const isLoaderOnly = loading && !loaderText; const widthStyle = { maxWidth, width }; const buttonStyle = { ...widthStyle, ...style }; + const resolvedNativeButton = nativeButton ?? !render; + const resolvedFocusableWhenDisabled = + focusableWhenDisabled ?? Boolean(loading); return ( <ButtonPrimitive className={`${button({ variant, size, color, disabled, loading, className })} ${isLoaderOnly ? getLoaderOnlyClass(size) : ''}`} ref={ref} disabled={disabled} style={buttonStyle} render={render} - nativeButton={!render} - focusableWhenDisabled={loading} + nativeButton={resolvedNativeButton} + focusableWhenDisabled={resolvedFocusableWhenDisabled} {...props} >🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@packages/raystack/components/button/button.tsx` around lines 143 - 175, The ButtonPrimitive currently forces nativeButton and focusableWhenDisabled values and can override consumer intent; instead compute values that respect consumer-supplied props (e.g., const nativeButtonVal = props.nativeButton ?? !render and const focusableWhenDisabledVal = props.focusableWhenDisabled ?? loading) and pass those computed values to ButtonPrimitive (nativeButton={nativeButtonVal} focusableWhenDisabled={focusableWhenDisabledVal}), ensuring you reference ButtonPrimitive, render, loading, nativeButton and focusableWhenDisabled so the component uses consumer values when provided and only falls back to the defaults.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Outside diff comments:
In `@packages/raystack/components/button/button.tsx`:
- Around line 143-175: The ButtonPrimitive currently forces nativeButton and
focusableWhenDisabled values and can override consumer intent; instead compute
values that respect consumer-supplied props (e.g., const nativeButtonVal =
props.nativeButton ?? !render and const focusableWhenDisabledVal =
props.focusableWhenDisabled ?? loading) and pass those computed values to
ButtonPrimitive (nativeButton={nativeButtonVal}
focusableWhenDisabled={focusableWhenDisabledVal}), ensuring you reference
ButtonPrimitive, render, loading, nativeButton and focusableWhenDisabled so the
component uses consumer values when provided and only falls back to the
defaults.
Description
[Provide a brief description of the changes in this PR]
Type of Change
How Has This Been Tested?
[Describe the tests that you ran to verify your changes]
Checklist:
Screenshots (if appropriate):
[Add screenshots here]
Related Issues
[Link any related issues here using #issue-number]
Summary by CodeRabbit
Release Notes
New Features
renderprop to Button, Flex, Grid, and GridItem components for flexible element rendering.nativeButtonandfocusableWhenDisabledoptions to Button component.width: 'full'option to Flex component.Bug Fixes
Breaking Changes
asChildprop from Button, Grid, and GridItem components; use the newrenderprop instead.