...

The most common use of the dual list selector is a column picker, used in data tables. For this reason, this document describes the structure and function for a column picker.

...

Usage & Behavior

General guidelines

• The dual list selector appears within a workspace or a dialog.

• In data tables, it is triggered by clicking the Columns option in the action menu.

...

Pinning columns (optional)

...

• Where defined, users can pin any column on the Chosen Columns list by clicking the pin icon, which is shown on hover. In this case:

  • The icon toggles between pinned and unpinned states.

  • The item moves to the top of the list.

  • The item can be ordered only inside the group of pinned items.

  • On a data table, pinned columns are anchored to the left. Pinned columns can be reordered only inside the group of pinned columns.

• The user can unpin the item by clicking the pin icon again.

...

• the search bar, reordering buttons and Apply button are disabled,

• a message appears within the chosen columns area, advising the user to select at least one item.

...

Exceeding the maximum number of columns

• Users can move any number of available items to the Chosen Columns list, but if the number of items in that list exceeds the maximum number:

  • The apply button is disabled.

  • An error message appears at the bottom of the popup.

• In this case, removing items so their number is equal or below the maximum reverts to the regular state.

...

Accessibility compliance

Unless otherwise specified, see our general compliance information in Fundamentals - Accessibility.

...