This is an automated email from the ASF dual-hosted git repository.
bbovenzi pushed a commit to branch v3-4-test
in repository https://gitbox.apache.org/repos/asf/airflow.git
The following commit(s) were added to refs/heads/v3-4-test by this push:
new dafddb2220e [v3-4-test] Keep the multiselect filter pill's focus ring
visible (#75307) (#75398)
dafddb2220e is described below
commit dafddb2220ec676c5d7417ff52d059db65fca2ce
Author: github-actions[bot]
<41898282+github-actions[bot]@users.noreply.github.com>
AuthorDate: Thu Oct 22 09:38:03 2026 -0400
[v3-4-test] Keep the multiselect filter pill's focus ring visible (#75307)
(#75398)
While editing a tags, owners or other multiselect filter, the pill draws
its focus ring as an outline outside its box. The row below the filters
starts right at the pill's edge, so the sticky header of the Dags table
painted over the bottom of the ring.
(cherry picked from commit 469800c11d26570b0d11cdc42ecaf4c97c191ff4)
Co-authored-by: Pierre Jeambrun <[email protected]>
---
.../ui/src/components/FilterBar/filters/MultiSelectPill.tsx | 9 ++++++++-
1 file changed, 8 insertions(+), 1 deletion(-)
diff --git
a/airflow-core/src/airflow/ui/src/components/FilterBar/filters/MultiSelectPill.tsx
b/airflow-core/src/airflow/ui/src/components/FilterBar/filters/MultiSelectPill.tsx
index c3c2be9cc58..02534a4ca02 100644
---
a/airflow-core/src/airflow/ui/src/components/FilterBar/filters/MultiSelectPill.tsx
+++
b/airflow-core/src/airflow/ui/src/components/FilterBar/filters/MultiSelectPill.tsx
@@ -96,7 +96,14 @@ export const MultiSelectPill = ({
// act on Enter tears the filter down before the value it just created
commits.
renderInput={({ onBlur, onFocus, ref }) => (
<Box
- _focusWithin={{ outlineColor: "colorPalette.solid", outlineStyle:
"solid", outlineWidth: "1px" }}
+ // Drawn inside the pill's edge: an outer ring is covered by
whatever sits right below
+ // the filter row, such as the sticky header of the Dags table.
+ _focusWithin={{
+ outlineColor: "colorPalette.solid",
+ outlineOffset: "-1px",
+ outlineStyle: "solid",
+ outlineWidth: "1px",
+ }}
alignItems="center"
bg="bg"
border="0.5px solid"
