[Bug]: Filter feature may not be compatible with bslib >=0.11.0

[fengc1996-byte]

What happened?

The teal filter feature does not work if I upgrades bslib to 0.11.0. I did a test of calling the same code(pasted below) with bslib 0.11.0 v.s. 0.10.0, and found it's the dependency package that caused the difference.

As snapshot shows below. The filtering below 'ADSL' will not expand after clicking.

Code used for testing. Very basic one.

library(teal)
library(teal.modules.general)

demo_data <- cdisc_data()
demo_data <- within(demo_data, {
  ADSL <- data.frame(
    USUBJID = paste0("SUBJ", sprintf("%03d", 1:20)),
    AGE = c(25, 35, 45, 55, 65, 75, 30, 40, 50, 60,
            28, 38, 48, 58, 68, 32, 42, 52, 62, 72),
    SEX = as.factor(rep(c("M", "F"), 10)),
    ARM = as.factor(rep(c("Placebo", "Treatment"), each = 10)),
    SAFFL = "Y"
  )
  
  ADAE <- data.frame(
    USUBJID = rep(ADSL$USUBJID[1:15], each = 2),  # Only first 15 subjects have AEs
    AESEQ = rep(1:2, 15),
    AEDECOD = sample(c("Headache", "Nausea", "Fatigue"), 30, replace = TRUE),
    AESEV = as.factor(sample(c("MILD", "MODERATE"), 30, replace = TRUE))
  )
})

app <- teal::init(
  data = demo_data,
  modules = teal::modules(
    tm_data_table(
      label = "ADSL Data",
      dataname = "ADSL"
    ),
    tm_data_table(
      label = "ADAE Data",
      dataname = "ADAE"
    )
  )
)
  
shiny::shinyApp(app$ui, app$server)

sessionInfo()

R version 4.5.2 (2025-10-31 ucrt)
Platform: x86_64-w64-mingw32/x64
Running under: Windows 11 x64 (build 26100)

Matrix products: default
  LAPACK version 3.12.1

locale:
[1] LC_COLLATE=English_United States.utf8  LC_CTYPE=English_United States.utf8   
[3] LC_MONETARY=English_United States.utf8 LC_NUMERIC=C                          
[5] LC_TIME=English_United States.utf8    

time zone: Asia/Hong_Kong
tzcode source: internal

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

other attached packages:
 [1] DT_0.34.0                  dplyr_1.2.1                teal.modules.general_0.6.0
 [4] teal.transform_0.7.1       ggplot2_4.0.3              teal_1.1.0                
 [7] teal.slice_0.7.1           teal.data_0.8.0            teal.code_0.7.1           
[10] shiny_1.13.0              

loaded via a namespace (and not attached):
 [1] sass_0.4.10           generics_0.1.4        teal.reporter_0.6.1   digest_0.6.39        
 [5] magrittr_2.0.5        evaluate_1.0.5        grid_4.5.2            RColorBrewer_1.1-3   
 [9] fastmap_1.2.0         jsonlite_2.0.0        backports_1.5.1       promises_1.5.0       
[13] crosstalk_1.2.2       scales_1.4.0          jquerylib_0.1.4       textshaping_1.0.5    
[17] cli_3.6.6             rlang_1.2.0           yaml_2.3.12           remotes_2.5.0        
[21] withr_3.0.2           cachem_1.1.0          otel_0.2.0            tools_4.5.2          
[25] memoise_2.0.1         checkmate_2.3.4       httpuv_1.6.17         teal.widgets_0.6.0   
[29] vctrs_0.7.3           logger_0.4.2          R6_2.6.1              mime_0.13            
[33] lifecycle_1.0.5       htmlwidgets_1.6.4     fs_2.1.0              shinycssloaders_1.1.0
[37] shinyjs_2.1.1         fontawesome_0.5.3     ragg_1.5.2            pkgconfig_2.0.3      
[41] teal.logger_0.4.1     pillar_1.11.1         bslib_0.11.0          later_1.4.8          
[45] gtable_0.3.6          glue_1.8.1            Rcpp_1.1.1-1.1        systemfonts_1.3.2    
[49] xfun_0.57             tibble_3.3.1          tidyselect_1.2.1      knitr_1.51           
[53] farver_2.1.2          xtable_1.8-8          bsicons_0.1.2         htmltools_0.5.9      
[57] shinyvalidate_0.1.3   shinyWidgets_0.9.1    compiler_4.5.2        S7_0.2.2

Relevant log output

No error or warning

Code of Conduct

• I agree to follow this project's Code of Conduct.

Contribution Guidelines

• I agree to follow this project's Contribution Guidelines.

Security Policy

• I agree to follow this project's Security Policy.

[osenan]

Dear @fengc1996-byte thanks for reporting the issue. I was trying to reproduce it. I installed the last bslib package available on CRAN (same version as yours). However, I was able to run the app and view the filters:

