Why does Pill List item Compoent not show the dismiss icon?

[Yann Dubois2]

I have a Pill List component in UI Builder (Yokohama) but it is not displaying the dismiss "X" icon on the right side of the pill.

Here is how I have the component configured (for testing only... eventually I will have the Pills section bound dynamically):

However, even though I have canDismiss=true, the "dismiss" icon is not displayed:

According to the Pill API documentation, I believe I am using the correct attribute and value:

I also went to the SN Horizons page for the component and configured it their sandbox, similar to what I have, and it works there:

What could I be doing or configuring incorrectly?

[miftikhar20 · Accepted solution]

Hi @Yann Dubois2 ,

The documentation you are referring to is for the Pill component, while the component currently being used in your configuration is the Pill List component.

After reviewing the Pill List documentation, there does not appear to be an available property to configure individual pill behaviors such as Dismissible (canDismiss).
Now Component Library | ServiceNow Developers

As a workaround, you can achieve the same functionality by using the Pill component together with a Repeater to replicate the behavior of a pill list.

Suggested approach:

1. Add a Repeater component in UI Builder.
2. Place a Pill component inside the Repeater.
3. In the Pill component configuration, enable the Dismissible option.
4. Bind the repeater data source to your list of items.
5. Complete any additional configuration as needed and save.

 

This setup allows each pill to support the dismiss action while still dynamically rendering a list of items similar to the Pill List component.

If my response helped, please mark it as the accepted solution so others can benefit as well.

[Yann Dubois2]

Thanks @miftikhar20 , that solution will work for me!