tippy have a Incorrect location

[nilaiqigenicheng]

Thank you for the package ，This package is very useful for me. Thank you again!
When my UI part is leaning to the side, it cannot be displayed accurately on top of the UI part ，I just follow the example to write my code

[nilaiqigenicheng]

this is a part of my cord , I am using package 'shinyWidgets' here .

radioGroupButtons(
                 inputId = "datatype",
                 label = NULL,
                 choices = c("upload data"="a", "sample data"="b"),
                 checkIcon = list(
                   yes = tags$i(class = "fa fa-check-square", 
                                style = "color: green"),
                   no = tags$i(class = "fa fa-square-o", 
                               style = "color: green"))
               ),
               tippyThis("datatype", "Choose how to enter data"),

And I found that it is normal sometimes , such as:

actionBttn(
                       inputId = "view_sam_data",
                       label = "View DATA",
                       style = "material-flat",
                       color = "success",
                       icon = icon("eye")
                     ),
                     tippyThis(
                       "view_sam_data",
                       "Browse all sample data"
                     )

[robertkck]

This is also the case for any minimal reproducible example. In the following example the tooltip appears in the middle of the screen regardless of the browser.

library(shiny)
library(tippy)

shinyApp(
  ui = fluidPage(
      tippy(
        element = p("Test"),
        content = "Tooltip"
      )
  ),
  server = function(input, output) {}
)

Session Info

R version 4.1.0 (2021-05-18)
Platform: x86_64-w64-mingw32/x64 (64-bit)
Running under: Windows 10 x64 (build 19042)

Matrix products: default

locale:
[1] LC_COLLATE=English_United Kingdom.1252 
[2] LC_CTYPE=English_United Kingdom.1252   
[3] LC_MONETARY=English_United Kingdom.1252
[4] LC_NUMERIC=C                           
[5] LC_TIME=English_United Kingdom.1252    

attached base packages:
[1] stats     graphics  grDevices utils     datasets  methods  
[7] base     

other attached packages:
[1] tippy_1.0.0 shiny_1.7.1

loaded via a namespace (and not attached):
 [1] Rcpp_1.0.7       digest_0.6.27    withr_2.4.3     
 [4] later_1.3.0      mime_0.12        R6_2.5.1        
 [7] jsonlite_1.7.2   lifecycle_1.0.1  xtable_1.8-4    
[10] magrittr_2.0.1   cachem_1.0.6     rlang_0.4.11    
[13] promises_1.2.0.1 jquerylib_0.1.4  bslib_0.3.1     
[16] ellipsis_0.3.2   tools_4.1.0      rsconnect_0.8.24
[19] httpuv_1.6.3     fastmap_1.1.0    compiler_4.1.0  
[22] htmltools_0.5.2  sass_0.4.0      

[robertkck]

Appears to be an issue with inline elements. Discussed here on Stack Overflow: https://stackoverflow.com/questions/70211827/position-tippy-tooltip-next-to-button-in-r-shiny/70220872

[JohnCoene]

Sorry I had not seen this issue on stackoverflow.

This is not an error the elements that has the tooltip actually takes the entire width of the page.
You could give the element a certain width (not advised).

library(shiny)
library(tippy)

shinyApp(
  ui = fluidPage(
      tippy(
        element = p("Test", style = "width:20px;"),
        content = "Tooltip"
      )
  ),
  server = function(input, output) {}
)

Better, use placement

library(shiny)
library(tippy)

shinyApp(
  ui = fluidPage(
      tippy(
        element = p("Test"),
        content = "Tooltip",
				placement = "top-start"
      )
  ),
  server = function(input, output) {}
)