How to give breakdown of text prediction sentences in Shiny

Question

I have created a text prediction app that displays 10 sentences based on the word searched in the toolbar. However, all the sentences are being displayed in a single toolbar horizontally. I would like the sentences to appear sequentially i.e. vertically, one after another

    ui<- shinyUI(fluidPage(
  
  # Application title
  mainPanel(
   img(src='image.jpg', align = "right"),
 
  #titlePanel(title=div(img(src="spsimage.jpg"))),
  
  fluidRow(HTML("<strong> Search Bar")),
  #fluidRow(HTML(" <strong>Date: 06-29-2020</strong>") ),
  
  fluidRow(
    br(),
    p("Text predictior app ")),
  br(),
  br(),
  
  fluidRow(HTML("<strong>Enter a word. Press \"Next words\" button to predict the following words</strong>") ),
  fluidRow( p("\n") ),
  
  # Sidebar layout
  sidebarLayout(
    
    sidebarPanel(
      textInput("inputString", "Enter a word here",value = " "),
      submitButton("Next words")
    ),
    
    mainPanel(
      h4("Predicted Next Word"),
      verbatimTextOutput("prediction"),
      textOutput('text1'),
      
    )
  )
)))


server <- function(input, output, session) {
  sentences <- reactive({
    make_sentences(input$inputString)
  })
  output$prediction <- renderText({ sentences() })
}

the output is coming as - Angry look for some time for Angry glance, and the duc d’enghien Angry look was a tone or Angry tears. “Lise!” Was that? The Angry tears. “Lise!” Said princess anna Angry look as much as she Angry look for three of the Angry tears. “Lise!” Said to the Angry look fixed on with an Angry glance, and fireworks are not

I would prefer -

1- Angry look for some time for
2- Angry glance, and the duc d’enghien
3- Angry look was a tone or Angry tears. “Lise!” Was that? 
4-The Angry tears. “Lise!” Said princess anna 
5-Angry look as much as she
'''''

Answer 1

Maybe you could put the sentences in a dataframe and used renderTable, something like this:

server <- function(input, output, session) {
  sentences <- reactive({
    data.frame(sentences=make_sentences(input$inputString))
  })
  output$prediction <- renderTable(sentences())
}

---

[edit]

In order to only have them line by line something like this might work:

server <- function(input, output, session) {
  sentences <- reactive({
    paste(make_sentences(input$inputString),sep='<br/>')
  })
  output$prediction <- renderTable(sentences())
}

Alternatively you could have a numbered list by using the corresponding HTML tags: insert the whole list inside <ol> ... </ol> and every sentence in a <li> .. </li>.

Answer 2

Worked for me with some tweaks

  ui <- fluidpage(
         tags$style("#mytext {white-space: pre-line;}"),
        verbatimTextOutput("mytext")



  server <- function(input, output, session) {
             output$mytext <- renderPrint({
        
            sentences <- rep(make_sentences(input$inputString))
            length(sentences)
            cat(paste0(1:length(sentences),"  ",sentences,sep= '\n'))
        })
      }