Description

When updating the value bound to the selected property of an IgxButton, I need to manually call the deselectButton method.

Looking at the igniteui code, it seems that buttons only trigger changes to its buttongroup owner when they are selected.
When they're deselected by updating the model, the buttongroup is not notified.
In this case, the model and the visual state shown by the component looks disconnected.

The selection state is only updated or notified on init, or when a button changes from deselected to selected, not the other way around.

The issue was first reproduced in AppBuilder

• igniteui-angular version: 17.0.6
• browser: Chrome 120.0.6099.217

Steps to reproduce

1. Create a button group with several buttons
2. Bind the selected prop of the buttons to a certain value.
3. Programmatically update the value (e.g. implement a reset logic to the form that the buttons are part of)

Result

After updating the value for the selected prop (e.g. hitting the reset button in the form), the selected buttons continue being selected, and I need to manually call deselectButton to de-select them.

Expected result

After updating the value for the selected prop (e.g. hitting the reset button in the form), the selected buttons should turn to de-selected without having to call the deselectButton method.