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

Improve sidebar initialization #555

Merged
merged 40 commits into from
May 4, 2023
Merged
Show file tree
Hide file tree
Changes from 34 commits
Commits
Show all changes
40 commits
Select commit Hold shift + click to select a range
c125347
Use MutationSummary to watch for new sidebars
gadenbuie Apr 24, 2023
61ff86d
Small code refactor
gadenbuie Apr 24, 2023
f013b3c
Use direct event listeners instead of event delegation
gadenbuie Apr 24, 2023
fad99e6
Switch to `arrive.js` from `mutation-summary`
gadenbuie Apr 25, 2023
c01c4c2
Add a small delay before removing transitioning class
gadenbuie Apr 25, 2023
8f0cc11
recompile components
gadenbuie Apr 25, 2023
3b5d911
Use hand-crafted DocumentObserver instead of arrive.js
gadenbuie Apr 25, 2023
cef77ac
rebuild components
gadenbuie Apr 25, 2023
b930cb2
remove debugging console.logs
gadenbuie Apr 25, 2023
6364ecc
Fold DocumentObserver into Sidebar class
gadenbuie Apr 25, 2023
041ca8f
Add delay in the `transitionend` handler
gadenbuie Apr 25, 2023
f6712ce
Remove unused argument
gadenbuie Apr 26, 2023
a91c24b
If `sidebar(open = "closed")` include `hidden` attribute
gadenbuie May 3, 2023
b052d20
Resave distributed files (GitHub Action)
gadenbuie May 3, 2023
3e201f8
Resave data (GitHub Action)
gadenbuie May 3, 2023
e3e4e5c
Need to `force(id)` so it's captured in the callback
gadenbuie May 3, 2023
c21b6c9
Go back to sidebar init using `<script>` tags
gadenbuie May 4, 2023
1701102
Use `new Sidebar(layout)` pattern
gadenbuie May 4, 2023
beeb5e8
build components
gadenbuie May 4, 2023
bc913d2
Merge 'origin/main' into 'sidebar/dynamic-ui'
gadenbuie May 4, 2023
7143671
Coordinate toggle transition with sidebar collapse transition
gadenbuie May 4, 2023
1024e2d
simplify isClosed method
gadenbuie May 4, 2023
4558716
Simplify initCollapsibleAll()
gadenbuie May 4, 2023
f36ad64
Remove initialization script from DOM if possible
gadenbuie May 4, 2023
667817b
Always include sidebar initialization script
gadenbuie May 4, 2023
0dc9179
Rewrite note about our use of `transitionend` event
gadenbuie May 4, 2023
022fd4b
Add JSDoc for Sidebar
gadenbuie May 4, 2023
3ada14d
Allow `.toggle()` method to be called without arguments
gadenbuie May 4, 2023
d36ce69
rebuild javascript
gadenbuie May 4, 2023
a292d63
Remove the init scripts from initialized sidebars
gadenbuie May 4, 2023
7a9faf8
rebuild js
gadenbuie May 4, 2023
18dc734
`yarn build` (GitHub Actions)
gadenbuie May 4, 2023
d4c8164
Resave distributed files (GitHub Action)
gadenbuie May 4, 2023
30e1fcf
Resave data (GitHub Action)
gadenbuie May 4, 2023
2f981db
Minimize changes in R code
gadenbuie May 4, 2023
0cb6d58
Add note about future use of web components
gadenbuie May 4, 2023
0d69224
Remove _documentObserver
gadenbuie May 4, 2023
15bae4b
fix spelling typo in comment
gadenbuie May 4, 2023
d175ade
`yarn build` (GitHub Actions)
gadenbuie May 4, 2023
44968de
restore data attribute
gadenbuie May 4, 2023
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
39 changes: 16 additions & 23 deletions R/sidebar.R
Original file line number Diff line number Diff line change
Expand Up @@ -119,6 +119,7 @@ sidebar <- function(
id = id,
role = "complementary",
class = c("sidebar", class),
hidden = if (open == "closed") NA,
style = css(background_color = bg, color = fg),
tags$div(
class = "sidebar-content",
Expand Down Expand Up @@ -201,23 +202,18 @@ layout_sidebar <- function(
max_height_mobile <- sidebar$max_height_mobile %||%
if (is.null(height)) "250px" else "50%"

if (identical(sidebar$open, "always")) {
# sidebar initialization is only needed if collapsible
sidebar_id <- NULL
sidebar_init_js <- NULL
} else {
sidebar_id <- tagGetAttribute(sidebar$tag, "id")
sidebar_init_js <- sidebar_js_init(sidebar_id)
}
sidebar_init <- if (!identical(sidebar$open, "always")) TRUE
sidebar_border <- if (!is.null(border)) tolower(border)
sidebar_border_radius <- if (!is.null(border_radius)) tolower(border_radius)

res <- div(
class = "bslib-sidebar-layout",
class = if (right) "sidebar-right",
class = if (identical(sidebar$open, "closed")) "sidebar-collapsed",
`data-bslib-sidebar-init` = sidebar_id,
`data-bslib-sidebar-init` = sidebar_init,
`data-bslib-sidebar-open` = sidebar$open,
`data-bslib-sidebar-border` = if (!is.null(border)) tolower(border),
`data-bslib-sidebar-border-radius` = if (!is.null(border_radius)) tolower(border_radius),
`data-bslib-sidebar-border` = sidebar_border,
`data-bslib-sidebar-border-radius` = sidebar_border_radius,
style = css(
"--bslib-sidebar-width" = sidebar$width,
"--bs-card-border-color" = border_color,
Expand All @@ -226,7 +222,7 @@ layout_sidebar <- function(
),
!!!contents,
sidebar_dependency(),
sidebar_init_js
sidebar_init_js()
)

res <- bindFillRole(res, item = fill)
Expand All @@ -238,17 +234,6 @@ layout_sidebar <- function(
)
}

sidebar_js_init <- function(id) {
# Requires Shiny >= 1.7.2 and works thanks to rstudio/shiny#3630 (2022-05-09)
tags$script(
"document.currentScript.parentElement.removeChild(document.currentScript);\n",
sprintf(
"window.bslib.Sidebar.initCollapsible(document.querySelector('[data-bslib-sidebar-init=\"%s\"]'));",
id
)
)
}

#' @describeIn sidebar Toggle a `sidebar()` state during an active Shiny user
#' session.
#' @param session A Shiny session object (the default should almost always be
Expand All @@ -270,6 +255,7 @@ sidebar_toggle <- function(id, open = NULL, session = get_current_session()) {
abort('`open` must be `NULL`, `TRUE` (or "open"), or `FALSE` (or "closed").')
}

force(id)
callback <- function() {
session$sendInputMessage(id, list(method = method))
}
Expand All @@ -293,3 +279,10 @@ sidebar_dependency <- function() {
script = "sidebar.min.js"
)
}

sidebar_init_js <- function() {
tags$script(
`data-bslib-sidebar-init` = NA,
HTML("bslib.Sidebar.initCollapsibleAll()")
)
}
Binary file modified R/sysdata.rda
Binary file not shown.
2 changes: 1 addition & 1 deletion inst/components/sidebar.min.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading