fix: datepicker to emit onErrorChange instead of built-in error UI - #881
Open
rohanchkrabrty wants to merge 5 commits into
Open
fix: datepicker to emit onErrorChange instead of built-in error UI#881rohanchkrabrty wants to merge 5 commits into
rohanchkrabrty wants to merge 5 commits into
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Plus Run ID: 📒 Files selected for processing (8)
💤 Files with no reviewable changes (4)
🚧 Files skipped from review as they are similar to previous changes (4)
📝 WalkthroughWalkthroughDatePicker now exposes an optional Sequence Diagram(s)sequenceDiagram
participant User
participant DatePicker
participant Consumer
participant Field
User->>DatePicker: Type date
DatePicker->>Consumer: onErrorChange("Invalid date")
Consumer->>Field: Set error
User->>DatePicker: Correct date or select date
DatePicker->>Consumer: onErrorChange(undefined)
Consumer->>Field: Clear error
Suggested reviewers: 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
commit: |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
packages/raystack/components/calendar/__tests__/date-picker.test.tsx (1)
556-568: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick winAssert
onSelectsuppression for an invalid Enter commit.This test verifies error clearing only. Pass an
onSelectspy and assert that it has no calls. Otherwise, a regression inif (!hadError && committedDate)can pass this test.Proposed test update
it('fires with undefined when the picker commits via Enter with invalid text', () => { const onErrorChange = vi.fn(); + const onSelect = vi.fn(); render( - <DatePicker dateFormat='DD/MM/YYYY' onErrorChange={onErrorChange} /> + <DatePicker + dateFormat='DD/MM/YYYY' + onErrorChange={onErrorChange} + onSelect={onSelect} + /> ); // ... expect(onErrorChange).toHaveBeenLastCalledWith(undefined); + expect(onSelect).not.toHaveBeenCalled(); });🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/raystack/components/calendar/__tests__/date-picker.test.tsx` around lines 556 - 568, Update the invalid-Enter test around the DatePicker render to provide an onSelect spy, then assert that it has not been called after submitting invalid text. Keep the existing onErrorChange assertion so the test covers both error clearing and suppression of selection for an invalid commit.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@packages/raystack/components/calendar/date-picker.tsx`:
- Around line 100-106: Update the controlled value synchronization path in
date-picker.tsx to clear the existing error via updateError(undefined) when a
new value replaces invalid typed text. Add a test in
packages/raystack/components/calendar/__tests__/date-picker.test.tsx covering
invalid input followed by rerendering with a new controlled value and asserting
onErrorChange(undefined).
- Around line 50-58: Wire DatePicker’s onErrorChange state through the trigger
input so Field’s invalid/error state reaches the rendered input, including the
required aria-invalid/aria-describedby behavior; update the DatePicker
implementation at packages/raystack/components/calendar/date-picker.tsx lines
221-240 and its API documentation/examples at
apps/www/src/content/docs/components/calendar/props.ts lines 268-276 and
apps/www/src/content/docs/components/calendar/demo.ts lines 187-206. If this
integration cannot be completed, remove the onErrorChange guarantee from the
API/docs and examples at all listed sites.
---
Nitpick comments:
In `@packages/raystack/components/calendar/__tests__/date-picker.test.tsx`:
- Around line 556-568: Update the invalid-Enter test around the DatePicker
render to provide an onSelect spy, then assert that it has not been called after
submitting invalid text. Keep the existing onErrorChange assertion so the test
covers both error clearing and suppression of selection for an invalid commit.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: 9dad2056-24b9-4e04-95db-62fdb7fde279
📒 Files selected for processing (5)
apps/www/src/content/docs/components/calendar/demo.tsapps/www/src/content/docs/components/calendar/props.tspackages/raystack/components/calendar/__tests__/date-picker.test.tsxpackages/raystack/components/calendar/calendar.module.csspackages/raystack/components/calendar/date-picker.tsx
💤 Files with no reviewable changes (1)
- packages/raystack/components/calendar/calendar.module.css
rohilsurana
reviewed
Aug 6, 2026
rohilsurana
reviewed
Aug 6, 2026
Contributor
|
Note GitHub couldn't provide a complete incremental comparison for this pull request, so CodeRabbit is performing a full review instead. This review may take a little longer. |
rohilsurana
approved these changes
Aug 6, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
onErrorChange?: (error: string | undefined) => voidtoDatePicker— fires on typed-input validity transitions only (a message when the text stops parsing as a valid in-bounds date,undefinedwhen it recovers or the picker commits/closes), mirroring theonOpenChangeconvention.role="alert"span, its reserved-line CSS, and thearia-invalid/aria-describedbywiring. Error display is now consumer-owned: lift the callback intoField'serrorprop (which also wiresaria-invalidvia Base UI) or a form library. Breaking for consumers relying on the built-in message.onErrorChangeand add coverage for transition-only firing, clearing on recovery/commit, and a no-error-UI regression test.onErrorChangein the props reference and add a "With Field" live example to the DatePicker demos.