docs: add v1.0 migration guide (Radix/Ariakit -> Base UI)#734
docs: add v1.0 migration guide (Radix/Ariakit -> Base UI)#734rohanchkrabrty merged 4 commits intomainfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Caution Review failedThe pull request is closed. ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
📝 WalkthroughWalkthroughAdded Suggested reviewers
🚥 Pre-merge checks | ✅ 3✅ Passed checks (3 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (2)
docs/V1-migration.md (2)
730-730: Fix table formatting in Removed Exports.The link format in this table row is inconsistent with the rows above. The pattern should match other entries.
✨ Proposed fix for consistency
-| `RadioItem` | `Radio` | See Radio | +| `RadioItem` | `Radio` | See [Radio](`#radio`) |🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/V1-migration.md` at line 730, The table row under "Removed Exports" uses inconsistent link/formatting for RadioItem -> Radio; update the row to match the pattern used by other entries by making the first column code-formatted `RadioItem`, the second column code-formatted `Radio`, and the third column a markdown inline link to the Radio section (e.g., [Radio](`#radio`)) so the row follows the same three-column pattern as other entries in the Removed Exports table.
736-736: Document CSS import order requirement earlier in the guide.This checklist item mentions updating CSS import order (
normalize.cssbeforestyle.css), but this requirement isn't explained in the Prerequisites or Cross-Cutting Changes sections. Consider adding a dedicated section explaining why this order matters and what issues might occur if it's incorrect.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/V1-migration.md` at line 736, Add a short explanatory subsection earlier in the guide (e.g., under Prerequisites or Cross-Cutting Changes) that documents the CSS import order requirement: state that normalize.css must be imported before style.css, explain briefly that normalize.css resets/normalizes browser defaults and must come first so project styles in style.css can override defaults, and list the potential issues when reversed (unexpected layout, broken base styles, specificity/override surprises) along with a quick example reminder to update imports in main CSS/JS entry points.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/V1-migration.md`:
- Line 54: Remove the malformed TOC table row that references `RadioItem` and
`Radio` (the line "- [| `RadioItem` | `Radio` | See Radio
|](`#-radioitem--radio--see-radio-`)" ), as it belongs to the "Removed Exports"
table rather than the document TOC; delete that line from the Table of Contents
so only actual section headings are listed and ensure no other table rows are
accidentally included as TOC entries.
- Around line 225-231: The code block showing the Checkbox example is missing
the closing triple backticks and the section separator before the next section;
update the snippet around Checkbox.Group / Checkbox / setSelected to add the
closing ``` after the example and insert the separator `---` (and the following
"### Combobox" heading) before the next code block so the docs render correctly.
---
Nitpick comments:
In `@docs/V1-migration.md`:
- Line 730: The table row under "Removed Exports" uses inconsistent
link/formatting for RadioItem -> Radio; update the row to match the pattern used
by other entries by making the first column code-formatted `RadioItem`, the
second column code-formatted `Radio`, and the third column a markdown inline
link to the Radio section (e.g., [Radio](`#radio`)) so the row follows the same
three-column pattern as other entries in the Removed Exports table.
- Line 736: Add a short explanatory subsection earlier in the guide (e.g., under
Prerequisites or Cross-Cutting Changes) that documents the CSS import order
requirement: state that normalize.css must be imported before style.css, explain
briefly that normalize.css resets/normalizes browser defaults and must come
first so project styles in style.css can override defaults, and list the
potential issues when reversed (unexpected layout, broken base styles,
specificity/override surprises) along with a quick example reminder to update
imports in main CSS/JS entry points.
🪄 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
Run ID: 85bae522-4e84-40b8-ab3d-3d0b23acc59b
📒 Files selected for processing (1)
docs/V1-migration.md
| - [New Features](#new-features-9) | ||
| - [New Components](#new-components) | ||
| - [Removed Exports](#removed-exports) | ||
| - [| `RadioItem` | `Radio` | See Radio |](#-radioitem--radio--see-radio-) |
There was a problem hiding this comment.
Remove malformed TOC entry.
This line appears to be a table row that was mistakenly included in the Table of Contents. TOC entries should only reference section headings, not table rows from the "Removed Exports" section.
🧹 Proposed fix
-- [| `RadioItem` | `Radio` | See Radio |](`#-radioitem--radio--see-radio-`)📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| - [| `RadioItem` | `Radio` | See Radio |](#-radioitem--radio--see-radio-) |
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@docs/V1-migration.md` at line 54, Remove the malformed TOC table row that
references `RadioItem` and `Radio` (the line "- [| `RadioItem` | `Radio` | See
Radio |](`#-radioitem--radio--see-radio-`)" ), as it belongs to the "Removed
Exports" table rather than the document TOC; delete that line from the Table of
Contents so only actual section headings are listed and ensure no other table
rows are accidentally included as TOC entries.
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (1)
docs/V1-migration.md (1)
56-56:⚠️ Potential issue | 🟡 MinorRemove malformed TOC entry for a table row.
Line 56 is not a section heading link; it’s a table row from “Removed Exports” and produces an invalid fragment.
🧹 Proposed fix
- - [| `RadioItem` | `Radio` | See Radio |](`#-radioitem--radio--see-radio-`)🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@docs/V1-migration.md` at line 56, The TOC contains a malformed entry created from a table row ("RadioItem" / "Radio") which produces an invalid fragment; remove the offending TOC line referring to `RadioItem` and `Radio` (the "- [| `RadioItem` | `Radio` | See Radio |](`#-radioitem--radio--see-radio-`)" entry) or replace it with a proper section link that points to an actual heading (e.g., link to the "Radio" section) so the table row no longer appears as a broken TOC item.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In `@docs/V1-migration.md`:
- Around line 726-733: The Markdown table ending with the row mapping
`RadioItem` -> `Radio` needs a blank line before the following horizontal rule
(`---`) to satisfy markdownlint; insert a single empty line between the end of
the table and the `---` horizontal rule so the table is properly terminated and
the document renders correctly.
---
Duplicate comments:
In `@docs/V1-migration.md`:
- Line 56: The TOC contains a malformed entry created from a table row
("RadioItem" / "Radio") which produces an invalid fragment; remove the offending
TOC line referring to `RadioItem` and `Radio` (the "- [| `RadioItem` | `Radio` |
See Radio |](`#-radioitem--radio--see-radio-`)" entry) or replace it with a proper
section link that points to an actual heading (e.g., link to the "Radio"
section) so the table row no longer appears as a broken TOC item.
🪄 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
Run ID: 4a92859b-e5ec-4cff-ade4-2230c2cb8846
📒 Files selected for processing (1)
docs/V1-migration.md
| | Old Export | Replacement | Notes | | ||
| |-----------|-------------|-------| | ||
| | `DropdownMenu` | `Menu` | See [DropdownMenu -> Menu](#dropdownmenu---menu) | | ||
| | `Sheet` | `Drawer` | See [Sheet -> Drawer](#sheet---drawer) | | ||
| | `ToastContainer` | `Toast.Provider` | See [Toast](#toast) | | ||
| | `toast` (function) | `toastManager` (object) | See [Toast](#toast) | | ||
| | `RadioItem` | `Radio` | See [Radio](#radio) | | ||
| --- |
There was a problem hiding this comment.
Add a blank line after the table for valid Markdown structure.
Add an empty line between the table ending at Line 732 and the horizontal rule at Line 733 to satisfy markdownlint and avoid renderer inconsistencies.
📝 Proposed fix
| `ToastContainer` | `Toast.Provider` | See [Toast](`#toast`) |
| `toast` (function) | `toastManager` (object) | See [Toast](`#toast`) |
| `RadioItem` | `Radio` | See [Radio](`#radio`) |
+
---📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| | Old Export | Replacement | Notes | | |
| |-----------|-------------|-------| | |
| | `DropdownMenu` | `Menu` | See [DropdownMenu -> Menu](#dropdownmenu---menu) | | |
| | `Sheet` | `Drawer` | See [Sheet -> Drawer](#sheet---drawer) | | |
| | `ToastContainer` | `Toast.Provider` | See [Toast](#toast) | | |
| | `toast` (function) | `toastManager` (object) | See [Toast](#toast) | | |
| | `RadioItem` | `Radio` | See [Radio](#radio) | | |
| --- | |
| | Old Export | Replacement | Notes | | |
| |-----------|-------------|-------| | |
| | `DropdownMenu` | `Menu` | See [DropdownMenu -> Menu](`#dropdownmenu---menu`) | | |
| | `Sheet` | `Drawer` | See [Sheet -> Drawer](`#sheet---drawer`) | | |
| | `ToastContainer` | `Toast.Provider` | See [Toast](`#toast`) | | |
| | `toast` (function) | `toastManager` (object) | See [Toast](`#toast`) | | |
| | `RadioItem` | `Radio` | See [Radio](`#radio`) | | |
| --- | |
🧰 Tools
🪛 markdownlint-cli2 (0.22.0)
[warning] 732-732: Tables should be surrounded by blank lines
(MD058, blanks-around-tables)
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.
In `@docs/V1-migration.md` around lines 726 - 733, The Markdown table ending with
the row mapping `RadioItem` -> `Radio` needs a blank line before the following
horizontal rule (`---`) to satisfy markdownlint; insert a single empty line
between the end of the table and the `---` horizontal rule so the table is
properly terminated and the document renders correctly.
2 participants
Summary
asChild→render, callback signature updates, data attribute renames, CSS variable renames