Conversation
🦋 Changeset detectedLatest commit: 76f4798 The changes in this PR will be included in the next version bump. This PR includes changesets to release 10 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
@claude --review and add a changeset |
|
TL;DR — Replaces 16 individual Key changes
Summary ｜ 28 files ｜ 6 commits ｜ base: Consolidated Radix dependency
The Migrated namespace imports in UI primitives
Every UI wrapper component that previously used a wildcard namespace import from an individual Radix package now uses a named import aliased to the same
Migrated
|
|
TL;DR — Replaces 16 individual Key changes
Summary ｜ 29 files ｜ 8 commits ｜ base: Consolidated Radix dependency
The Migrated namespace imports in UI primitives
Every UI wrapper component that previously used a wildcard namespace import from an individual Radix package now uses a named import aliased to the same
Migrated
|
There was a problem hiding this comment.
Clean migration from individual @radix-ui/react-* packages to the unified radix-ui package, aligned with the shadcn/ui February 2026 changelog. All 16 individual Radix packages removed, single radix-ui dependency added, no remaining @radix-ui imports in source.
One nit on dependency ordering in package.json.
| "zod": "^4.3.6", | ||
| "zustand": "^5.0.7" | ||
| "zustand": "^5.0.7", | ||
| "radix-ui": "^1.4.3" |
There was a problem hiding this comment.
Nit: radix-ui is placed after zustand, breaking the alphabetical ordering of dependencies. It should sit between prettier and react (around line 92).
This will likely be flagged by format/lint checks as well.
There was a problem hiding this comment.
PR Review Summary
(4) Total Issues | Risk: Low
🟡 Minor (4) 🟡
Inline Comments:
- 🟡 Minor:
color-picker.tsx:30Incorrect sub-component access pattern (PopoverPrimitive.PopoverTrigger→PopoverPrimitive.Trigger) - 🟡 Minor:
color-picker.tsx:38Incorrect closing tag - 🟡 Minor:
color-picker.tsx:41Incorrect sub-component access pattern (PopoverPrimitive.PopoverContent→PopoverPrimitive.Content) - 🟡 Minor:
color-picker.tsx:43Incorrect closing tag
💭 Consider (3) 💭
Inline Comments:
- 💭 Consider:
chat-ui-code.tsx:2Inconsistent import naming (RadixTabsvs*Primitiveconvention) - 💭 Consider:
chat-ui-code.tsx:91-96Direct radix-ui usage bypasses local styled wrapper - 💭 Consider:
skill-selector.tsx:4Inconsistent type import naming (RadixCheckboxvs*Primitiveconvention)
🧹 While You're Here (1) 🧹
🧹 1) package.json:109 Alphabetical ordering
Issue: The radix-ui dependency was added at the end of the dependencies list after zustand, breaking alphabetical ordering.
Why: The rest of dependencies are alphabetically sorted. Maintaining this order helps with readability and reduces merge conflicts.
Fix: Move "radix-ui": "^1.4.3" to its correct position between pino-pretty and react.
💡 APPROVE WITH SUGGESTIONS
Summary: This is a clean migration from individual @radix-ui/react-* packages to the unified radix-ui package following shadcn's guidelines. The core migration is correct. The minor issues are around sub-component naming in color-picker.tsx (using PopoverPrimitive.PopoverTrigger instead of PopoverPrimitive.Trigger) and some naming convention inconsistencies. None are blocking.
Discarded (3)
| Location | Issue | Reason Discarded |
|---|---|---|
info-card.tsx:40-62 |
Using raw CollapsiblePrimitive instead of local wrapper | Pre-existing pattern, not introduced by this PR — migration correctly updated import path |
color-picker.tsx:29-44 |
Using raw Popover primitives instead of styled wrappers | Pre-existing pattern, not introduced by this PR — however the naming issue IS new |
agents-docs/package.json |
Still uses separate @radix-ui packages | Out of scope — this PR is scoped to agents-manage-ui only |
Reviewers (3)
| Reviewer | Returned | Main Findings | Consider | While You're Here | Inline Comments | Pending Recs | Discarded |
|---|---|---|---|---|---|---|---|
pr-review-frontend |
3 | 0 | 0 | 0 | 0 | 0 | 3 |
pr-review-devops |
5 | 0 | 0 | 1 | 0 | 0 | 2 |
pr-review-consistency |
7 | 0 | 3 | 0 | 4 | 0 | 0 |
| Total | 15 | 0 | 3 | 1 | 4 | 0 | 5 |
| <Popover> | ||
| <PopoverTrigger asChild> | ||
| <PopoverPrimitive.Root> | ||
| <PopoverPrimitive.PopoverTrigger asChild> |
There was a problem hiding this comment.
🟡 Minor: Incorrect sub-component access pattern
Issue: Uses PopoverPrimitive.PopoverTrigger and PopoverPrimitive.PopoverContent but the unified radix-ui package exports these as Trigger and Content (without the component prefix).
Why: Looking at the migrated popover.tsx wrapper (line 17), the correct pattern is PopoverPrimitive.Trigger and PopoverPrimitive.Content. This file uses the prefixed versions which may break at runtime if the radix-ui package doesn't export these names.
Fix: Update to use the correct sub-component names, or better yet, import the styled wrappers from @/components/ui/popover:
| <PopoverPrimitive.PopoverTrigger asChild> | |
| <PopoverPrimitive.Trigger asChild> |
Refs:
| </PopoverTrigger> | ||
| <PopoverContent className="flex flex-row w-fit p-2"> | ||
| </PopoverPrimitive.PopoverTrigger> | ||
| <PopoverPrimitive.PopoverContent className="flex flex-row w-fit p-2"> |
There was a problem hiding this comment.
🟡 Minor: Incorrect sub-component access pattern
Fix: Update to use the correct sub-component name:
| <PopoverPrimitive.PopoverContent className="flex flex-row w-fit p-2"> | |
| <PopoverPrimitive.Content className="flex flex-row w-fit p-2"> |
| @@ -37,11 +37,11 @@ export function ColorPickerInput({ placeholder, color, setColor }: ColorPickerIn | |||
| > | |||
| <span className="sr-only">Color picker</span> | |||
There was a problem hiding this comment.
🟡 Minor: Incorrect closing tag
Fix: Update closing tag to match:
| <span className="sr-only">Color picker</span> | |
| </PopoverPrimitive.Trigger> |
| <HexColorPicker color={color} onChange={setColor} /> | ||
| </PopoverContent> | ||
| </Popover> | ||
| </PopoverPrimitive.PopoverContent> |
There was a problem hiding this comment.
🟡 Minor: Incorrect closing tag
Fix: Update closing tag to match:
| </PopoverPrimitive.PopoverContent> | |
| </PopoverPrimitive.Content> |
| @@ -1,5 +1,5 @@ | |||
| import type { InkeepBaseSettings } from '@inkeep/agents-ui/types'; | |||
| import { TabsContent } from '@radix-ui/react-tabs'; | |||
| import { Tabs as RadixTabs } from 'radix-ui'; | |||
There was a problem hiding this comment.
💭 Consider: Inconsistent import naming convention
Issue: Uses Tabs as RadixTabs but the established convention across all UI components is ComponentName as ComponentNamePrimitive (e.g., Tabs as TabsPrimitive in tabs.tsx).
Why: All UI component files use the *Primitive suffix for radix-ui imports. Using RadixTabs here breaks that consistency.
Fix: Either align with the convention:
| import { Tabs as RadixTabs } from 'radix-ui'; | |
| import { Tabs as TabsPrimitive } from 'radix-ui'; |
Or better yet, remove this import entirely and use the local styled TabsContent from @/components/ui/tabs (which is already partially imported on line 4) — see related comment below.
| <RadixTabs.TabsContent value="react"> | ||
| <Streamdown>{reactCode}</Streamdown> | ||
| </TabsContent> | ||
| <TabsContent value="js"> | ||
| </RadixTabs.TabsContent> | ||
| <RadixTabs.TabsContent value="js"> | ||
| <Streamdown>{javascriptCode}</Streamdown> | ||
| </TabsContent> | ||
| </RadixTabs.TabsContent> |
There was a problem hiding this comment.
💭 Consider: Direct radix-ui usage bypasses local styled wrapper
Issue: Uses RadixTabs.TabsContent directly from radix-ui instead of the local styled TabsContent component, even though Tabs, TabsList, and TabsTrigger are imported from @/components/ui/tabs.
Why: The local TabsContent wrapper includes consistent styling (mt-2 ring-offset-background focus-visible:outline-none...). Using the raw primitive bypasses this styling and creates visual inconsistency.
Fix: Add TabsContent to the existing import on line 4:
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';Then update usage:
<TabsContent value="react">
<Streamdown>{reactCode}</Streamdown>
</TabsContent>
<TabsContent value="js">
<Streamdown>{javascriptCode}</Streamdown>
</TabsContent>This would also allow removing the radix-ui import on line 2 entirely.
Refs:
| import { GripVertical, MoreVertical, Pencil, Trash2 } from 'lucide-react'; | ||
| import NextLink from 'next/link'; | ||
| import { useParams } from 'next/navigation'; | ||
| import type { Checkbox as RadixCheckbox } from 'radix-ui'; |
There was a problem hiding this comment.
💭 Consider: Inconsistent type import naming convention
Issue: Uses Checkbox as RadixCheckbox but the established convention is ComponentName as ComponentNamePrimitive.
Why: All other files use the *Primitive suffix for radix-ui imports (e.g., CheckboxPrimitive in checkbox.tsx). Using RadixCheckbox breaks this naming pattern.
Fix:
| import type { Checkbox as RadixCheckbox } from 'radix-ui'; | |
| import type { Checkbox as CheckboxPrimitive } from 'radix-ui'; |
Then update line 88 from RadixCheckbox.CheckedState to CheckboxPrimitive.CheckedState.
Refs:
There was a problem hiding this comment.
PR Review Summary
(1) Total Issues | Risk: Low
🟡 Minor (1) 🟡
Inline Comments:
- 🟡 Minor:
chat-ui-code.tsx:4Mixed import pattern - uses local wrappers for some Tabs components but raw radix-ui for TabsContent
💭 Consider (3) 💭
💭 1) color-picker.tsx:30 Redundant sub-component naming
Issue: Uses PopoverPrimitive.PopoverTrigger and PopoverPrimitive.PopoverContent while popover.tsx uses the shorter PopoverPrimitive.Trigger and PopoverPrimitive.Content.
Why: Both patterns work, but creates internal inconsistency. The radix-ui unified package supports both naming styles.
Fix: Optional - align with the shorter pattern used in popover.tsx for consistency.
💭 2) collapsible.tsx + info-card.tsx Redundant sub-component naming
Issue: Uses CollapsiblePrimitive.CollapsibleTrigger and CollapsiblePrimitive.CollapsibleContent (lines 11-18 in collapsible.tsx, lines 44-59 in info-card.tsx).
Why: Both work correctly. This is a stylistic inconsistency with how other components like popover.tsx access sub-components.
Fix: Optional - could align with shorter pattern CollapsiblePrimitive.Trigger / CollapsiblePrimitive.Content.
💭 3) package.json:109 Alphabetical ordering
Issue: radix-ui is added at the end of the dependencies object rather than in its alphabetical position (between react-runner and recharts).
Why: Minor consistency issue. The codebase appears to use alphabetical ordering for dependencies.
Fix: Move "radix-ui": "^1.4.3" to its alphabetical position.
💡 APPROVE WITH SUGGESTIONS
Summary: This is a clean migration from individual @radix-ui/react-* packages to the unified radix-ui package per the shadcn 2026-02 changelog. CI passes ✅. The changes are mechanical import updates with no functional impact. The minor issues noted are optional polish items that don't block merging. The inline comment about chat-ui-code.tsx is the most actionable item - the file should use the local TabsContent wrapper for styling consistency.
Note: The user also requested a changeset - I'll add that separately.
Discarded (2)
| Location | Issue | Reason Discarded |
|---|---|---|
package.json:109 |
Caret range ^1.4.3 for radix-ui |
Follows same pattern as the removed @radix-ui/* packages which also used caret ranges. Consistent with existing practice. |
pnpm-lock.yaml |
Large lockfile changes | Expected result of dependency consolidation. No issues identified. |
Reviewers (4)
| Reviewer | Returned | Main Findings | Consider | While You're Here | Inline Comments | Pending Recs | Discarded |
|---|---|---|---|---|---|---|---|
pr-review-frontend |
1 | 0 | 0 | 0 | 1 | 0 | 0 |
pr-review-consistency |
5 | 0 | 2 | 0 | 0 | 0 | 3 |
pr-review-devops |
3 | 0 | 1 | 0 | 0 | 0 | 2 |
pr-review-standards |
0 | 0 | 0 | 0 | 0 | 0 | 0 |
| Total | 9 | 0 | 3 | 0 | 1 | 0 | 5 |
Note: Multiple reviewers flagged the same chat-ui-code.tsx mixed import issue - consolidated into single inline comment.
| import { TabsContent } from '@radix-ui/react-tabs'; | ||
| import { Tabs as RadixTabs } from 'radix-ui'; | ||
| import { Streamdown } from 'streamdown'; | ||
| import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'; |
There was a problem hiding this comment.
🟡 Minor: Use local TabsContent wrapper instead of raw Radix primitive
Issue: This file imports Tabs, TabsList, TabsTrigger from the local wrapper (@/components/ui/tabs) but bypasses it for TabsContent by importing directly from radix-ui. The local TabsContent wrapper (defined in tabs.tsx) includes project-standard styling that the raw primitive doesn't have.
Why: The inconsistency means TabsContent won't have the same styling (mt-2 ring-offset-background focus-visible:outline-none...) applied, creating visual inconsistency.
Fix:
| import { Tabs, TabsList, TabsTrigger } from '@/components/ui/tabs'; | |
| import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'; |
Then remove the radix-ui import on line 2 and replace RadixTabs.TabsContent on lines 91/94 with TabsContent.
Refs:
Ito Test Report ✅18 test cases ran. 18 passed. All 18 test cases passed in the local environment with zero failures, indicating stable behavior across project management, agent builder, Ship modal, navigation, edge-case overlay handling, and adversarial security scenarios. Key findings were that destructive flows were safe and consistent (idempotent delete under rapid clicks, non-admin deletion blocked, stale-tab deletion reconciled to a recoverable not-found state), UI/UX remained robust (tab synchronization, keyboard/mobile accessibility, Escape/outside-click dismissal, deep-link recovery, single navigation transitions), and security boundaries held (cross-tenant access denied and script/URL injection payloads remained inert). ✅ Passed (18)
Commit: Tell us how we did: Give Ito Feedback |
There was a problem hiding this comment.
PR Review Summary
(0) New Issues | Risk: Low
Re-review scope: Changes since last review (2c9ce3bedaf1 → 7000c4ee9)
✅ Delta Changes Verified
The polish commit correctly addressed the prior review feedback:
| File | Issue Fixed | Status |
|---|---|---|
chat-ui-code.tsx:2 |
Naming inconsistency (RadixTabs → TabsPrimitive) |
✅ Fixed |
skill-selector.tsx:4 |
Naming inconsistency (RadixCheckbox → CheckboxPrimitive) |
✅ Fixed |
color-picker.tsx:30,40-41 |
Sub-component naming (PopoverTrigger → Trigger, etc.) |
✅ Fixed |
All three files in the delta show proper fixes aligned with the codebase's *Primitive naming convention.
🕐 Pending Recommendations (3)
- 🟡
package.json:109Alphabetical ordering —radix-uiplaced afterzustand, should be betweenreact-runnerandrecharts - 💭
chat-ui-code.tsx:91-96Optional — still uses rawTabsPrimitive.TabsContentinstead of local styledTabsContentwrapper - 💭
info-card.tsx:44-59Optional — uses longerCollapsiblePrimitive.CollapsibleTriggerpattern vs shorterCollapsiblePrimitive.Trigger
✅ APPROVE
Summary: Clean migration from individual @radix-ui/react-* packages to the unified radix-ui meta-package. The polish commit successfully addressed all naming convention issues from the prior review. The remaining pending items are low-severity polish — none are blocking. Ship it! 🚀
Reviewers (1)
| Reviewer | Returned | Main Findings | Consider | While You're Here | Inline Comments | Pending Recs | Discarded |
|---|---|---|---|---|---|---|---|
delta-check |
3 | 0 | 0 | 0 | 0 | 3 | 0 |
| Total | 3 | 0 | 0 | 0 | 0 | 3 | 0 |
Note: Re-review scoped to delta changes only. All prior feedback in delta was addressed.
|
@claude add a changeset |
|
Claude finished @dimaMachina's task in 53s —— View job Adding changeset
Added changeset: |
Co-authored-by: Dimitri POSTOLOV <[email protected]> Co-Authored-By: Claude Opus 4.6 <[email protected]>
Ito Test Report ❌19 test cases ran. 3 failed, 16 passed. Across 19 end-to-end checks, 16 passed and 3 failed, indicating broad stability in the agent editor and Ship modal flows (including persistence, drag-and-drop ordering, keyboard/mobile/navigation stress, invalid deep-link handling, XSS/malformed-input safety, and the expected GET /health HTTP 204 contract) with one concentrated regression area. The critical issue is a reproducible PR-introduced defect in /default/projects delete interactions where rapid dropdown-to-dialog open/close cycles can leave stale pointer-blocking overlay state after the dialog disappears, causing a non-interactive page and making destructive project actions unreliable (High severity in the main and edge delete-flow cases, with related double-click validation blocked). ❌ Failed (3)
|
| Category | Summary | Screenshot |
|---|---|---|
| Adversarial | Ship modal remained stable under payload injection and payloads stayed inert with no script execution observed. | |
| Adversarial | Malformed and injection-like color inputs were handled safely without crashes and the modal remained interactive. | |
| Adversarial | Keyboard stress did not trap focus or freeze overlays, and the Ship modal was usable afterward. | |
| Adversarial | Under rapid alternating toolbar clicks, UI briefly entered modal/menu overlap states but recovered to a consistent interactive state without permanent lockup. | |
| Adversarial | Invalid deep-link produced a graceful error/empty state, and normal navigation to a valid skill editor still worked afterward. | |
| Edge | Mobile ship modal tabs, color popover, and React/Javascript code toggles remained usable and readable at 390x844 after history traversal. | |
| Edge | After browser refresh from Chat UI > Code > Javascript, the editor recovered; reopening Ship modal and retesting tabs worked without stale-state crash. | |
| Edge | Repeated back/forward traversal across projects and agent editor recovered cleanly with no frozen overlays or blocked controls. | |
| Edge | Keyboard-only navigation (Enter/Escape/Tab/Shift+Tab/ArrowDown spam) did not leave overlays stuck and the UI remained interactive. | |
| Logic | Code view toggled repeatedly between React and Javascript and consistently rendered the corresponding snippets without panel corruption. | |
| Logic | Primary brand color interactions in Preview were reflected in generated code (e.g., #00ff00), and popover open/close behavior remained stable. | |
| Logic | Always loaded checkbox toggled successfully and persisted after save + page reload on the same sub-agent. | |
| Logic | Drag-and-drop skill reorder updated numbering immediately and persisted after save/reload. | |
| Happy-path | Projects page and menu overlay behavior verified; liveness contract is HTTP 204 by design. | |
| Happy-path | Agent editor route loaded, sub-agent node pane exposed skill controls (Always loaded + ordering), invalid skill deep-link was handled with error state, and normal valid skill edit path still worked. | |
| Happy-path | Ship modal opened with expected top-level tabs; nested Chat UI Preview/Code and React/Javascript panels switched correctly, malicious payloads stayed inert, malformed color inputs did not break interactivity, and refresh/reopen recovered successfully. |
Commit: 76f4798
Tell us how we did: Give Ito Feedback
https://ui.shadcn.com/docs/changelog/2026-02-radix-ui