fix(FieldStatus): cover rounded input corners

[rubyycheung]

Summary

• extend attached status backgrounds behind the lower half of their controls
• derive the overlap from the control size, so rounded and 9999px pill radii remain covered
• offset the added overlap with matching top padding so message placement stays unchanged
• add regression coverage for small, medium, and large controls

Test plan

• pnpm vitest run packages/core/src/Field/Field.test.tsx packages/core/src/FieldStatus/FieldStatus.test.tsx
• ASTRYX_STRICT_LINT=1 pnpm exec eslint packages/core/src/Field/Field.tsx packages/core/src/Field/Field.test.tsx packages/core/src/FieldStatus/FieldStatus.tsx packages/core/src/FieldStatus/FieldStatus.test.tsx
• pnpm -F @astryxdesign/core build
• pnpm check:repo

Related work

PR #5738 also touches Field and FieldStatus for the separate tooltip-presentation boundary and may require a small rebase depending on merge order.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
astryx	Ready	Preview	Sep 2, 2026 8:52pm UTC

[github-actions]

PR Analysis Report

📚 Storybook Preview

View Storybook for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

🧪 Sandbox Preview

View Sandbox for this PR
GitHub Pages may take up to a minute to hydrate after deploy.

Modified Components

Field _{(@astryxdesign/core)} · View in Storybook

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	783	-
Complexity	N/A	Very High (48)	-

FieldStatus _{(@astryxdesign/core)}

Metric	Before	After	Delta
Bundle Size (ESM)	N/A	N/A	N/A
Lines of Code	N/A	141	-
Complexity	N/A	Low (5)	-

Bundle Size Summary

Package	Size (ESM)	Size (CJS)	Gzipped
@astryxdesign/core	N/A	4.8KB	1.2KB

Accessibility Audit

Status: No accessibility violations detected.

Visual Regression

8 added · 0 removed. View the report

A repository maintainer can accept these exact frames: /accept-visual 33605870272/1 <why every changed frame is correct>

Added — After

Added — After

Added — After

---

_{Generated by PR Enrichment workflow | Storybook | Sandbox | View full report}

[cixzhang]

Thanks for the fix. In the documented custom/native-control path, clicking the lower half of the input now hits FieldStatus and drops focus to the page. Please keep the attached background from taking pointer input, then retain the size/theme visual coverage.

[Reviewed by Robohands]

[cixzhang]

Thanks, the click path is fixed. The documented custom/native Field path still paints the attached status over the control instead of behind it: with a pill radius, the lower 20px turns warning yellow, while TextInput stays above the same overlap (Field.tsx:58). Please keep custom controls visually above the status while preserving pointer access, and cover this state in the Field story.

[Reviewed by Robohands]

[rubyycheung]

Addressed the latest review feedback:

• Field now places only its attached status in the wrapper's isolated background layer, so custom/native controls paint above the overlap while the existing pointer-events: none behavior preserves input access. Standalone FieldStatus behavior is unchanged.
• Added a native-input attached-status case to the Field Status Variants story and a regression test for the stacking relationship.
• Updated the RTL applicability registry for direction-neutral FieldStatus; the previously failing scope now evaluates as 2 verified N-A components with 0 coverage gaps.

Focused component tests, RTL coverage tests, strict lint, core build, Storybook production build, knowledge/sync checks, and the repository pre-commit suite pass locally.

[cixzhang]

Thanks, the custom-control path now keeps the control above the attached status and preserves focus across the overlap. Focused tests and exact-head visual checks pass.

[Reviewed by Robohands]