From 8a4feb88012d85998a60d4ec4f479493c1b7924c Mon Sep 17 00:00:00 2001 From: "user.email" Date: Sun, 1 Nov 2026 20:38:26 -0800 Subject: [PATCH] refactor(web): use Tooltip from @corbits/react-ui in provider picker - Bump @corbits/react-ui from 0.5.0 to 0.5.1 across web, coder, and starter client - Replace local Tip wrapper in custom-providers.tsx with Tooltip from @corbits/react-ui/ui/tooltip - Regenerate designer skill react-ui reference docs Closes CL-11961 --- apps/web/package.json | 2 +- apps/web/src/pages/custom-providers.tsx | 28 ++----------------- bun.lock | 6 ++-- workflows/coder/package.json | 2 +- workflows/coder/starter/bun.lock | 4 +-- workflows/coder/starter/client/package.json | 2 +- workflows/designer/skills/react-ui/SKILL.md | 4 +-- .../skills/react-ui/reference/api-agent.md | 4 +-- .../skills/react-ui/reference/api-controls.md | 15 ++++++++-- .../react-ui/reference/api-data-display.md | 4 +-- .../skills/react-ui/reference/api-layout.md | 4 +-- .../skills/react-ui/reference/controls.md | 7 +++-- .../skills/react-ui/reference/data-display.md | 2 +- .../skills/react-ui/reference/layout.md | 2 +- .../skills/react-ui/reference/theming.md | 2 +- 15 files changed, 39 insertions(+), 49 deletions(-) diff --git a/apps/web/package.json b/apps/web/package.json index 5b160971..bb6894ed 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -13,7 +13,7 @@ "dependencies": { "@corbits-builder/client": "workspace:*", "@corbits-builder/schemas": "workspace:*", - "@corbits/react-ui": "0.5.0", + "@corbits/react-ui": "0.5.1", "@radix-ui/react-dialog": "1.3.1", "@radix-ui/react-dropdown-menu": "2.2.1", "@radix-ui/react-slot": "1.5.0", diff --git a/apps/web/src/pages/custom-providers.tsx b/apps/web/src/pages/custom-providers.tsx index 8c9bc213..78b7d224 100644 --- a/apps/web/src/pages/custom-providers.tsx +++ b/apps/web/src/pages/custom-providers.tsx @@ -26,8 +26,7 @@ import { MenuSeparator, MenuTrigger, } from "@corbits/react-ui/ui/menu"; -import { InfoTooltip } from "@corbits/react-ui/ui/tooltip"; -import * as Tooltip from "@radix-ui/react-tooltip"; +import { InfoTooltip, Tooltip } from "@corbits/react-ui/ui/tooltip"; import { useQueryClient } from "@tanstack/react-query"; import { ChevronDown, Ellipsis, X } from "lucide-react"; import { useRef, useState, type KeyboardEvent, type ReactNode } from "react"; @@ -269,9 +268,9 @@ export function ProviderPicker({ ); return provider.tip ? ( - + {card} - + ) : ( card ); @@ -280,27 +279,6 @@ export function ProviderPicker({ ); } -/** The library's info-tooltip surface around any trigger; the library only offers it on its glyph. */ -function Tip({ label, children }: { label: string; children: ReactNode }) { - return ( - - - {children} - - - {label} - - - - - - ); -} - /** A Settings row: its label with a tooltip, an optional hint, and its control on the right. */ function FieldRow({ label, diff --git a/bun.lock b/bun.lock index 8a77b232..8303ff1a 100644 --- a/bun.lock +++ b/bun.lock @@ -118,7 +118,7 @@ "dependencies": { "@corbits-builder/client": "workspace:*", "@corbits-builder/schemas": "workspace:*", - "@corbits/react-ui": "0.5.0", + "@corbits/react-ui": "0.5.1", "@radix-ui/react-dialog": "1.3.1", "@radix-ui/react-dropdown-menu": "2.2.1", "@radix-ui/react-slot": "1.5.0", @@ -612,7 +612,7 @@ "name": "@corbits-builder/coder", "version": "0.9.0", "dependencies": { - "@corbits/react-ui": "0.5.0", + "@corbits/react-ui": "0.5.1", "@intx/agent": "workspace:*", "@intx/workflow": "workspace:*", }, @@ -760,7 +760,7 @@ "@corbits/openai-responses": ["@corbits/openai-responses@0.2.3", "", { "dependencies": { "arktype": "2.2.3" }, "peerDependencies": { "@intx/inference": "^0.5.0", "@intx/types": "^0.5.0" } }, "sha512-9msL1hy3jINpJsdbv2+EZsjVvKIZ8lSO7oJcwKSyphog87U+fePhQtsBq/HNJbKY+zQeHYoaL2MbuYGo/aMIfA=="], - "@corbits/react-ui": ["@corbits/react-ui@0.5.0", "", { "dependencies": { "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "tailwind-merge": "^3.3.1" }, "peerDependencies": { "@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-dropdown-menu": "^2.1.16", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-tooltip": "^1.2.8", "lucide-react": "^0.545.0 || ^1.0.0", "react": "^18.2.0 || ^19.0.0", "react-dom": "^18.2.0 || ^19.0.0", "sonner": "^2.0.7" }, "optionalPeers": ["@radix-ui/react-dialog", "@radix-ui/react-dropdown-menu", "@radix-ui/react-tooltip", "sonner"] }, "sha512-tFTkT7sqYuVavKOVEyP9CrDbXomuOWY/AX1oFjLgsgFc/DdUAMcf6cRMHILdfRI/6HV3W+82hCX+efKlD1JD8g=="], + "@corbits/react-ui": ["@corbits/react-ui@0.5.1", "", { "dependencies": { "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "tailwind-merge": "^3.3.1" }, "peerDependencies": { "@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-dropdown-menu": "^2.1.16", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-tooltip": "^1.2.8", "lucide-react": "^0.545.0 || ^1.0.0", "react": "^18.2.0 || ^19.0.0", "react-dom": "^18.2.0 || ^19.0.0", "sonner": "^2.0.7" }, "optionalPeers": ["@radix-ui/react-dialog", "@radix-ui/react-dropdown-menu", "@radix-ui/react-tooltip", "sonner"] }, "sha512-kipQmHrAAHFlN+rxS0TXwPpbrtxabWZNi4EGtaZvDPK+xhmnUtDwporw4Vd5871IdJ9YVlNhylisIsiJSnD69Q=="], "@corbits/slidedeck": ["@corbits/slidedeck@workspace:packages/slidedeck"], diff --git a/workflows/coder/package.json b/workflows/coder/package.json index 55dec889..0e28e61b 100644 --- a/workflows/coder/package.json +++ b/workflows/coder/package.json @@ -13,7 +13,7 @@ "./assets": "./src/assets.ts" }, "dependencies": { - "@corbits/react-ui": "0.5.0", + "@corbits/react-ui": "0.5.1", "@intx/agent": "workspace:*", "@intx/workflow": "workspace:*" } diff --git a/workflows/coder/starter/bun.lock b/workflows/coder/starter/bun.lock index 57664094..e3408027 100644 --- a/workflows/coder/starter/bun.lock +++ b/workflows/coder/starter/bun.lock @@ -13,7 +13,7 @@ "name": "@app/client", "dependencies": { "@app/shared": "workspace:*", - "@corbits/react-ui": "0.5.0", + "@corbits/react-ui": "0.5.1", "@radix-ui/react-slot": "1.5.0", "@tanstack/react-query": "5.105.0", "lucide-react": "1.64.0", @@ -55,7 +55,7 @@ "@app/shared": ["@app/shared@workspace:packages/shared"], - "@corbits/react-ui": ["@corbits/react-ui@0.5.0", "", { "dependencies": { "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "tailwind-merge": "^3.3.1" }, "peerDependencies": { "@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-dropdown-menu": "^2.1.16", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-tooltip": "^1.2.8", "lucide-react": "^0.545.0 || ^1.0.0", "react": "^18.2.0 || ^19.0.0", "react-dom": "^18.2.0 || ^19.0.0", "sonner": "^2.0.7" }, "optionalPeers": ["@radix-ui/react-dialog", "@radix-ui/react-dropdown-menu", "@radix-ui/react-tooltip", "sonner"] }, "sha512-tFTkT7sqYuVavKOVEyP9CrDbXomuOWY/AX1oFjLgsgFc/DdUAMcf6cRMHILdfRI/6HV3W+82hCX+efKlD1JD8g=="], + "@corbits/react-ui": ["@corbits/react-ui@0.5.1", "", { "dependencies": { "class-variance-authority": "^0.7.1", "clsx": "^2.1.1", "tailwind-merge": "^3.3.1" }, "peerDependencies": { "@radix-ui/react-dialog": "^1.1.15", "@radix-ui/react-dropdown-menu": "^2.1.16", "@radix-ui/react-slot": "^1.2.3", "@radix-ui/react-tooltip": "^1.2.8", "lucide-react": "^0.545.0 || ^1.0.0", "react": "^18.2.0 || ^19.0.0", "react-dom": "^18.2.0 || ^19.0.0", "sonner": "^2.0.7" }, "optionalPeers": ["@radix-ui/react-dialog", "@radix-ui/react-dropdown-menu", "@radix-ui/react-tooltip", "sonner"] }, "sha512-kipQmHrAAHFlN+rxS0TXwPpbrtxabWZNi4EGtaZvDPK+xhmnUtDwporw4Vd5871IdJ9YVlNhylisIsiJSnD69Q=="], "@hono/zod-validator": ["@hono/zod-validator@0.9.1", "", { "peerDependencies": { "hono": ">=4.11.2", "zod": "^3.25.0 || ^4.0.0" } }, "sha512-iiv6w0qrIc0arfvCtUqBWsvl4fXjzaTcQcCJTTtCnkawF9HHGE+KjEl0ox3gQJ6rKZEgE3mLExlQCF72M+mNuw=="], diff --git a/workflows/coder/starter/client/package.json b/workflows/coder/starter/client/package.json index bad9e65a..80138391 100644 --- a/workflows/coder/starter/client/package.json +++ b/workflows/coder/starter/client/package.json @@ -9,7 +9,7 @@ }, "dependencies": { "@app/shared": "workspace:*", - "@corbits/react-ui": "0.5.0", + "@corbits/react-ui": "0.5.1", "@radix-ui/react-slot": "1.5.0", "@tanstack/react-query": "5.105.0", "lucide-react": "1.64.0", diff --git a/workflows/designer/skills/react-ui/SKILL.md b/workflows/designer/skills/react-ui/SKILL.md index bb12053d..997a7144 100644 --- a/workflows/designer/skills/react-ui/SKILL.md +++ b/workflows/designer/skills/react-ui/SKILL.md @@ -3,9 +3,9 @@ name: react-ui description: Use before hand-writing any UI - which @corbits/react-ui component to use for app shell, pages, forms, tables, stats, charts, status, empty and loading states; install, theme tokens, dark mode and extra packages. --- -# @corbits/react-ui (0.5.0) +# @corbits/react-ui (0.5.1) -The client starter pins `@corbits/react-ui` 0.5.0. Components take props and +The client starter pins `@corbits/react-ui` 0.5.1. Components take props and render markup; data comes from the app's queries. Styling is Tailwind v4 classes backed by theme tokens, so everything inherits light and dark mode and the same spacing, radius and type. diff --git a/workflows/designer/skills/react-ui/reference/api-agent.md b/workflows/designer/skills/react-ui/reference/api-agent.md index 22615a31..b1626c4e 100644 --- a/workflows/designer/skills/react-ui/reference/api-agent.md +++ b/workflows/designer/skills/react-ui/reference/api-agent.md @@ -1,6 +1,6 @@ - + -# react-ui: conversation, agent runs, media and artifacts (0.5.0) +# react-ui: conversation, agent runs, media and artifacts (0.5.1) Props per exported component, from the installed declarations. `?` marks optional. `+native` means the component also accepts the native props of the element it renders (`className`, `onClick`, ...). Import from the package root unless SKILL.md lists the module as a subpath. diff --git a/workflows/designer/skills/react-ui/reference/api-controls.md b/workflows/designer/skills/react-ui/reference/api-controls.md index a218c505..9547c463 100644 --- a/workflows/designer/skills/react-ui/reference/api-controls.md +++ b/workflows/designer/skills/react-ui/reference/api-controls.md @@ -1,6 +1,6 @@ - + -# react-ui: buttons, inputs, filters, dialogs, menus and toasts (0.5.0) +# react-ui: buttons, inputs, filters, dialogs, menus and toasts (0.5.1) Props per exported component, from the installed declarations. `?` marks optional. `+native` means the component also accepts the native props of the element it renders (`className`, `onClick`, ...). Import from the package root unless SKILL.md lists the module as a subpath. @@ -241,6 +241,17 @@ maxHeight?: number — Pixel height autoResize grows to before it caps and scrol ## ui/tooltip +### Tooltip — A general tooltip that wraps a focusable trigger element and discloses a note on hover or focus. +label: ReactNode — The content shown in the tooltip bubble and bound to the trigger via `aria-describedby`. +children: ReactElement> — Focusable trigger element that discloses the tooltip on hover or keyboard focus. +side?: TooltipSide — Preferred side of the trigger to render against. +sideOffset?: number — Offset distance in pixels from the trigger. +delay?: number — Delay in milliseconds before opening on hover. +defaultOpen?: boolean — Render already open — uncontrolled, for stories and screenshots. +open?: boolean — Controlled open state. +onOpenChange?: ((open: boolean) => void) — Callback fired when the open state changes. +className?: string — Additional class names applied to the tooltip content bubble. + ### InfoTooltip — A focusable info glyph that discloses a short note on hover or focus. label: string — The note shown in the tooltip and bound to the trigger via `aria-describedby`. triggerLabel?: string — Accessible name for the trigger button. diff --git a/workflows/designer/skills/react-ui/reference/api-data-display.md b/workflows/designer/skills/react-ui/reference/api-data-display.md index 0f8330aa..548125ae 100644 --- a/workflows/designer/skills/react-ui/reference/api-data-display.md +++ b/workflows/designer/skills/react-ui/reference/api-data-display.md @@ -1,6 +1,6 @@ - + -# react-ui: tables, stats, charts, status, avatars, empty and loading states (0.5.0) +# react-ui: tables, stats, charts, status, avatars, empty and loading states (0.5.1) Props per exported component, from the installed declarations. `?` marks optional. `+native` means the component also accepts the native props of the element it renders (`className`, `onClick`, ...). Import from the package root unless SKILL.md lists the module as a subpath. diff --git a/workflows/designer/skills/react-ui/reference/api-layout.md b/workflows/designer/skills/react-ui/reference/api-layout.md index e4bffdad..988063e2 100644 --- a/workflows/designer/skills/react-ui/reference/api-layout.md +++ b/workflows/designer/skills/react-ui/reference/api-layout.md @@ -1,6 +1,6 @@ - + -# react-ui: app shell and page layout (0.5.0) +# react-ui: app shell and page layout (0.5.1) Props per exported component, from the installed declarations. `?` marks optional. `+native` means the component also accepts the native props of the element it renders (`className`, `onClick`, ...). Import from the package root unless SKILL.md lists the module as a subpath. diff --git a/workflows/designer/skills/react-ui/reference/controls.md b/workflows/designer/skills/react-ui/reference/controls.md index 5dadc445..6dd47a49 100644 --- a/workflows/designer/skills/react-ui/reference/controls.md +++ b/workflows/designer/skills/react-ui/reference/controls.md @@ -1,6 +1,6 @@ # react-ui: controls -Source: @corbits/react-ui 0.5.0 npm package (README.md and dist/ui/*.d.ts), the version pinned in workflows/coder/starter/client/package.json +Source: @corbits/react-ui 0.5.1 npm package (README.md and dist/ui/*.d.ts), the version pinned in workflows/coder/starter/client/package.json Fetched: 2026-10-29 --- @@ -70,8 +70,9 @@ for dialog forms. `ui/menu` (needs `@radix-ui/react-dropdown-menu`): `Menu`, `MenuTrigger`, `MenuContent`, `MenuItem`, `MenuLabel`, `MenuGroup`, `MenuSeparator`. -`ui/tooltip` (needs `@radix-ui/react-tooltip`): `InfoTooltip` (`label`, -`triggerLabel`). `ui/command-palette` and `ui/sidebar-search`: global search. +`ui/tooltip` (needs `@radix-ui/react-tooltip`): `Tooltip` (`label`, `side`, +`children`), `InfoTooltip` (`label`, `triggerLabel`). `ui/command-palette` and +`ui/sidebar-search`: global search. ## Toasts (already installed in the starter) diff --git a/workflows/designer/skills/react-ui/reference/data-display.md b/workflows/designer/skills/react-ui/reference/data-display.md index 03fca570..7858b5cc 100644 --- a/workflows/designer/skills/react-ui/reference/data-display.md +++ b/workflows/designer/skills/react-ui/reference/data-display.md @@ -1,6 +1,6 @@ # react-ui: data display, empty and loading states -Source: @corbits/react-ui 0.5.0 npm package (README.md and dist/ui/*.d.ts), the version pinned in workflows/coder/starter/client/package.json +Source: @corbits/react-ui 0.5.1 npm package (README.md and dist/ui/*.d.ts), the version pinned in workflows/coder/starter/client/package.json Fetched: 2026-10-29 --- diff --git a/workflows/designer/skills/react-ui/reference/layout.md b/workflows/designer/skills/react-ui/reference/layout.md index 016993d1..38407b50 100644 --- a/workflows/designer/skills/react-ui/reference/layout.md +++ b/workflows/designer/skills/react-ui/reference/layout.md @@ -1,6 +1,6 @@ # react-ui: layout components -Source: @corbits/react-ui 0.5.0 npm package (README.md and dist/ui/*.d.ts), the version pinned in workflows/coder/starter/client/package.json +Source: @corbits/react-ui 0.5.1 npm package (README.md and dist/ui/*.d.ts), the version pinned in workflows/coder/starter/client/package.json Fetched: 2026-10-29 --- diff --git a/workflows/designer/skills/react-ui/reference/theming.md b/workflows/designer/skills/react-ui/reference/theming.md index 3bfa16d3..7a475d81 100644 --- a/workflows/designer/skills/react-ui/reference/theming.md +++ b/workflows/designer/skills/react-ui/reference/theming.md @@ -1,6 +1,6 @@ # react-ui: install, theme and tokens -Source: @corbits/react-ui 0.5.0 npm package (README.md, dist/theme.css, dist/ui/theme-provider.d.ts), the version pinned in workflows/coder/starter/client/package.json +Source: @corbits/react-ui 0.5.1 npm package (README.md, dist/theme.css, dist/ui/theme-provider.d.ts), the version pinned in workflows/coder/starter/client/package.json Fetched: 2026-10-29 ---