block / block/berd

Centered Cmd+N composer shows a native black focus border

Open
#322 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
909
Forks
116
Avg merge
1d 1h
Merged PRs (30d)
156

Description

### Before filing

- [x] I searched [open and closed issues](https://github.com/block/berd/issues?q=is%3Aissue) for duplicates.
- [x] I reproduced this on the [latest release](https://github.com/block/berd/releases).
- [x] This is one bug, not several bundled together.

### Closest existing issue

none found

### What's broken

Opening a new session with `Cmd+N` focuses the centered global composer textarea with a native black focus border. The in-session composer pills do not show that border.

### Steps to reproduce

1. Launch Berd 0.6.3 on macOS (Apple Silicon).
2. From any existing chat, press `Cmd+N` to open the centered new-session composer.
3. Leave the textarea focused (it focuses automatically).
4. Compare that textarea with an ordinary in-session composer pill.

### What you expected to happen

The focused new-session composer textarea should match the other composer pills: no native black outline or ring around the input.

### What actually happened

A black rectangular border appears around the textarea inside the centered composer pill. It only shows on the `Cmd+N` / new-session composer, not on the other composer pills.

### How often does it happen?

Every time — reliably reproducible

### Berd version

0.6.3

### Operating system

macOS (Apple Silicon)

### Model and provider

n/a — UI-only. The screenshot was taken with GPT 5.6 Terra Medium selected in the composer, but the border appears as soon as the centered composer is focused.

### Relevant log output

no relevant log output

This is a focused-state CSS issue. I looked in `~/Library/Logs/xyz.block.berd/` around the repro; there is nothing about the composer chrome.

### Additional context

The in-session `ChatInput` textarea uses `focus:outline-none focus-visible:ring-0 focus-visible:ring-offset-0` and stays inside Berd's global focus reset.

The centered global composer textarea in `src/shared/ui/GlobalComposerPill.tsx` currently uses `focus-override`. That class opts the field out of the global `*:not(body):not(.focus-override)` outline/ring reset in `src/shared/styles/globals.css`, so WebKit's native black focus outline shows on `Cmd+N`.

I am not submitting a PR. Berd does not accept outside pull requests. A local patch that removes `focus-override` and matches the `ChatInput` focus classes removes the border.

Contributor guide

Open the contributing guide

Research direction

Start in src/shared/ui/GlobalComposerPill.tsx and compare its focused-state classes with the ChatInput textarea; then read the focus reset in src/shared/styles/globals.css. Reproduce the Cmd+N flow on macOS and verify that the centered composer matches the in-session composer without a native black focus border.

Written by the indexing model from the issue text.

Assessment

Tech stack
css, typescript
Domain
frontend
Issue type
Bug
Difficulty
1/5
Estimated time
Under an hour
Activity status
Active
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.