See my sessionInfo()

R version 4.5.3 (2026-03-11)
Platform: x86_64-pc-linux-gnu
Running under: Ubuntu 22.04.5 LTS

Matrix products: default
BLAS:   /usr/lib/x86_64-linux-gnu/blas/libblas.so.3.10.0 
LAPACK: /usr/lib/x86_64-linux-gnu/lapack/liblapack.so.3.10.0  LAPACK version 3.10.0

locale:
 [1] LC_CTYPE=en_US.UTF-8       LC_NUMERIC=C              
 [3] LC_TIME=pt_BR.UTF-8        LC_COLLATE=en_US.UTF-8    
 [5] LC_MONETARY=pt_BR.UTF-8    LC_MESSAGES=en_US.UTF-8   
 [7] LC_PAPER=pt_BR.UTF-8       LC_NAME=C                 
 [9] LC_ADDRESS=C               LC_TELEPHONE=C            
[11] LC_MEASUREMENT=pt_BR.UTF-8 LC_IDENTIFICATION=C       

time zone: Europe/Madrid
tzcode source: system (glibc)

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

other attached packages:
 [1] DT_0.34.0                       dplyr_1.2.1                    
 [3] teal.modules.general_0.5.1.9012 teal.transform_0.7.1.9003      
 [5] teal.picks_0.1.0.9000           ggplot2_4.0.3                  
 [7] teal_1.1.0.9032                 teal.slice_0.7.1.9006          
 [9] teal.data_0.8.0.9002            teal.code_0.7.1                
[11] shiny_1.13.0                   

loaded via a namespace (and not attached):
 [1] sass_0.4.10              generics_0.1.4           renv_1.2.2              
 [4] teal.reporter_0.6.1.9000 digest_0.6.39            magrittr_2.0.5          
 [7] evaluate_1.0.5           grid_4.5.3               RColorBrewer_1.1-3      
[10] fastmap_1.2.0            jsonlite_2.0.0           backports_1.5.1         
[13] formatR_1.14             promises_1.5.0           crosstalk_1.2.2         
[16] scales_1.4.0             jquerylib_0.1.4          textshaping_1.0.5       
[19] cli_3.6.6                rlang_1.2.0              yaml_2.3.12             
[22] withr_3.0.2              cachem_1.1.0             otel_0.2.0              
[25] tools_4.5.3              memoise_2.0.1            checkmate_2.3.4         
[28] nanonext_1.9.0           httpuv_1.6.17            teal.widgets_0.6.0      
[31] vctrs_0.7.3              logger_0.4.2             R6_2.6.1                
[34] mime_0.13                lifecycle_1.0.5          htmlwidgets_1.6.4       
[37] fs_2.1.0                 shinycssloaders_1.1.0    shinyjs_2.1.1           
[40] fontawesome_0.5.3        ragg_1.5.2               pkgconfig_2.0.3         
[43] teal.logger_0.4.1.9004   pillar_1.11.1            bslib_0.11.0            
[46] later_1.4.8              gtable_0.3.6             glue_1.8.1              
[49] Rcpp_1.1.1-1.1           systemfonts_1.3.2        xfun_0.57               
[52] tibble_3.3.1             tidyselect_1.2.1         knitr_1.51              
[55] farver_2.1.2             xtable_1.8-8             otelsdk_0.2.2           
[58] bsicons_0.1.2            mirai_2.7.0              htmltools_0.5.9         
[61] shinyvalidate_0.1.3      shinyWidgets_0.9.1       compiler_4.5.3          
[64] S7_0.2.2  

Could you try again? Wait a little bit between once you click on the ADSL filter and wait for the menu to display, sometimes it might take miliseconds but if you click twice it opens and closes and it might seem it does not open.

I was searching for errors in the JS console but I could not find any of them with your example.

[fengc1996-byte]

Thanks @osenan for replying. I did some extra digging. The behavior of "+" works differently in bslib 0.9.0 vs 0.11.0, so the CSS or html elements behind must be different.
The working one is

.fa, .fa-brands, .fa-classic, .fa-regular, .fa-sharp, .fa-solid, .fab, .far, .fas {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    display: var(--fa-display, inline-block);
    font-style: normal;
    font-variant: normal;
    line-height: 1;
    text-rendering: auto;
}

The not working one, where the resize sidebar overlaps the "+"

@media (any-pointer: coarse) {
  .bslib-sidebar-layout .bslib-sidebar-resize-handle {
    pointer-events: auto;
    cursor: ew-resize;
  }
}

A potential reason is that my PC has a touchable screen. The .bslib-sidebar-resize-handle element overlaps the + button for devices or when the browser detects any-pointer: coarse, it becomes interactive and takes over the cursor. Seems the resize sidebar was imported in bslib 0.10.0. Could it be a layout issue — specifically how the filter panel is nested inside the bslib sidebar, causing the resize handle to overlap the filter collapse button.