Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add vfill-item CSS class when height isn't specified by user #437

Closed
wants to merge 5 commits into from

Conversation

cpsievert
Copy link
Collaborator

@cpsievert cpsievert commented Sep 27, 2022

With this PR, the htmlwidget's HTML container gains a .vfill-item CSS class when height is NULL (on the widget instance when statically rendered or shinyWidgetOutput() when rendered in shiny).

The primary motivation for this is so widgets can fill as needed inside bslib::card_body_fill() (#452); but more generally, it allows widgets (with height of NULL) to fill any HTML element with a .vfill-container class (when used with {bslib}, since those CSS classes are provided by bs_theme()), for example:

library(bslib)
library(htmltools)

browsable(page_fluid(
    theme = bs_theme(),
    style = "height:100vh", 
    class = "vfill-container",
    plotly::plot_ly()
))

This means, at least for widgets that follow the recommended R binding approach, statically rendered widgets (such as above) won't need any changes to fill by default (within a vfill-container). However, the recommend Shiny binding approach of

sigmaOutput <- function(outputId, width = "100%", height = "400px") {
  shinyWidgetOutput(outputId, "sigma", width, height, package = "sigma")
}

will change to

sigmaOutput <- function(outputId, width = NULL, height = NULL) {
  shinyWidgetOutput(outputId, "sigma", width, height, package = "sigma")
}

and default sizing should instead be provided through a CSS file, providing something like:

.sigma.html-widget {
  width: 100%;
  height: 400px;
}

TODO

Update website (and the sigma package?) to reflect the new default sizing approach

This gives widgets the potential to stretch vertically when used inside a vfill-container like shiny::fillPage(), bslib::card(), etc
@cpsievert
Copy link
Collaborator Author

cpsievert commented Oct 21, 2022

Closing in favor of #442

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

1 participant