Updating recommendation for V2 UI Components #980
Conversation
Based on evaluation of both prototype implementations (v2/prototype/shadcn and v2/prototype/mantine), recommend Shadcn for the following reasons: - Component ownership: Components copied to codebase, not npm dependency - Tailwind CSS integration: Utility-first approach with purged bundles - Radix UI foundation: WCAG 2.1 compliant accessibility primitives - Simpler theming: CSS variables vs React context re-renders - Better DX: Source code visible and editable in project Includes comparison table and tradeoffs acknowledged. Co-Authored-By: Claude Opus 4.5 <[email protected]>
Break up v2_ux.md (1400+ lines) into smaller, focused documents: - v2_ux.md - Core UX (overview, server list, modals) - v2_ux_features.md - Feature screens (Tools, Resources, etc.) - v2_ux_handlers.md - Client handlers, form generation, errors - v2_screenshots.md - Visual reference with Shadcn prototype screenshots Add screenshots from Shadcn prototype to specification/screenshots/. Update navigation headers across all spec files. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <[email protected]>
|
Going back to draft since we got a chance to discuss in the meeting - will revise |
|
I was comparing the two branches and I realized that a major reason why the shadcn implementation has so much more visible tailwind in it is that there are no shadcn components for layout on the page. Mantine has them, so building containers around your components isn't a matter of adding a div with all the right classes. It's more about instantiating a JSX component, passing it a few properties that control its behavior. This can lead to smaller and easier to understand code. These examples came from the Mantine
Shadcn + Tailwind
In either case, we could tuck most of this styling and container detail into a But with shadcn, I think we still need to build some layout components. Or find a good standalone library for that which exposes various helpful container abstractions as JSX components. In the one shadcn component I could find that that looks like it should possibly act as a flex container |
|
|
||
| ## Client Feature Handlers | ||
|
|
||
| These are modals/panels that appear when the server invokes client capabilities. |
|
|
||
| **Features:** | ||
| - Display server's experimental capabilities from initialization | ||
| - Toggle client experimental capabilities to advertise |
There was a problem hiding this comment.
Yes, this.
I ran into this the other day, discovering that the SDK currently has a weird problem with any of the client capabilities being turned off. After doing it manually for each and all capabilities, I was thinking how nice it would be if we had toggles for capabilities in the Inspector.
| - `minLength` / `maxLength` - Validation for strings | ||
|
|
||
| **Complex Schema Handling:** | ||
| - `$ref` - Resolve references and render inline (when possible) |
There was a problem hiding this comment.
Also $def, package deal with $ref.
cliffhall
left a comment
cliffhall
left a comment
There was a problem hiding this comment.
LGTM! 👍
- So glad Mantine won you over. The rationale is sound. I expect it to pay dividends.
- Excellent breakdown of the View concerns.
2 participants
(see doc for rationale)