feat: import boss-ui components + Tailwind v4 upgrade by tellaho · Pull Request #69 · block/goose2

tellaho · 2026-04-01T23:30:04Z

Summary

Import boss-ui shared component library (buttons, badges, dialogs, inputs, etc.) and upgrade to Tailwind v4
Swap vanilla HTML elements across features (agents, projects, skills, settings, sidebar, tabs) to use boss-ui components for consistent styling
Fix chat input: use default Button variant for send button, remove black focus-visible ring on textarea

bossui.-.Screen.Recording.2026-04-01.at.8.40.44.PM.trimmed.mov

Test plan

Verify all views render correctly (agents, projects, skills, settings, chat)
Check send button uses primary color and disabled state looks correct
Confirm textarea no longer shows black outline on focus
Verify hover states use consistent accent/50 across all interactive elements

🤖 Generated with Claude Code

@theme

- Upgrade Tailwind CSS v3 → v4 with @tailwindcss/postcss, tw-animate-css - Replace tailwind.config.js with CSS @theme blocks in globals.css - Import boss-ui token system (semantic backgrounds, borders, text, shadows, shapes, typography scale, animations, layout tokens) - Import 49 shared UI components from squareup/boss-ui - Import 48 AI element components from squareup/boss-ui - Import 4 hooks from squareup/boss-ui - Install all required dependencies (Radix UI primitives, UI libs, content libs, form/utility libs) - Migrate all 35+ feature files from custom tokens to standard shadcn/boss-ui tokens (bg-background, text-foreground, bg-accent, text-muted-foreground, border-border, etc.) - Align to boss-ui visual language: flat border-driven design, no elevation on sidebars/inputs, shadow-popover for menus, shadow-card for dialogs - Fix low-contrast text by removing opacity modifiers on text-muted-foreground - Update biome.json, tsconfig.json, check-file-sizes.mjs for imported code - Re-add custom Button variants (toolbar, xs, icon-sm, icon-lg) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

- Replace hand-rolled dialogs with Dialog/DialogContent in CreateSkillDialog, CreateProjectDialog, PersonaEditor - Replace delete confirmations with AlertDialog in AgentsView, ProjectsView, SkillsView, SettingsModal, DoctorCheckRow - Replace raw <input> with Input component (6 instances) - Replace raw <textarea> with Textarea component (3 instances) - Replace raw <select> with Select/SelectTrigger/SelectContent/ SelectItem (5 instances) - Replace raw <label> with Label component throughout - Replace <input type="checkbox"> with Checkbox component - Replace div border-t dividers with Separator in settings - Fix Radix SelectItem empty-string value crash by using sentinel - Set sidebar to bg-background Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

…tarea Use the boss-ui Button default variant (bg-primary) for the send button instead of custom bg-foreground overrides. Suppress the global focus-visible ring on the chat textarea to prevent the black outline. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 1f1ebfe198

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

chatgpt-codex-connector · 2026-04-01T23:35:37Z

src/shared/styles/globals.css

+@import "tailwindcss";
+@import "tw-animate-css";


Re-register Tailwind typography plugin

After upgrading to Tailwind v4, this stylesheet no longer registers @tailwindcss/typography (and the JS config that previously loaded it is deleted), so prose* utilities used by src/features/chat/ui/MarkdownContent.tsx are no longer generated. In practice, markdown messages lose their intended typography/table/code styling even though those classes are still present in the JSX.

Useful? React with 👍 / 👎.

Fixed in cab3b86 — added @plugin "@tailwindcss/typography"; to globals.css to register the prose utilities for Tailwind v4.

src/shared/styles/globals.css

@font-face

- Download Cash Sans Wide font files (5 weights) from boss-ui - Add @font-face declarations in globals.css - Switch page titles, settings headings, home clock/greeting, and chat empty state to font-display (Cash Sans Wide) with tracking-tight - Use Badge component with secondary variant for PersonaCard pills - Remove redundant "Personas" section subtitle - Upgrade "Active Agents" heading to display font Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Replace ~56 raw <button> elements across 20 files with the Button component, hand-rolled toggle groups with ToggleGroup, img/div avatar patterns with Avatar, animate-pulse skeletons with Skeleton, and a raw <input> with Input. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Relocate src/components/ai-elements/ to src/shared/ui/ai-elements/ to colocate with the rest of the boss-ui component library. No import updates needed as these components are not yet consumed. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Use default sans-serif for skill names in the list and create dialog to match persona card styling. Keep mono only for instructions textarea. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

@source

