BulkSelect.md

section	Extensions
subsection	Component groups
id	Bulk select
source	react
propComponents	BulkSelect
sourceLink	https://github.com/patternfly/react-component-groups/blob/main/packages/module/patternfly-docs/content/extensions/component-groups/examples/BulkSelect/BulkSelect.md

import { BulkSelect, BulkSelectValue } from '@patternfly/react-component-groups/dist/dynamic/BulkSelect'; import { FunctionComponent, useState } from 'react';

The bulk select provides a way of selecting data records in batches. You can select all data at once, all data on current page or deselect all.

Examples

Basic paginated bulk select

To display a default bulk select, you need to pass number of selected items using selectedCount, the onSelect callback accepting bulk select option values and selecting data accordingly, pageCount defining number of items on the current page, pageSelected and pagePartiallySelected boolean flags to define the state os the bulk select checkbox..

Bulk select with all option

To display an option for selecting all data at once, pass canSelectAll flag together with totalCount of data entries. You can also remove the page select option by setting isDataPaginated to false,