fix(web): keep a long path from running under the folder picker button

[Sy-D]

What Changed

The folder picker input now reserves enough room for the submit button that sits on top of it, and the reservation actually reaches the input element.

Why

Reported in #4819: a long absolute path runs into the action area and hides the Add button and its shortcut.

Two things were wrong:

1. CommandInput forwards className to AutocompleteInput, which is the field wrapper — not the inner <input>. The pe-16 / pe-36 / pe-32 the palette passed never applied to the text field. Measured on main, the input's computed padding-inline-end was 11px, i.e. its own px-* and nothing else. The component already solves this for the other side with *:data-[slot=autocomplete-input]:ps-9!, so the end padding now uses the same mechanism.
2. Even applied, pe-16 (64px) was too small. The button is absolutely positioned with inset-e-2.5, and measured in the running app it spans 83px over the input for "Add" and 137px for "Create & Add".

Sizes are therefore pe-24 (96px) and pe-38 (152px), leaving 13px and 15px between the text edge and the button.

Notes For Review

I kept the existing class-based approach rather than measuring the button at runtime, since the labels are a closed set. The trade-off is that a much longer label — a future wording change or a localisation — would need the padding revisited. If you would rather have it derived from the button's real width, say so and I will switch it.

The repository step (pe-32, "Continue" / "Lookup") is wired through the same way but I did not exercise that flow, so its 128px is unverified — it was not part of the report.

Validation

Measured in a running client, browse mode, before and after:

Variant	Button spans over input	Reserved before	Reserved after	Clearance after
Add (Enter)	83px	11px	96px	13px
Create & Add (Enter)	137px	11px	152px	15px

• vp run --filter @t3tools/web test — 1641 passed
• vp run --filter @t3tools/web typecheck — no errors
• vp lint — no new warnings (two pre-existing no-unstable-nested-components in this file are untouched)
• vp fmt --check — clean

Closes #4819.

Checklist

• This PR is small and focused
• I explained what changed and why
• Before/after screenshots — the issue carries the "before"; an "after" still needs attaching, so this stays draft until then
  Before:

After:

Bildschirmaufnahme.2026-07-29.um.11.45.54.mov

Note

[!NOTE]

Fix long path text running under the folder picker button in the command palette

Targets end padding on the inner autocomplete input element (via *:data-[slot=autocomplete-input]) rather than the wrapper div in CommandPalette.tsx. Also increases padding values in browsing flows (pe-38 with willCreateProjectPath, pe-24 without) to give the submit button enough clearance.

^{Macroscope summarized cc773ee.}

---

Note

Low Risk
Scoped CSS-only change in the command palette add-project/browse input with no auth, data, or API impact.

Overview
Fixes #4819 by reserving end padding on the inner command palette input (via *:data-[slot=autocomplete-input]), not on the CommandInput wrapper where pe-* never reached the text field.

Browse and remote-repository flows now use larger end padding (pe-24 / pe-38 for Add vs Create & Add, pe-32 for Continue/Lookup) so long paths stay clear of the absolutely positioned submit button.

^{Reviewed by Cursor Bugbot for commit cc773ee. Bugbot is set up for automated code reviews on this repo. Configure here.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 98c26c86-92fb-4a00-bd79-b7f8ef2b361e

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[macroscopeapp]

Approvability

Verdict: Approved 68b9aed

This is a CSS-only fix that adjusts padding selectors to prevent long paths from running under an absolutely-positioned button. The changes are purely visual with no runtime behavior impact.

^{You can customize Macroscope's approvability policy. Learn more.}