MultipleCollaboratorField

Used for selecting multiple collaborators.

Getting started

npm install @cmds/multiple-collaborator-field --save

Prop Types

| Property | Type | Required? | Description | |:---|:---|:---:|:---| | id | String | ✓ | Unique id for the instance of this field | | contextId | Context | ✓ | The appearance will change depending on context in which the field is displayed. Valid options include: recordDetail or recordGridRow or recordGalleryCard or recordListItem | | roleId | Role | ✓ | The behaviour changes based on the role. Valid options include editor or readOnly | | collaborators | Array | ✓ | List of collaborators that can be selected | | collaboratorIds | Array | | List of selected collaborators | | onCollaboratorLink | Function | | Callback invoked whenever a collaborator get's added to the selection: ({id: string, collaboratorId: string}): void | | onCollaboratorUnlink | Function | | Callback invoked whenever a collaborator get's removed from the selection: ({id: string, collaboratorId: string}): void |

import MultipleCollaboratorField from '@cmds/multiple-collaborator-field'

<MultipleCollaboratorField
    id={'fld1'}
    contextId={'recordGalleryCard'}
    roleId={'readOnly'}
    collaborators={[{
        id: 'col1',
        name: 'Luke Skywalker'
    }, {
        id: 'col2',
        name: 'Leia Organa'
    }]}
    collaboratorIds={['col1']}
    onCollaboratorLink={({id, collaboratorId}) => {
        // do something
    }}
    onCollaboratorUnlink={({id, collaboratorId}) => {
        // do something
    }}
/>

More information

This component is designed and developed as part of Cosmos Design System.