Skip to content

fix(core): remove outline and event from disabled segmented button#14026

Open
InnaAtanasova wants to merge 2 commits intomainfrom
fix/segmented-button-disabled-form
Open

fix(core): remove outline and event from disabled segmented button#14026
InnaAtanasova wants to merge 2 commits intomainfrom
fix/segmented-button-disabled-form

Conversation

@InnaAtanasova
Copy link
Contributor

Related Issue(s)

closes #14001

Description

Fixed incorrect behavior in segmented button reactive forms where disabled controls were responding to click events and triggering touch state changes.

TypeScript (segmented-button.component.ts)

  • Added early return check in @HostListener('click') to prevent onTouched() from being called when component is disabled
  • Removed buggy code block in _toggleDisableButtons() that was re-registering event listeners when buttons were disabled (lines 393-398). This code was redundantly setting role="option" (already set in _setButtonAttributes()) More critically, it was re-adding click/keyboard event listeners instead of removing them.

CSS (segmented-button.component.scss)

  • Added rules to prevent :focus-visible outline on disabled segmented buttons

@InnaAtanasova InnaAtanasova added this to the Sprint 156 - March 2026 milestone Mar 24, 2026
@InnaAtanasova InnaAtanasova requested a review from a team March 24, 2026 15:11
@InnaAtanasova InnaAtanasova self-assigned this Mar 24, 2026
@InnaAtanasova InnaAtanasova added the bug Something isn't working label Mar 24, 2026
@netlify
Copy link

netlify bot commented Mar 24, 2026

Deploy Preview for fundamental-ngx ready!

Name Link
🔨 Latest commit 1ee939d
🔍 Latest deploy log https://app.netlify.com/projects/fundamental-ngx/deploys/69c2de76fe51e400085084a9
😎 Deploy Preview https://deploy-preview-14026--fundamental-ngx.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@InnaAtanasova
Copy link
Contributor Author

fix in fund-styles that brings this CSS there, too: SAP/fundamental-styles#6262

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

bug Something isn't working

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Disabled Segmented Button receives touched event and gets an outline

2 participants