Skip to main content

Pivotal UI

v19.0.0
Modifiers / Selection

Selection

Use the pui-no-select modifier to prevent text from being selectable. This is useful to prevent accidental selection of the labels on checkboxes when clicking them.

It is generally not recommended to use this modifier on its own, since preventing the selection of some text may worsen the user experience. Instead of adding the class directly, use the noSelect prop on the Checkbox or Radio, which will automatically add this modifier to the text next to the input.

For the noSelect prop to take effect, you will need to import this modifier as shown below.

Classes

ModifierPurpose
pui-no-selectPrevent selection of text within an element
Using the noSelect prop on a Checkbox
ReferenceError: React is not defined

Imports

Import CSS:

import 'pivotal-ui/css/selection';