
### dataHook
- type: string
- description: Applies a data-hook HTML attribute that can be used in the tests.
### title
- type: ReactNode
- description: Title of the modal.
- default: 'Choose Your Items'
### subtitle
- type: ReactNode
- description: Fixed text displayed above the list.
### onClose
- type: MouseEventHandler
- description: X button callback.
### onCancel
- type: MouseEventHandler
- description: Cancel button callback.
### dataSource
- type: ModalSelectorLayoutDatasourceFn
- description: paging function that should have a signature of
```typescript
(searchQuery: string, offset: number, limit: number) =>
Promise<{
 items: Array<{
   id: number | string,
   title: node,
   subtitle?: string,
   extraText?: string,
   extraNode?: node,
   disabled?: boolean // show item as disabled, dont count it in "select all", exclude from `onOk`
   selected?: boolean // force item as selected
   image?: node
   subtitleNode?: node,
   belowNode?: node,
   showBelowNodeOnSelect?: boolean,
 }>,
 totalCount: number
}>
```
`offset` - next requested item's index<br>
`limit` - number of items requested<br>
`totalCount` - total number of items that suffice the current search query.
### cancelButtonText
- type: string
- description: Cancel button's text.
- default: 'Cancel'
### okButtonText
- type: string
- description: OK button's text.
- default: 'Select'
### imageSize
- type: "small" | "tiny" | "large" | "portrait" | "cinema"
- description: Image icon size.
- default: 'large'
### imageShape
- type: "circle" | "rectangular"
- description: Image icon shape, `rectangular` or `circle`.<br>
NOTE: `circle` isn't compatible with `imageSize` of `portrait` or `cinema`
- default: 'rectangular'
### searchPlaceholder
- type: string
- description: Placeholder text of the search input.
- default: 'Search...'
### emptyState
- type: ReactNode
- description: Component/element that is rendered when there is nothing to display,
i.e. empty `{items:[], totalCount: 0}` was returned on the first call to `dataSource`
### noResultsFoundStateFactory
- type: (searchValue: string) => ReactNode
- description: Function that gets the current `searchQuery` and should return the component/element
that is rendered when there are no items that suffice the entered search query.
### itemsPerPage
- type: number
- description: Number of items loaded each time the user scrolls down.
- default: 50
### withSearch
- type: boolean
- description: Whether to display the search input or not.
- default: true
### searchDebounceMs
- type: number
- description: Search debounce in milliseconds.
### height
- type: string
- description: Height CSS property, sets the height of the modal.
- default: '100%'
### maxHeight
- type: string
- description: Max-height CSS property, sets the maximum height of the modal.
- default: '100%'
### selectAllText
- type: string
- description: Has no effect.
- deprecated
### deselectAllText
- type: string
- description: Has no effect.
- deprecated
### disableConfirmation
- type: boolean
- description: Specifies whether the OK button is disabled.
- default: false
### onSelect
- type: (item: ModalSelectorLayoutItem) => void
- description: Defines a callback function which is called when an item is selected or deselected. Receives the toggled item object.
### sideActions
- type: ReactNode
- description: Used to display some side component in the footer.
Overrides the select all element in the footer when multiple=true.
### onOk
- type: (selectedItem: ModalSelectorLayoutItem) => void | (selectedItems: ModalSelectorLayoutItem[]) => void
- description: OK button callback, called with the currently selected item.
### multiple
- type: boolean
- description: Specifies whether to display checkboxes and allow selecting multiple items.

