Expose "selected" style in List Item

[zdrawku]

Is your feature request related to a problem? Please describe.

The lack of a built-in "selected" style for List items complicates the implementation of the common use case for handling a selection state. While other components like Nav Drawer, Dropdown, and Select support a "selected" style out of the box, List items do not.

This forces developers to manually implement selected states and styling in custom code, which can lead to inconsistent design. Additionally, the current "active" state supported by List items is limited as it only reflects a temporary "pressed" state that disappears when the mouse button is released. This behavior does not address the common use case of persisting a selection state style for List items, which is essential for many applications.

Describe the solution you'd like

Introduce support for a "selected" style for List items. This may involve the following:

• Adding a "selected" style in the theme for List items, similar to the selected styles already available for components like Nav Drawer (active), Dropdown, and Select.

• Allow developers to bind a "selected" state to List items declaratively. For example what we have in NavDrawer item:
  ...
  <span igxDrawerItem [isHeader]="true">Components
  <span *ngFor="let item of navItems" igxDrawerItem [active]="item.text === selected" igxRipple (click)="navigate(item)">
  ...

Expectation example with the List item:
<igx-list-item [selected]="record.Id === selectedCustomer.Id">

• Ensure the "selected" styles align with Ignite's overall theming approach to provide a seamless and visually consistent experience.

The implementation should not include built-in selection state management by the List itself, allowing developers full control over the selection logic while benefiting from consistent styling.

Describe alternatives you've considered

Developers can manually add CSS styles and manage the "selected" state in their code. However, this approach is time-consuming, error-prone, and inconsistent with the rest of the framework.

Additional context

Adding a "selected" style for List items would align Ignite UI for Angular with its existing components, such as Nav Drawer, Dropdown, and Select, which already support "selected" styles.