Pop-up animations (right click, autocomplete) are misplaced

[osker130]

ExcelR is a great package, kudos to you. Unfortunately I run into issues when I place ExcelR table in a container using shiny dashboard. For instance, when using excelOutput() inside a box() or bsModal() UI element, it causes issues with pop-up animations. If I right click on a table the menu opens at a different location from where I clicked. Likewise, if I have drop-down columns, the menu will appear at the top of the page. These issues don't occur if I place the excelOutput() on its own inside a fluidPage(). Any recommendations?

[Swechhya]

@osker130 Could you add an example to replicate the issue?

[osker130]

@Swechhya thank you for your prompt response. Below is a reproducible example demonstrating the right click and drown-down context menu location problems. A few notes:

• The right click issue is more noticeable with tables located further down the page.

• The drop-down issue is not as dramatic in this example as in my actual app. But you can still see in the modal that the menu appears further down from the clicked cell than when the table is outside the modal. In other cases it can shift wildly away from the table.

• Another bug popped-up as I was preparing this example. I had not previously tried placing a modal over top of an existing excelR table. It seems that the headers "show through" the modal causing an artifact.

Any help would be appreciated!!

library(shiny)
library(excelR)
library(shinydashboard)
library(shinyBS)

ui <- function(){
  shinyUI(
    dashboardPage( #dashboardPage alone is okay
      dashboardHeader(title="Example"),
      dashboardSidebar(),
      dashboardBody(
        tags$head(tags$style(HTML('

                        .modal-lg {
                        width: 1700px;

                        }

                        body.modal-open {
                        overflow: visible;
                        }
                      '))),
        fluidPage( #fluidPage alone is okay
          fluidRow(box(width=12, excelOutput("example1"))),  #box element causes the right click context menu to be misplaced
          fluidRow(box(width=12, excelOutput("example2"))),  #the problem is more dramatic as you go down the page
          fluidRow(excelOutput("example3")),  #works okay
          actionButton("actn", "Modal"),
          bsModal("openmodal", "Drop Down Problems Too", trigger="actn",  #note location of dropdown context menu in modal
                  excelOutput("example4"), 
                  excelOutput("example5"), size="large")
          )
        )
      )
  )}

server <- function(input, output, session) {
  
  columns = tibble::tibble(title=names(iris),
                       width= rep(200, 5),
                       type=c(rep('text', 4), "dropdown"),
                       source=list(NA, NA, NA, NA, unique(iris$Species))
  )
  
  output$example1 <- renderExcel(excelTable(data=iris, columns=columns))
  output$example2 <- renderExcel(excelTable(data=iris, columns=columns))
  output$example3 <- renderExcel(excelTable(data=iris, columns=columns))
  output$example4 <- renderExcel(excelTable(data=iris, columns=columns))
  output$example5 <- renderExcel(excelTable(data=iris, columns=columns))
  
}

shinyApp(ui, server)

[Swechhya]

@osker130 this is happening due to relative positioning of col-sm-12 and box class which gets added when you use box