The people picker (PeoplePicker) is used to select one or more entities, such as people or groups, from a list. It makes composing an email to someone, or adding them to a group, easy if you don’t know their full name or email address.

For more details and examples visit the official docs. The R package can not handle each and every case, so for advanced use cases you need to work using the original docs to achieve the desired result.

CompactPeoplePicker(...)

NormalPeoplePicker(...)

NormalPeoplePicker.shinyInput(inputId, ..., value = defaultValue)

updateNormalPeoplePicker.shinyInput(
  session = shiny::getDefaultReactiveDomain(),
  inputId,
  ...
)

Arguments

ValidationState

ValidationState

className

string
Additional CSS class(es) to apply to the PeoplePickerItem root element.

theme

ITheme
Theme provided by High-Order Component.

compact

boolean
Flag that controls whether each suggested PeoplePicker item (Persona) is rendered with or without secondary text for compact look.

personaProps

IPersonaProps
Persona props for each suggested for picking PeoplePicker item.

styles

IStyleFunctionOrObject<IPeoplePickerItemSuggestionStyleProps, IPeoplePickerItemSuggestionStyles>
Call to provide customized styling that will layer on top of the variant rules.

suggestionsProps

IBasePickerSuggestionsProps
General common props for all PeoplePicker items suggestions.

Best practices

Layout

  • Use the people picker to add someone to the To line of an email, or to add someone to a list.

  • Use the MemberList PeoplePicker to display selections below the input field.

Examples

library(shiny.fluent)

people <- tibble::tribble(
  ~key, ~imageUrl, ~imageInitials, ~text, ~secondaryText, ~tertiaryText, ~optionalText, ~isValid, ~presence, ~canExpand,
  1, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-female.png", "PV", "Annie Lindqvist", "Designer", "In a meeting", "Available at 4:00pm", TRUE, 2, NA,
  2, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png", "AR", "Aaron Reid", "Designer", "In a meeting", "Available at 4:00pm", TRUE, 6, NA,
  3, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png", "AL", "Alex Lundberg", "Software Developer", "In a meeting", "Available at 4:00pm", TRUE, 4, NA,
  4, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png", "RK", "Roko Kolar", "Financial Analyst", "In a meeting", "Available at 4:00pm", TRUE, 1, NA,
  5, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png", "CB", "Christian Bergqvist", "Sr. Designer", "In a meeting", "Available at 4:00pm", TRUE, 2, NA,
  6, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-female.png", "VL", "Valentina Lovric", "Design Developer", "In a meeting", "Available at 4:00pm", TRUE, 2, NA,
  7, "https://static2.sharepointonline.com/files/fabric/office-ui-fabric-react-assets/persona-male.png", "MS", "Maor Sharett", "UX Designer", "In a meeting", "Available at 4:00pm", TRUE, 3, NA
)

if (interactive()) {
  shinyApp(
    ui = tagList(
      textOutput("selectedPeople"),
      NormalPeoplePicker.shinyInput(
        "selectedPeople",
        options = people,
        pickerSuggestionsProps = list(
          suggestionsHeaderText = 'Matching people',
          mostRecentlyUsedHeaderText = 'Sales reps',
          noResultsFoundText = 'No results found',
          showRemoveButtons = TRUE
        )
      )
    ),
    server = function(input, output) {
      output$selectedPeople <- renderText({
        if (length(input$selectedPeople) == 0) {
          "Select recipients below:"
        } else {
          selectedPeople <- dplyr::filter(people, key %in% input$selectedPeople)
          paste("You have selected:", paste(selectedPeople$text, collapse=", "))
        }
      })
    }
  )
}