Tooltip on Filter List Title (Data Binding & Layout Issues)

Hello Palantir Community,

I need to include a Tooltip (for field details) attached to the title/label of a Filter List component in Workshop.

The standard Filter List does not natively support tooltips on its header.

I have tested different workarounds by mixing components, but encountered major issues with stability and layout.

Please see the attached image for three examples:

  1. Standard Filter List (No Tooltip).

  2. Metric Card (Tooltip) + String Selector (Filter) – Buggy/Issues with cascading filter logic.

  3. Metric Card (Tooltip) + Standard Filter List – Excessive Spacing.

Question: What is the recommended or most stable approach to cleanly display a tooltip for a filter’s title/label in Workshop?

Thank you for any suggestions!

What issues are you getting with the cascading filter for option 2?

You could use a Rows layout and stack sections on top of each other – for the title + tooltip, set the section layout to Toolbar and the + signs where you can add widgets will be on the sides. You could then use the Markdown widget for the label and a button group with no label (just the info tooltip icon) and a description so when a user hovers their cursor over it, they can see the desired text.

Another thing you can maybe play around with is the alternative display option for filter lists which will make each property (i.e., Payer) look like a pill/rectangle with rounded corners. You might use one filter list widget for each property (not ideal) but then can arrange them in a columns layout where there’s a button group widget (same implementation as described above) and customize the space between each filter list + button group pair.

Hello Josh,

Users reported the appearance of “blank squares” during page loading, possibly related to the volume of options being loaded via the String Selector. Regarding the correlation between all the filters, sometimes you filter F1, then select F2 even though you don’t have a subset of these two selections.

I managed to achieve the required result by applying your suggestion, with the following structure:

  • Row section without space between and top/bottom padding 10
  • Column section inside row section with the metric card and filter list
    • metric card with empty string and the description, flex 1
    • filter list with flex 8

Thank you so much for your help!

Regards

1 Like