Replace hand-rolled ToolCallCard, ThinkingBlock, and MarkdownContent with the ai-elements Tool, Reasoning, and MessageResponse compounds. Action buttons now use MessageAction with built-in tooltip support. Add @source for streamdown so Tailwind generates its utility classes. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Merges 7 commits from main into tho/boss-ui: - Image paste support in chat input (block#68) - Tab name text unselectable (block#67) - Chat title immediate update on send (block#66) - Artifact v1 file viewing (block#63) - Cmd+W tab close (block#64) - Chat activity/unread state tracking (block#62) - Sidebar hierarchy polish + faster reloads (block#61) Key conflict resolutions: - Keep Tailwind v4 CSS-based config (delete tailwind.config.js) - Keep boss-ui dialog.tsx, add showCloseButton prop from main - Add text-foreground-subtle token to boss-ui theme system - Keep ToolCallAdapter (boss-ui), adopt ToolChainCards pattern from main - Delete MarkdownContent/ToolCallCard (replaced by boss-ui ai-elements) - Adopt SessionActivityIndicator from main into sidebar - Adopt ClickableImage/ImageLightbox from main - Merge drag-and-drop image support into ChatInput - Keep boss-ui hover:bg-accent/50 treatment throughout sidebar Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Merge origin/main (tabs removal refactor block#70) and fix two code review items: - Register @tailwindcss/typography plugin via @plugin directive for prose classes - Fix accordion keyframes to use --radix-accordion-content-height (not --bits-) - Remove GooseIcon home button from sidebar header (removed upstream) - Adopt tab→session rename throughout sidebar components Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: cab3b8642d

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

src/features/chat/ui/MessageBubble.tsx

chatgpt-codex-connector · 2026-04-02T02:14:29Z

src/features/chat/ui/ToolCallAdapter.tsx

+      <ToolContent>
+        {Object.keys(args).length > 0 && <ToolInput input={args} />}
+        <ToolOutput
+          output={isError ? undefined : result}
+          errorText={isError ? result : undefined}
+        />


Preserve artifact quick-open actions on tool results

This adapter only renders generic ToolInput/ToolOutput, but the previous ToolCallCard integrated resolveToolCardDisplay and openResolvedPath to surface “Open file/folder/path” actions for tool outputs. As a result, tool calls that create or reference artifacts now regress to plain text output with no direct open action, which breaks the artifact-viewing workflow introduced in earlier chat changes.

Useful? React with 👍 / 👎.

Add overflow-hidden to main content area so the flex layout chain properly constrains scrolling to the MessageTimeline, keeping the chat input and status bar pinned at the bottom. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Two issues caused the entire page to scroll when viewing chat: 1. scrollIntoView() in MessageTimeline scrolls all ancestors including the document. Replaced with container.scrollTo() which only scrolls within the message timeline container. 2. Tailwind v4 preflight doesn't set height/overflow on html/body like v3 did. Added height: 100% + overflow: hidden on html, body, #root outside @layer base so the cascade can't override them. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Add min-w-0 and w-full to message content containers so flex items respect the max-w-[85%] boundary. Wrap tool output pre blocks with whitespace-pre-wrap so result text flows within the code block. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

The previous selection background (#1a1a1a) was nearly invisible against the dark input background. Now uses the user's accent color at 60% opacity. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Strip visual noise from collapsed tool calls: remove wrench icon (via optional showIcon prop), remove border/rounded container, replace status pill with plain text, hide "Completed" status entirely, and use inline chevron caret next to the tool name. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

wesbillman · 2026-04-02T15:05:05Z

Not sure if intentional, but the little goose is gone from the sidebar header now, which looks a bit odd when closed.

OH, this is gone in main too

wesbillman · 2026-04-02T15:08:42Z

oh the search icon seems a bit off center too

tellaho · 2026-04-02T18:34:16Z

Superseded — reopening from origin now that I have push access. #85

tellaho and others added 3 commits April 1, 2026 14:58

tellaho requested a review from wesbillman as a code owner April 1, 2026 23:30

chatgpt-codex-connector bot reviewed Apr 1, 2026

View reviewed changes

tellaho and others added 4 commits April 1, 2026 16:49

style: remove mono font from skill names

1056544

Use default sans-serif for skill names in the list and create dialog to match persona card styling. Keep mono only for instructions textarea. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

tellaho marked this pull request as draft April 2, 2026 00:26

tellaho and others added 3 commits April 1, 2026 17:40

tellaho marked this pull request as ready for review April 2, 2026 02:09

chatgpt-codex-connector bot reviewed Apr 2, 2026

View reviewed changes

tellaho and others added 5 commits April 1, 2026 21:11

fix: use accent color for text selection highlight

59131e4

The previous selection background (#1a1a1a) was nearly invisible against the dark input background. Now uses the user's accent color at 60% opacity. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

tellaho force-pushed the tho/boss-ui branch from 178b5b1 to 8caba9a Compare April 2, 2026 07:20

This was referenced Apr 2, 2026

feat: group tool calls with verb labels + spacing tellaho/goose2#1

Closed

feat: group tool calls with verb labels + spacing #78

Closed

Merge branch 'main' into tho/boss-ui

b412f95

nahiyankhan approved these changes Apr 2, 2026

View reviewed changes

tellaho closed this Apr 2, 2026

tellaho mentioned this pull request Apr 2, 2026

feat: import boss-ui components + Tailwind v4 upgrade #85

Merged

6 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: import boss-ui components + Tailwind v4 upgrade#69

feat: import boss-ui components + Tailwind v4 upgrade#69
tellaho wants to merge 16 commits intoblock:mainfrom
tellaho:tho/boss-ui

tellaho commented Apr 1, 2026 •

edited

Loading

Uh oh!

chatgpt-codex-connector bot left a comment

Uh oh!

chatgpt-codex-connector bot Apr 1, 2026

Uh oh!

tellaho Apr 2, 2026

Uh oh!

Uh oh!

chatgpt-codex-connector bot left a comment

Uh oh!

Uh oh!

chatgpt-codex-connector bot Apr 2, 2026

Uh oh!

wesbillman commented Apr 2, 2026 •

edited

Loading

Uh oh!

wesbillman commented Apr 2, 2026

Uh oh!

tellaho commented Apr 2, 2026 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

		@import "tailwindcss";
		@import "tw-animate-css";

Conversation

tellaho commented Apr 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary

Test plan

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

chatgpt-codex-connector bot Apr 1, 2026

Choose a reason for hiding this comment

Uh oh!

tellaho Apr 2, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

chatgpt-codex-connector bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

chatgpt-codex-connector bot Apr 2, 2026

Choose a reason for hiding this comment

Uh oh!

wesbillman commented Apr 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

wesbillman commented Apr 2, 2026

Uh oh!

tellaho commented Apr 2, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

3 participants

tellaho commented Apr 1, 2026 •

edited

Loading

wesbillman commented Apr 2, 2026 •

edited

Loading

tellaho commented Apr 2, 2026 •

edited

Loading