How to text wrap choices from a pickerInput, If the length of the choices are long the choices often end up outside the screen

Question

The choices in the pickerInput always come in single line. Is there a way in which they can be brought to the next line? This is a problem when the length of the choice is very long making the choice go out of the screen. I specifically need pickerInput because it has live search, select all/deselect all feature in it.

library("shiny")
library("shinyWidgets")
ui <- fluidPage(
  pickerInput(inputId="id",label="Some name",
    choices=c("Choice 1 is small","Choice 2 is average sized",
    "But choice 3 is very  big and sometimes when the length of the qption is long it leaves the screen, so I need a UI fix to wrap the question to fit the width of the pickerInput. I want pickerInput because it has select all/deselect all button."),
    selected=NULL,multiple=T,options=list(`actions-box`=TRUE,size=10,`selected-text-format`="count > 3")
  )
)
server <- function(input, output, session) {}
shinyApp(ui = ui, server = server)

Answer 1

Here's two solutions, both use choicesOpt argument to prevent modifying the value server-side.

1. Truncate your string to fix width

I used stringr::str_trunc :

library("shiny")
library("shinyWidgets")

my_choices <- c(
  "Choice 1 is small","Choice 2 is average sized",
  "But choice 3 is very  big and sometimes when the length of the qption is long it leaves the screen, so I need a UI fix to wrap the question to fit the width of the pickerInput. I want pickerInput because it has select all/deselect all button."
)

ui <- fluidPage(

  pickerInput(
    inputId = "id",
    label = "Some name",
    choices = my_choices,
    selected = NULL,
    multiple = TRUE, 
    options = list(
      `actions-box` = TRUE, size = 10, `selected-text-format` = "count > 3"
    ),
    choicesOpt = list(
      content = stringr::str_trunc(my_choices, width = 75)
    )
  ),
  verbatimTextOutput(outputId = "res")
)

server <- function(input, output, session) {
  output$res <- renderPrint(input$id)
}

shinyApp(ui = ui, server = server)

2. Insert break lines

I used stringr::str_wrap to breaks text paragraphs into lines, then stringr::str_replace_all to replace \n with <br> (HTML version of \n)

library("shiny")
library("shinyWidgets")

my_choices <- c(
  "Choice 1 is small","Choice 2 is average sized",
  "But choice 3 is very  big and sometimes when the length of the qption is long it leaves the screen, so I need a UI fix to wrap the question to fit the width of the pickerInput. I want pickerInput because it has select all/deselect all button."
)
my_choices2 <- stringr::str_wrap(my_choices, width = 80)
my_choices2 <- stringr::str_replace_all(my_choices2, "\\n", "<br>")

ui <- fluidPage(

  # tags$style(".text {width: 200px !important; word-break: break-all; word-wrap: break-word;}"),
  pickerInput(
    inputId = "id",
    label = "Some name",
    choices = my_choices,
    selected = NULL,
    multiple = TRUE, 
    options = list(
      `actions-box` = TRUE, size = 10, `selected-text-format` = "count > 3"
    ),
    choicesOpt = list(
      content = my_choices2
    )
  ),
  verbatimTextOutput(outputId = "res")
)

server <- function(input, output, session) {
  output$res <- renderPrint(input$id)
}

shinyApp(ui = ui, server = server)