[Agent Builder] Remove stray delimiter in attachment header by Kiryous · Pull Request #276018 · elastic/kibana

Kiryous · 2026-07-02T15:30:33Z

Closes https://github.com/elastic/search-team/issues/15112

Summary

Every attachment chip (dashboards, workflows, skills, etc.) in the Agent Builder chat renders a stray vertical delimiter on the left side of the title. The delimiter is a borderLeft on the EuiFlexItem that wraps the title/subtitle, added in #265883 as a visual separator from the icon. Most attachment callers don't pass an icon, so the border stands alone as an orphan; even when an icon is present the extra line reads as noise. Removing it matches the design intent.

Before / After

Before (from the issue):

After (verified locally on a workflow attachment):

Verification

Booted Kibana locally, opened Agent Builder, created a workflow attachment in a conversation.
Inspected the header's inner EuiFlexItem inline style: now min-width: 0px only, no border-left.
Reverted temporarily to a bright red border to confirm the correct element was being modified, then restored the fix.
node scripts/type_check --project x-pack/platform/plugins/shared/agent_builder/tsconfig.json — clean.

Checklist

Follows EUI's writing guidelines (no user-facing text change)
Unit/functional tests not affected (pure CSS removal, no snapshot tests reference these styles)

The FlexItem wrapping the title/subtitle in AttachmentHeader was given a borderLeft in elastic#265883, intended as a visual separator from the icon. In practice it renders as an orphaned vertical bar on every attachment chip (dashboards, workflows, skills) — no icon is passed by most callers, and even when one is present the extra line reads as noise. Remove it. Closes elastic/search-team#15112

…eader-stray-delimiter

kibanamachine · 2026-07-02T18:37:11Z

💛 Build succeeded, but was flaky

Buildkite Build
Commit: 57093ac
Build duration: 64 mins

Failed CI Steps

Test Failures

[job] [logs] Scout Lane #33 - serverless-observability_complete / default / local-serverless-observability_complete - Hosts Page - Empty State - should show onboarding page when no data is present
[job] [logs] Scout Lane #38 - serverless-security_complete / default / local-serverless-security_complete - Discover app - saved search embeddable - should allow removing the dashboard panel after the underlying saved search has been deleted
[job] [logs] Scout Lane #11 - stateful-classic / default / local-stateful-classic - Discover app - saved search embeddable - should allow removing the dashboard panel after the underlying saved search has been deleted

Metrics [docs]

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
`agentBuilder`	2.1MB	2.1MB	-85.0B

History

💛 Build #463055 was flaky 8fd0534
💔 Build #462993 failed 8843d0c

cc @Kiryous

kibanamachine · 2026-07-02T18:37:58Z

Starting backport for target branches: 9.4

https://github.com/elastic/kibana/actions/runs/28613277247

kibanamachine · 2026-07-02T18:47:35Z

💔 All backports failed

Status	Branch	Result
❌	9.4	Backport failed because of merge conflicts

Manual backport

To create the backport manually run:

node scripts/backport --pr 276018

Questions ?

Please refer to the Backport tool documentation

github-actions · 2026-07-02T18:56:33Z

Backport resolution attempt complete

Branch	Status	Result
9.4	needs manual backport	Component diverged structurally on 9.4; needs manual resolution.

These backports were prepared by an agent. Please review the generated PRs carefully before merging.

Generated by Failed Backport Resolver for issue #276018 · 117.1 AIC · ⌖ 11.8 AIC · ⊞ 4.1K · ◷

…276018) Closes elastic/search-team#15112 ## Summary Every attachment chip (dashboards, workflows, skills, etc.) in the Agent Builder chat renders a stray vertical delimiter on the left side of the title. The delimiter is a `borderLeft` on the `EuiFlexItem` that wraps the title/subtitle, added in elastic#265883 as a visual separator from the icon. Most attachment callers don't pass an icon, so the border stands alone as an orphan; even when an icon is present the extra line reads as noise. Removing it matches the design intent. ## Before / After Before (from the issue): <img width="600" src="https://github.com/user-attachments/assets/7b1792a3-d1e5-472c-a335-41cc6ca1b171" /> After (verified locally on a workflow attachment): ![after](https://pub-6b50802d113345dea50c783e8280b53e.r2.dev/artifacts/20260702/frtx8be5-attachment-header-after.png) ## Verification - Booted Kibana locally, opened Agent Builder, created a workflow attachment in a conversation. - Inspected the header's inner `EuiFlexItem` inline style: now `min-width: 0px` only, no `border-left`. - Reverted temporarily to a bright red border to confirm the correct element was being modified, then restored the fix. - `node scripts/type_check --project x-pack/platform/plugins/shared/agent_builder/tsconfig.json` — clean. ## Checklist - [x] Follows [EUI's writing guidelines](https://elastic.github.io/eui/#/guidelines/writing) (no user-facing text change) - [x] Unit/functional tests not affected (pure CSS removal, no snapshot tests reference these styles)

kibanamachine · 2026-07-03T18:48:56Z