fix(form-field): autofill background overrides error, disabled and overlay states (#DS-4096)

[lskramarov]

No description provided.

[github-actions]

Visit the preview URL for this PR (updated for commit b98afeb):

https://koobiq-next--prs-1893-15tash4n.web.app

_{(expires Mon, 17 Aug 2026 07:33:42 GMT)}

_{🔥 via Firebase Hosting GitHub Action 🌎}

_{Sign: c9e37e518febda70d0317d07e8ceb35ac43c534c}

[Copilot]

Pull request overview

This PR improves how <kbq-form-field> handles browser autofill styling so that autofill tinting no longer overrides higher-priority states (error/disabled/focus/inOverlay) and so the UA autofill background/text are reliably masked across states. It also introduces a small public autofill-tracking API (signals) so components and consumers can react to autofill state.

Changes:

• Add kbqInjectAutofilled() (core) and expose an autofilled Signal<boolean> on autofill-capable controls; forward it through KbqTagList, and surface KbqFormField.autofilled + kbq-form-field_autofilled host class.
• Rework form-field SCSS/theme to resolve state precedence via tokens/specificity and repaint UA autofill background/text via a mask using the “current state” resolved CSS variables.
• Add coverage and verification scaffolding (unit tests, e2e fixtures, dev harness) plus docs and spelling dictionary updates.

Reviewed changes

Copilot reviewed 29 out of 42 changed files in this pull request and generated 5 comments.

Show a summary per file

File	Description
tools/public_api_guard/components/textarea.api.md	Public API snapshot updated for KbqTextarea.autofilled signal.
tools/public_api_guard/components/tags.api.md	Public API snapshot updated for KbqTagInput/KbqTagList autofill signal exposure.
tools/public_api_guard/components/input.api.md	Public API snapshot updated for KbqInput/KbqInputPassword.autofilled.
tools/public_api_guard/components/form-field.api.md	Public API snapshot updated for KbqFormField.autofilled + control contract change.
tools/public_api_guard/components/core.api.md	Public API snapshot updated to export kbqInjectAutofilled.
tools/cspell-locales/ru.json	Add RU spelling entry for new autofill docs text.
tools/cspell-locales/en.json	Add EN spelling entries for new autofill-related terms.
packages/components/textarea/textarea.component.ts	Expose autofilled signal via kbqInjectAutofilled() on textarea control.
packages/components/textarea/e2e.ts	Add autofill visual/state fixtures for textarea form-field cases.
packages/components/tags/tag-text-control.ts	Extend tag text control contract to optionally expose autofilled signal.
packages/components/tags/tag-list.component.ts	Forward autofill state from the registered tag input via a computed signal.
packages/components/tags/tag-input.ts	Expose autofilled signal on the actual autofillable tag input.
packages/components/tags/e2e.ts	Add autofill fixture for tags to validate styling precedence.
packages/components/input/input.ts	Expose autofilled signal via kbqInjectAutofilled() on input control.
packages/components/input/input-password.ts	Expose autofilled signal via kbqInjectAutofilled() on password input control.
packages/components/input/e2e.ts	Extend state grid to include “autofill” combinations and styling checks.
packages/components/form-field/form-field.ts	Add kbq-form-field_autofilled host class binding + autofilled getter.
packages/components/form-field/form-field.scss	Adjust focus-ring/autofill interactions and ensure autofill tokens don’t override other states.
packages/components/form-field/form-field.ru.md	Document autofill behavior and customization tokens (RU).
packages/components/form-field/form-field.en.md	Document autofill behavior and customization tokens (EN).
packages/components/form-field/form-field-tokens.scss	Update autofill token defaults/semantics (border vs background intent).
packages/components/form-field/form-field-control.ts	Extend control contract to optionally provide autofilled signal.
packages/components/form-field/autofill.spec.ts	Add unit tests for autofill detection, forwarding, and teardown.
packages/components/form-field/_form-field-theme.scss	Rework state resolution + autofill masking to respect state precedence without !important/:has().
packages/components/core/common-behaviors/index.ts	Re-export autofill behavior from common behaviors barrel.
packages/components/core/common-behaviors/autofill.ts	Implement kbqInjectAutofilled() using CDK AutofillMonitor and signals.
packages/components-dev/input/template.html	Add dev page section to render the new autofill harness.
packages/components-dev/input/module.ts	Register DevAutofill in the input dev examples module.
packages/components-dev/input/autofill.ts	Add manual, real-browser autofill harness for DS-4096 verification.

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.