Update esbuild from 0.23 to 0.28 - #538

… system redesign (#563)

## Why

The redesign in #542 is built on `@wordpress/ui` and `@wordpress/theme`,
and both are developed against the current `@wordpress/components`. The
app is on 28, thirteen majors behind, so nothing from the design system
can be added until the renderer stands on 41. This is the first step of
#542 and changes no behaviour.

## What changes

- `@wordpress/components` moves from `^28.2.0` to `^41.0.0` and
`@wordpress/icons` from `^10.7.0` to `^17.0.0`. React stays on 18.3.1,
which both packages support.
- The `edit` icon was removed from `@wordpress/icons`; `pencil` is the
same glyph under its current name.
- `build.files` excludes the thirteen packages the update brought into
the packaged app. `@wordpress/components` 41 depends on `@wordpress/ui`
and `@wordpress/theme`, and `@wordpress/theme` names esbuild as an
optional peer, so npm stopped marking esbuild as dev-only and
electron-builder started shipping its binary. None of the thirteen is
loaded at run time: the renderer is the esbuild bundle, and nothing
under `src/` requires them.
- The sidebar title is kept on one line. Buttons are set in a heavier
weight now, and the wider "Collapse" button wrapped "Contributor
Toolkit" onto two.
- Text inputs are now 40px tall instead of 36px. So the buttons are
slightly smaller. But they will be removed anyway.

Deliberately not in this PR: adding `@wordpress/ui` or
`@wordpress/theme` as dependencies of the app, any use of design tokens,
and any layout change. Those are the next steps of #542.

## How to test this

Platforms: any. Nothing here touches paths, spawning or signing. Use the
Buildkite build for the current head of this branch.

The journeys carry the behavior: `npm run test:e2e` from the repository
root drives every flow the renderer has through the updated components,
and `npm run test:e2e:packaged`, after
`CSC_IDENTITY_AUTO_DISCOVERY=false npm run pack:dir`, proves the
packaged app still boots without the excluded packages. What they cannot
see is how the app looks, so that is what a person should check.

**Starting state:** the app open with at least one site that has
finished setup.

1. Look at the sidebar. "Contributor Toolkit" is on one line, beside
"Collapse".
2. Click "Collapse", then the arrow to expand again. The sidebar returns
to the same layout.
3. Click the pencil beside the site name. The "Rename site" dialog
opens; close it.
4. Open the menu at the top right of the site. It lists "Copy path", the
file manager entry, "Update to latest trunk" and "Delete this site".
5. Click "Create a site". The dialog shows "Site name", "Contribute to"
with two choices, and "Site location"; close it.
6. Scroll to "Logs" and click each tab. The selected tab is underlined
and its content changes.

**What must not have happened:**

- No button, field or menu has lost its label or become unreachable.
- No text is clipped or overlapping where a control grew: text fields
are 40px tall instead of 36px, and button labels are heavier.

## Risks and limitations

- **The look changes slightly, and that is the design system's doing.**
Button labels are heavier, text fields are taller, menu items are more
compact, and the selected tab is marked in neutral grey and black where
it was blue. Details under Screenshots.
- **The docs screenshots are not retaken.** The twelve the harness can
produce differ slightly from the app after this. #542 retakes all of
them, and the harness is not reproducible across runs (#326), so
refreshing them here would add churn twice.
- **Checked on macOS only by hand and by local runs.** Windows is
covered by CI's journeys and packaged smoke, not by a person.
- **The exclusion list is by name.** A future update that adds another
renderer-only package will ship it until someone adds a line. Excluding
the whole renderer-only tree is the real fix and overlaps with #23.
- **The first commit of this branch was pushed to `trunk` by mistake and
removed again.** `trunk` is back at 0dc54da; anyone who fetched in
between has b6a6151 on their local `trunk`.
- Review: 2 [fix here], both fixed; 1 [follow-up] deferred.

## Related

Part of #542.
Fixes #548.

---

<details>
<summary>Design decisions and alternatives considered</summary>

**Excluding in `build.files` rather than moving the renderer's
dependencies to `devDependencies`.** Moving them would stop the whole
renderer-only tree from shipping, not just what this update added, but
that is a change to how the app is packaged and #23 is already about it.
This PR only undoes the growth it would otherwise cause.

**One jump from 28 to 41 rather than a major at a time.** The renderer
uses seventeen components, all of which still exist with the same props.
The only break was the removed icon alias, which fails the build rather
than the app.

</details>

<details>
<summary>Review outcome (required — see AGENTS.md)</summary>

**2 [fix here] · 1 [follow-up]** — both [fix here] fixed.

- Architecture, medium, [fix here], fixed: the packaged app shipped the
esbuild binary, because `@wordpress/theme` names esbuild as an optional
peer and electron-builder collects optional packages.
- Performance, medium, [fix here], fixed: twelve more packages the
update added were collected into the app and never loaded.
- Performance, low, [follow-up], deferred: the whole renderer dependency
tree ships although only the bundle is loaded. It predates this branch
and is the subject of #23.

Style notes, not applied: with `white-space: nowrap` the sidebar title
can paint outside the sidebar during the 200ms expand animation; the
`esbuild@0.23.1` entry in `allowScripts` has been stale since #538.

- **Review:** completed — fresh agent context, local, before the PR
existed; head b6a6151 / base
0dc54da; committed work only, working
tree clean; outcome above. CodeRabbit: not run yet.
- **Since review:** `b6a6151 → 4b2d52e` checked. The difference is the
thirteen exclusion lines in `build.files` that fix the two findings. It
was not reviewed again by a fresh context; it was verified by packaging
and running the packaged smoke test.

Checks on 4b2d52e, macOS, local:

| Check | Result |
|---|---|
| `npm run lint` | clean |
| `npm test` | 1676 tests, 1674 pass, 2 skipped, 0 fail |
| `npm run test:electron` | 1676 pass, 0 fail |
| `npm run test:e2e` | 33 of 33 pass |
| `npm run test:e2e:packaged` | 15 of 15 pass |

Lint, the unit tests and the journeys ran on b6a6151; the second commit
changes `build.files` only, which none of the three reads.

</details>

<details>
<summary>Implementation notes</summary>

`app.asar` on macOS arm64, unsigned, `npm run pack:dir`:

| State | Size |
|---|---|
| After the update, before the exclusions | 238,010,661 bytes |
| With the exclusions | 199,873,553 bytes |

The size on `trunk` was not measured.

Packages excluded: `esbuild`, `@esbuild/*`, `@base-ui/*`, `@date-fns/*`,
`@daypicker/*`, `react-day-picker`, `reselect`, `tabbable`,
`colorjs.io`, `@wordpress/base-styles`, `@wordpress/kebab-case`,
`@wordpress/style-runtime`, `@wordpress/ui`. The list is the difference
between the two lockfiles in what is not marked dev-only.

`@wordpress/components` 41 injects part of its CSS at run time through
`@wordpress/style-runtime`. The renderer's content security policy
already allows it (`style-src 'self' 'unsafe-inline'`).

</details>

<details>
<summary>Screenshots or recording</summary>

No images attached. The comparison was made between the committed docs
screenshots and the same twelve shots captured on this branch with `npm
run shots`. What differs:

- Button labels are set in weight 500.
- Text fields are 40px tall instead of 36px.
- Menu items are more compact.
- In "Logs", the selected tab has black text and a grey underline; it
was blue.
- The sidebar title wrapped onto two lines before the fix in this PR,
and is on one line with it.

</details>

🤖 Generated with [Claude Code](https://claude.com/claude-code)

---------

Co-authored-by: Claude Fable 5.1 <noreply@anthropic.com>