From fc690f02a3a09f46831c4acd21cf7d3b026bb84d Mon Sep 17 00:00:00 2001 From: DivadNojnarg Date: Tue, 3 Sep 2024 19:39:01 +0000 Subject: [PATCH] =?UTF-8?q?Deploying=20to=20gh-pages=20from=20@=20RinteRfa?= =?UTF-8?q?ce/bs4Dash@fe12d3f08a73d0fd42351140484e87eb8b76f1dd=20?= =?UTF-8?q?=F0=9F=9A=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- 404.html | 171 +- CNAME | 1 + CODE_OF_CONDUCT.html | 140 +- LICENSE-text.html | 139 +- articles/bs4Dash.html | 191 +- .../bslib-component-css-0.8.0/components.css | 1 + .../bslib-component-css-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../bslib-component-js-0.8.0/components.css | 1 + .../bslib-component-js-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../dist/components.css | 1 + .../dist/components.js | 1364 ++ .../dist/components.js.map | 7 + .../dist/components.min.js | 15 + .../dist/components.min.js.map | 7 + .../dist/web-components.js | 2188 ++++ .../dist/web-components.js.map | 7 + .../dist/web-components.min.js | 325 + .../dist/web-components.min.js.map | 7 + .../dist/webComponents/webComponents.min.js | 122 + .../scss/accordion.scss | 21 + .../bslib-tag-require-0.8.0/scss/card.scss | 165 + .../bslib-tag-require-0.8.0/scss/grid.scss | 57 + .../scss/mixins/_mixins.scss | 36 + .../scss/nav_spacer.scss | 41 + .../scss/page_fillable.scss | 36 + .../scss/page_navbar.scss | 39 + .../scss/page_sidebar.scss | 60 + .../bslib-tag-require-0.8.0/scss/sidebar.scss | 465 + .../scss/value_box.scss | 216 + .../bslib-tag-require-0.8.0/tag-require.js | 14 + .../htmltools-fill-0.5.8.1/fill.css | 21 + articles/css-preloader.html | 193 +- .../bslib-component-css-0.8.0/components.css | 1 + .../bslib-component-css-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../bslib-component-js-0.8.0/components.css | 1 + .../bslib-component-js-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../dist/components.css | 1 + .../dist/components.js | 1364 ++ .../dist/components.js.map | 7 + .../dist/components.min.js | 15 + .../dist/components.min.js.map | 7 + .../dist/web-components.js | 2188 ++++ .../dist/web-components.js.map | 7 + .../dist/web-components.min.js | 325 + .../dist/web-components.min.js.map | 7 + .../dist/webComponents/webComponents.min.js | 122 + .../scss/accordion.scss | 21 + .../bslib-tag-require-0.8.0/scss/card.scss | 165 + .../bslib-tag-require-0.8.0/scss/grid.scss | 57 + .../scss/mixins/_mixins.scss | 36 + .../scss/nav_spacer.scss | 41 + .../scss/page_fillable.scss | 36 + .../scss/page_navbar.scss | 39 + .../scss/page_sidebar.scss | 60 + .../bslib-tag-require-0.8.0/scss/sidebar.scss | 465 + .../scss/value_box.scss | 216 + .../bslib-tag-require-0.8.0/tag-require.js | 14 + .../htmltools-fill-0.5.8.1/fill.css | 21 + articles/extra-elements.html | 352 +- .../bslib-component-css-0.8.0/components.css | 1 + .../bslib-component-css-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../bslib-component-js-0.8.0/components.css | 1 + .../bslib-component-js-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../dist/components.css | 1 + .../dist/components.js | 1364 ++ .../dist/components.js.map | 7 + .../dist/components.min.js | 15 + .../dist/components.min.js.map | 7 + .../dist/web-components.js | 2188 ++++ .../dist/web-components.js.map | 7 + .../dist/web-components.min.js | 325 + .../dist/web-components.min.js.map | 7 + .../dist/webComponents/webComponents.min.js | 122 + .../scss/accordion.scss | 21 + .../bslib-tag-require-0.8.0/scss/card.scss | 165 + .../bslib-tag-require-0.8.0/scss/grid.scss | 57 + .../scss/mixins/_mixins.scss | 36 + .../scss/nav_spacer.scss | 41 + .../scss/page_fillable.scss | 36 + .../scss/page_navbar.scss | 39 + .../scss/page_sidebar.scss | 60 + .../bslib-tag-require-0.8.0/scss/sidebar.scss | 465 + .../scss/value_box.scss | 216 + .../bslib-tag-require-0.8.0/tag-require.js | 14 + .../htmltools-fill-0.5.8.1/fill.css | 21 + articles/improved-boxes.html | 498 +- .../bslib-component-css-0.8.0/components.css | 1 + .../bslib-component-css-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../bslib-component-js-0.8.0/components.css | 1 + .../bslib-component-js-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../dist/components.css | 1 + .../dist/components.js | 1364 ++ .../dist/components.js.map | 7 + .../dist/components.min.js | 15 + .../dist/components.min.js.map | 7 + .../dist/web-components.js | 2188 ++++ .../dist/web-components.js.map | 7 + .../dist/web-components.min.js | 325 + .../dist/web-components.min.js.map | 7 + .../dist/webComponents/webComponents.min.js | 122 + .../scss/accordion.scss | 21 + .../bslib-tag-require-0.8.0/scss/card.scss | 165 + .../bslib-tag-require-0.8.0/scss/grid.scss | 57 + .../scss/mixins/_mixins.scss | 36 + .../scss/nav_spacer.scss | 41 + .../scss/page_fillable.scss | 36 + .../scss/page_navbar.scss | 39 + .../scss/page_sidebar.scss | 60 + .../bslib-tag-require-0.8.0/scss/sidebar.scss | 465 + .../scss/value_box.scss | 216 + .../bslib-tag-require-0.8.0/tag-require.js | 14 + .../htmltools-fill-0.5.8.1/fill.css | 21 + articles/index.html | 134 +- articles/more-skins.html | 285 +- .../bslib-component-css-0.8.0/components.css | 1 + .../bslib-component-css-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../bslib-component-js-0.8.0/components.css | 1 + .../bslib-component-js-0.8.0/components.js | 1364 ++ .../components.js.map | 7 + .../components.min.js | 15 + .../components.min.js.map | 7 + .../web-components.js | 2188 ++++ .../web-components.js.map | 7 + .../web-components.min.js | 325 + .../web-components.min.js.map | 7 + .../webComponents/webComponents.min.js | 122 + .../dist/components.css | 1 + .../dist/components.js | 1364 ++ .../dist/components.js.map | 7 + .../dist/components.min.js | 15 + .../dist/components.min.js.map | 7 + .../dist/web-components.js | 2188 ++++ .../dist/web-components.js.map | 7 + .../dist/web-components.min.js | 325 + .../dist/web-components.min.js.map | 7 + .../dist/webComponents/webComponents.min.js | 122 + .../scss/accordion.scss | 21 + .../bslib-tag-require-0.8.0/scss/card.scss | 165 + .../bslib-tag-require-0.8.0/scss/grid.scss | 57 + .../scss/mixins/_mixins.scss | 36 + .../scss/nav_spacer.scss | 41 + .../scss/page_fillable.scss | 36 + .../scss/page_navbar.scss | 39 + .../scss/page_sidebar.scss | 60 + .../bslib-tag-require-0.8.0/scss/sidebar.scss | 465 + .../scss/value_box.scss | 216 + .../bslib-tag-require-0.8.0/tag-require.js | 14 + .../htmltools-fill-0.5.8.1/fill.css | 21 + articles/step-by-step.html | 156 +- authors.html | 150 +- deps/bootstrap-5.3.1/bootstrap.bundle.min.js | 7 + .../bootstrap.bundle.min.js.map | 1 + deps/bootstrap-5.3.1/bootstrap.min.css | 5 + deps/bootstrap-toc-1.0.1/bootstrap-toc.min.js | 5 + deps/clipboard.js-2.0.11/clipboard.min.js | 7 + deps/data-deps.txt | 13 + deps/font-awesome-6.4.2/css/all.css | 7968 +++++++++++ deps/font-awesome-6.4.2/css/all.min.css | 9 + deps/font-awesome-6.4.2/css/v4-shims.css | 2194 ++++ deps/font-awesome-6.4.2/css/v4-shims.min.css | 6 + .../webfonts/fa-brands-400.ttf | Bin 0 -> 189684 bytes .../webfonts/fa-brands-400.woff2 | Bin 0 -> 109808 bytes .../webfonts/fa-regular-400.ttf | Bin 0 -> 63348 bytes .../webfonts/fa-regular-400.woff2 | Bin 0 -> 24488 bytes .../webfonts/fa-solid-900.ttf | Bin 0 -> 394668 bytes .../webfonts/fa-solid-900.woff2 | Bin 0 -> 150020 bytes .../webfonts/fa-v4compatibility.ttf | Bin 0 -> 10172 bytes .../webfonts/fa-v4compatibility.woff2 | Bin 0 -> 4568 bytes deps/headroom-0.11.0/headroom.min.js | 7 + deps/headroom-0.11.0/jQuery.headroom.min.js | 7 + deps/jquery-3.6.0/jquery-3.6.0.js | 10881 ++++++++++++++++ deps/jquery-3.6.0/jquery-3.6.0.min.js | 2 + deps/jquery-3.6.0/jquery-3.6.0.min.map | 1 + deps/search-1.0.0/autocomplete.jquery.min.js | 7 + deps/search-1.0.0/fuse.min.js | 9 + deps/search-1.0.0/mark.min.js | 7 + extra.css | 24 + extra.js | 18 +- index.html | 196 +- katex-auto.js | 14 + lightswitch.js | 85 + news/index.html | 159 +- pkgdown.js | 176 +- pkgdown.yml | 5 +- reference/accordion.html | 162 +- reference/accordionItem.html | 8 + reference/actionButton.html | 168 +- reference/addPopover.html | 8 + reference/addTooltip.html | 8 + reference/alert.html | 160 +- reference/appButton.html | 160 +- reference/app_container.html | 149 +- reference/attachmentBlock.html | 164 +- reference/badge.html | 160 +- reference/blockQuote.html | 8 + reference/box.html | 168 +- reference/boxComment.html | 8 + reference/boxDropdown.html | 160 +- reference/boxDropdownItem.html | 8 + reference/boxLabel.html | 159 +- reference/boxLayout.html | 165 +- reference/boxPad.html | 8 + reference/boxProfile.html | 165 +- reference/boxProfileItem.html | 8 + reference/boxSidebar.html | 157 +- reference/bs4AccordionItem.html | 8 + reference/bs4Card.html | 8 + reference/bs4CarouselItem.html | 8 + reference/bs4DashGallery.html | 149 +- reference/bs4InfoBox.html | 8 + reference/bs4InfoBoxOutput.html | 8 + reference/bs4ListGroupItem.html | 8 + reference/bs4MultiProgressBar.html | 8 + reference/bs4SidebarHeader.html | 8 + reference/bs4SidebarMenu.html | 8 + reference/bs4SidebarMenuItem.html | 8 + reference/bs4SidebarMenuSubItem.html | 8 + reference/bs4SidebarUserPanel.html | 8 + reference/bs4TabItem.html | 8 + reference/bs4TabItems.html | 8 + reference/bs4TableItem.html | 8 + reference/bs4TableItems.html | 8 + reference/bs4TimelineEnd.html | 8 + reference/bs4TimelineItem.html | 8 + reference/bs4TimelineItemMedia.html | 8 + reference/bs4TimelineLabel.html | 8 + reference/bs4TimelineStart.html | 8 + reference/bs4UserDescription.html | 8 + reference/bs4ValueBox.html | 8 + reference/bs4ValueBoxOutput.html | 8 + reference/callout.html | 157 +- reference/cardComment.html | 8 + reference/cardDropdownItem.html | 8 + reference/cardLabel.html | 8 + reference/cardPad.html | 8 + reference/cardProfileItem.html | 8 + reference/cardSidebar.html | 8 + reference/carousel.html | 164 +- reference/carouselItem.html | 8 + reference/closeAlert.html | 8 + reference/column.html | 156 +- reference/controlbarItem.html | 8 + reference/controlbarMenu.html | 8 + reference/dashboardBadge.html | 8 + reference/dashboardBody.html | 161 +- reference/dashboardBrand.html | 157 +- reference/dashboardControlbar.html | 157 +- reference/dashboardFooter.html | 153 +- reference/dashboardHeader.html | 156 +- reference/dashboardPage.html | 157 +- reference/dashboardSidebar.html | 176 +- reference/dashboardUser.html | 162 +- reference/dashboardUserItem.html | 8 + reference/dropdownDivider.html | 153 +- reference/dropdownHeader.html | 153 +- reference/dropdownMenu.html | 167 +- reference/dropdownMenuOutput.html | 153 +- reference/findSidebarItem.html | 152 +- reference/getAdminLTEColors.html | 144 +- reference/index.html | 1208 +- reference/infoBox.html | 161 +- reference/infoBoxOutput.html | 8 + reference/insertTab.html | 153 +- reference/ionicon.html | 161 +- reference/jumbotron.html | 157 +- reference/listGroup.html | 8 + reference/listGroupItem.html | 8 + reference/listgroup.html | 160 +- reference/loading.html | 157 +- reference/loadingState.html | 8 + reference/menuItem.html | 8 + reference/menuItemOutput.html | 153 +- reference/menuOutput.html | 161 +- reference/menuSubItem.html | 8 + reference/messageItem.html | 8 + reference/multiProgressBar.html | 8 + reference/navbar-menu.html | 161 +- reference/navbarDropdown.html | 149 +- reference/navbarMenu.html | 8 + reference/notificationItem.html | 8 + reference/pagination.html | 160 +- reference/paginationItem.html | 8 + reference/popover.html | 162 +- reference/productList.html | 161 +- reference/productListItem.html | 8 + reference/progress.html | 161 +- reference/progressBar.html | 8 + reference/quote.html | 157 +- reference/removePopover.html | 8 + reference/removeTooltip.html | 8 + reference/renderInfoBox.html | 8 + reference/renderMenu.html | 157 +- reference/renderUser.html | 8 + reference/renderValueBox.html | 8 + reference/ribbon.html | 157 +- reference/sidebarHeader.html | 8 + reference/sidebarMenu.html | 8 + reference/sidebarMenuOutput.html | 153 +- reference/sidebarUserPanel.html | 8 + reference/skinSelector.html | 149 +- reference/socialBox.html | 165 +- reference/sortable.html | 157 +- reference/starBlock.html | 8 + reference/stars.html | 157 +- reference/tabBox.html | 165 +- reference/tabItem.html | 8 + reference/tabItems.html | 8 + reference/table.html | 161 +- reference/tabsetPanel.html | 161 +- reference/tagAssert.html | 149 +- reference/taskItem.html | 8 + reference/timeline.html | 173 +- reference/timelineBlock.html | 8 + reference/timelineEnd.html | 8 + reference/timelineItem.html | 8 + reference/timelineItemMedia.html | 8 + reference/timelineLabel.html | 8 + reference/timelineStart.html | 8 + reference/toast.html | 153 +- reference/tooltip.html | 162 +- reference/updateAccordion.html | 8 + reference/updateBox.html | 8 + reference/updateBoxSidebar.html | 8 + reference/updateCard.html | 8 + reference/updateCardSidebar.html | 8 + reference/updateControlbar.html | 8 + reference/updateControlbarMenu.html | 8 + reference/updateNavbarTabs.html | 8 + reference/updatePagination.html | 8 + reference/updateSidebar.html | 8 + reference/updateTabItems.html | 8 + reference/updateUserMessages.html | 8 + reference/updatebs4Card.html | 8 + reference/updatebs4CardSidebar.html | 8 + reference/updatebs4Sidebar.html | 8 + reference/updatebs4TabItems.html | 8 + reference/useAutoColor.html | 161 +- reference/userBlock.html | 8 + reference/userBox.html | 164 +- reference/userDescription.html | 8 + reference/userList.html | 160 +- reference/userListItem.html | 8 + reference/userMessage.html | 162 +- reference/userOutput.html | 8 + reference/userPost.html | 165 +- reference/userPostMedia.html | 153 +- reference/userPostTagItem.html | 8 + reference/userPostTagItems.html | 8 + reference/validColors.html | 148 +- reference/validNuances.html | 149 +- reference/validStatuses.html | 149 +- reference/validStatusesPlus.html | 141 +- reference/valueBox.html | 166 +- reference/valueBoxOutput.html | 8 + search.json | 1 + sitemap.xml | 170 +- 428 files changed, 94138 insertions(+), 9983 deletions(-) create mode 100644 CNAME create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/components.css create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/components.js create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/components.js.map create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/components.min.js create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/components.min.js.map create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.js create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.js.map create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.min.js create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.min.js.map create mode 100644 articles/bs4Dash_files/bslib-component-css-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/components.css create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/components.js create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/components.js.map create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/components.min.js create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/components.min.js.map create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/web-components.js create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/web-components.js.map create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/web-components.min.js create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/web-components.min.js.map create mode 100644 articles/bs4Dash_files/bslib-component-js-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/components.css create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/components.js create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/components.js.map create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/components.min.js create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/components.min.js.map create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/web-components.js create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/web-components.js.map create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/web-components.min.js create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/web-components.min.js.map create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/dist/webComponents/webComponents.min.js create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/accordion.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/card.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/grid.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/mixins/_mixins.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/nav_spacer.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/page_fillable.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/page_navbar.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/page_sidebar.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/sidebar.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/scss/value_box.scss create mode 100644 articles/bs4Dash_files/bslib-tag-require-0.8.0/tag-require.js create mode 100644 articles/bs4Dash_files/htmltools-fill-0.5.8.1/fill.css create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/components.css create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/components.js create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/components.js.map create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/components.min.js create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/components.min.js.map create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/web-components.js create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/web-components.js.map create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/web-components.min.js create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/web-components.min.js.map create mode 100644 articles/css-preloader_files/bslib-component-css-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/components.css create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/components.js create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/components.js.map create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/components.min.js create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/components.min.js.map create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/web-components.js create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/web-components.js.map create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/web-components.min.js create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/web-components.min.js.map create mode 100644 articles/css-preloader_files/bslib-component-js-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/components.css create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/components.js create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/components.js.map create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/components.min.js create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/components.min.js.map create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/web-components.js create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/web-components.js.map create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/web-components.min.js create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/web-components.min.js.map create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/dist/webComponents/webComponents.min.js create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/accordion.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/card.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/grid.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/mixins/_mixins.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/nav_spacer.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/page_fillable.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/page_navbar.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/page_sidebar.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/sidebar.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/scss/value_box.scss create mode 100644 articles/css-preloader_files/bslib-tag-require-0.8.0/tag-require.js create mode 100644 articles/css-preloader_files/htmltools-fill-0.5.8.1/fill.css create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/components.css create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/components.js create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/components.js.map create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/components.min.js create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/components.min.js.map create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/web-components.js create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/web-components.js.map create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/web-components.min.js create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/web-components.min.js.map create mode 100644 articles/extra-elements_files/bslib-component-css-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/components.css create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/components.js create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/components.js.map create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/components.min.js create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/components.min.js.map create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/web-components.js create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/web-components.js.map create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/web-components.min.js create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/web-components.min.js.map create mode 100644 articles/extra-elements_files/bslib-component-js-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/components.css create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/components.js create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/components.js.map create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/components.min.js create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/components.min.js.map create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/web-components.js create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/web-components.js.map create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/web-components.min.js create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/web-components.min.js.map create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/dist/webComponents/webComponents.min.js create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/accordion.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/card.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/grid.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/mixins/_mixins.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/nav_spacer.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/page_fillable.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/page_navbar.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/page_sidebar.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/sidebar.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/scss/value_box.scss create mode 100644 articles/extra-elements_files/bslib-tag-require-0.8.0/tag-require.js create mode 100644 articles/extra-elements_files/htmltools-fill-0.5.8.1/fill.css create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/components.css create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/components.js create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/components.js.map create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/components.min.js create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/components.min.js.map create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/web-components.js create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/web-components.js.map create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/web-components.min.js create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/web-components.min.js.map create mode 100644 articles/improved-boxes_files/bslib-component-css-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/components.css create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/components.js create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/components.js.map create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/components.min.js create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/components.min.js.map create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/web-components.js create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/web-components.js.map create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/web-components.min.js create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/web-components.min.js.map create mode 100644 articles/improved-boxes_files/bslib-component-js-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/components.css create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/components.js create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/components.js.map create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/components.min.js create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/components.min.js.map create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/web-components.js create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/web-components.js.map create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/web-components.min.js create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/web-components.min.js.map create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/dist/webComponents/webComponents.min.js create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/accordion.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/card.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/grid.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/mixins/_mixins.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/nav_spacer.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/page_fillable.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/page_navbar.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/page_sidebar.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/sidebar.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/scss/value_box.scss create mode 100644 articles/improved-boxes_files/bslib-tag-require-0.8.0/tag-require.js create mode 100644 articles/improved-boxes_files/htmltools-fill-0.5.8.1/fill.css create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/components.css create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/components.js create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/components.js.map create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/components.min.js create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/components.min.js.map create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/web-components.js create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/web-components.js.map create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/web-components.min.js create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/web-components.min.js.map create mode 100644 articles/more-skins_files/bslib-component-css-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/components.css create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/components.js create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/components.js.map create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/components.min.js create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/components.min.js.map create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/web-components.js create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/web-components.js.map create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/web-components.min.js create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/web-components.min.js.map create mode 100644 articles/more-skins_files/bslib-component-js-0.8.0/webComponents/webComponents.min.js create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/components.css create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/components.js create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/components.js.map create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/components.min.js create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/components.min.js.map create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/web-components.js create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/web-components.js.map create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/web-components.min.js create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/web-components.min.js.map create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/dist/webComponents/webComponents.min.js create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/accordion.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/card.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/grid.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/mixins/_mixins.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/nav_spacer.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/page_fillable.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/page_navbar.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/page_sidebar.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/sidebar.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/scss/value_box.scss create mode 100644 articles/more-skins_files/bslib-tag-require-0.8.0/tag-require.js create mode 100644 articles/more-skins_files/htmltools-fill-0.5.8.1/fill.css create mode 100644 deps/bootstrap-5.3.1/bootstrap.bundle.min.js create mode 100644 deps/bootstrap-5.3.1/bootstrap.bundle.min.js.map create mode 100644 deps/bootstrap-5.3.1/bootstrap.min.css create mode 100644 deps/bootstrap-toc-1.0.1/bootstrap-toc.min.js create mode 100644 deps/clipboard.js-2.0.11/clipboard.min.js create mode 100644 deps/data-deps.txt create mode 100644 deps/font-awesome-6.4.2/css/all.css create mode 100644 deps/font-awesome-6.4.2/css/all.min.css create mode 100644 deps/font-awesome-6.4.2/css/v4-shims.css create mode 100644 deps/font-awesome-6.4.2/css/v4-shims.min.css create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-brands-400.ttf create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-brands-400.woff2 create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-regular-400.ttf create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-regular-400.woff2 create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-solid-900.ttf create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-solid-900.woff2 create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-v4compatibility.ttf create mode 100644 deps/font-awesome-6.4.2/webfonts/fa-v4compatibility.woff2 create mode 100644 deps/headroom-0.11.0/headroom.min.js create mode 100644 deps/headroom-0.11.0/jQuery.headroom.min.js create mode 100644 deps/jquery-3.6.0/jquery-3.6.0.js create mode 100644 deps/jquery-3.6.0/jquery-3.6.0.min.js create mode 100644 deps/jquery-3.6.0/jquery-3.6.0.min.map create mode 100644 deps/search-1.0.0/autocomplete.jquery.min.js create mode 100644 deps/search-1.0.0/fuse.min.js create mode 100644 deps/search-1.0.0/mark.min.js create mode 100644 katex-auto.js create mode 100644 lightswitch.js create mode 100644 reference/accordionItem.html create mode 100644 reference/addPopover.html create mode 100644 reference/addTooltip.html create mode 100644 reference/blockQuote.html create mode 100644 reference/boxComment.html create mode 100644 reference/boxDropdownItem.html create mode 100644 reference/boxPad.html create mode 100644 reference/boxProfileItem.html create mode 100644 reference/bs4AccordionItem.html create mode 100644 reference/bs4Card.html create mode 100644 reference/bs4CarouselItem.html create mode 100644 reference/bs4InfoBox.html create mode 100644 reference/bs4InfoBoxOutput.html create mode 100644 reference/bs4ListGroupItem.html create mode 100644 reference/bs4MultiProgressBar.html create mode 100644 reference/bs4SidebarHeader.html create mode 100644 reference/bs4SidebarMenu.html create mode 100644 reference/bs4SidebarMenuItem.html create mode 100644 reference/bs4SidebarMenuSubItem.html create mode 100644 reference/bs4SidebarUserPanel.html create mode 100644 reference/bs4TabItem.html create mode 100644 reference/bs4TabItems.html create mode 100644 reference/bs4TableItem.html create mode 100644 reference/bs4TableItems.html create mode 100644 reference/bs4TimelineEnd.html create mode 100644 reference/bs4TimelineItem.html create mode 100644 reference/bs4TimelineItemMedia.html create mode 100644 reference/bs4TimelineLabel.html create mode 100644 reference/bs4TimelineStart.html create mode 100644 reference/bs4UserDescription.html create mode 100644 reference/bs4ValueBox.html create mode 100644 reference/bs4ValueBoxOutput.html create mode 100644 reference/cardComment.html create mode 100644 reference/cardDropdownItem.html create mode 100644 reference/cardLabel.html create mode 100644 reference/cardPad.html create mode 100644 reference/cardProfileItem.html create mode 100644 reference/cardSidebar.html create mode 100644 reference/carouselItem.html create mode 100644 reference/closeAlert.html create mode 100644 reference/controlbarItem.html create mode 100644 reference/controlbarMenu.html create mode 100644 reference/dashboardBadge.html create mode 100644 reference/dashboardUserItem.html create mode 100644 reference/infoBoxOutput.html create mode 100644 reference/listGroup.html create mode 100644 reference/listGroupItem.html create mode 100644 reference/loadingState.html create mode 100644 reference/menuItem.html create mode 100644 reference/menuSubItem.html create mode 100644 reference/messageItem.html create mode 100644 reference/multiProgressBar.html create mode 100644 reference/navbarMenu.html create mode 100644 reference/notificationItem.html create mode 100644 reference/paginationItem.html create mode 100644 reference/productListItem.html create mode 100644 reference/progressBar.html create mode 100644 reference/removePopover.html create mode 100644 reference/removeTooltip.html create mode 100644 reference/renderInfoBox.html create mode 100644 reference/renderUser.html create mode 100644 reference/renderValueBox.html create mode 100644 reference/sidebarHeader.html create mode 100644 reference/sidebarMenu.html create mode 100644 reference/sidebarUserPanel.html create mode 100644 reference/starBlock.html create mode 100644 reference/tabItem.html create mode 100644 reference/tabItems.html create mode 100644 reference/taskItem.html create mode 100644 reference/timelineBlock.html create mode 100644 reference/timelineEnd.html create mode 100644 reference/timelineItem.html create mode 100644 reference/timelineItemMedia.html create mode 100644 reference/timelineLabel.html create mode 100644 reference/timelineStart.html create mode 100644 reference/updateAccordion.html create mode 100644 reference/updateBox.html create mode 100644 reference/updateBoxSidebar.html create mode 100644 reference/updateCard.html create mode 100644 reference/updateCardSidebar.html create mode 100644 reference/updateControlbar.html create mode 100644 reference/updateControlbarMenu.html create mode 100644 reference/updateNavbarTabs.html create mode 100644 reference/updatePagination.html create mode 100644 reference/updateSidebar.html create mode 100644 reference/updateTabItems.html create mode 100644 reference/updateUserMessages.html create mode 100644 reference/updatebs4Card.html create mode 100644 reference/updatebs4CardSidebar.html create mode 100644 reference/updatebs4Sidebar.html create mode 100644 reference/updatebs4TabItems.html create mode 100644 reference/userBlock.html create mode 100644 reference/userDescription.html create mode 100644 reference/userListItem.html create mode 100644 reference/userOutput.html create mode 100644 reference/userPostTagItem.html create mode 100644 reference/userPostTagItems.html create mode 100644 reference/valueBoxOutput.html create mode 100644 search.json diff --git a/404.html b/404.html index ed9a057a..683b48f5 100644 --- a/404.html +++ b/404.html @@ -4,150 +4,89 @@ - + Page not found (404) • bs4Dash - - - - - - - - - - - - - - - + + + + + + + + + + + + + - - - -
-
+
+
+
+

Page not found (404)

-
-
-
-

Page not found (404)

Content not found. Please use links in the navbar. -
- - - +
- -
-

-

Developed by David Granjon.

+
+

Developed by David Granjon.

-
-

-

Site built with pkgdown 2.1.0.

+
+

Site built with pkgdown 2.1.0.

-
+
- diff --git a/CNAME b/CNAME new file mode 100644 index 00000000..7eeab2f7 --- /dev/null +++ b/CNAME @@ -0,0 +1 @@ +bs4dash.rinterface.com diff --git a/CODE_OF_CONDUCT.html b/CODE_OF_CONDUCT.html index f2c49bd1..79edf669 100644 --- a/CODE_OF_CONDUCT.html +++ b/CODE_OF_CONDUCT.html @@ -1,88 +1,43 @@ -Contributor Covenant Code of Conduct • bs4Dash - - -
-
-
-
-

Contributor Covenant Code of Conduct

+
  • Changelog
    • +
      • +
      • +
    + + +
    +
    +
    +
    +

    Contributor Covenant Code of Conduct

    + Source: CODE_OF_CONDUCT.md
    @@ -153,26 +108,19 @@

    Attribution -

    - -
    - +
    -
    diff --git a/LICENSE-text.html b/LICENSE-text.html index e76b2352..e1b6d59f 100644 --- a/LICENSE-text.html +++ b/LICENSE-text.html @@ -1,88 +1,43 @@ -License • bs4Dash - - -
    -
    -
    -
    -

    License

    +
  • Changelog
    • +
      • +
      • +
    + + +
    +
    +
    +
    +

    License

    + 
    The bs4Dash package as a whole is distributed under Version 2 of the GPL
@@ -212,26 +167,18 @@ 
    License
    
 OTHER DEALINGS IN THE FONT SOFTWARE.
    -
    - - - -
    +
    - -
    -

    Developed by David Granjon.

    +
    +

    Developed by David Granjon.

    -
    -

    Site built with pkgdown 2.1.0.

    +
    +

    Site built with pkgdown 2.1.0.

    -
    - +
    diff --git a/articles/bs4Dash.html b/articles/bs4Dash.html index d3259525..2ec4fdb6 100644 --- a/articles/bs4Dash.html +++ b/articles/bs4Dash.html @@ -4,7 +4,7 @@ - + bs4Dash • bs4Dash @@ -12,117 +12,69 @@ - - - - - - + + + + + - - + + Skip to contents -
    -
    -
    -
    -

    bs4Dash

    + + +
    +
    +

    bs4Dash

    David Granjon

    -

    01 August, 2024

    +

    03 September, 2024

    Source: vignettes/bs4Dash.Rmd - - +
    bs4Dash.Rmd
    @@ -326,67 +278,34 @@

    Basic Examplebs4Dash.

    -
    -library(shiny)
-library(bs4Dash)
-
-shinyApp(
-    ui = dashboardPage(
-        header = dashboardHeader(
-            title = dashboardBrand(
-                title = "My dashboard",
-                color = "primary",
-                href = "https://adminlte.io/themes/v3",
-                image = "https://adminlte.io/themes/v3/dist/img/AdminLTELogo.png"
-            )
-        ),
-        sidebar = dashboardSidebar(),
-        body = dashboardBody(
-            lapply(getAdminLTEColors(), function(color) {
-                box(status = color)
-            })
-        ),
-        controlbar = dashboardControlbar(),
-        title = "DashboardPage"
-    ),
-    server = function(input, output) { }
-)
    - -
    -
    -
    - +
    +
    +
    -
    + +
    -
    - - - +

    -
    -

    -

    Developed by David Granjon.

    +
    +

    Developed by David Granjon.

    -
    -

    -

    Site built with pkgdown 2.1.0.

    +
    +

    Site built with pkgdown 2.1.0.

    -
    +
    - diff --git a/articles/bs4Dash_files/bslib-component-css-0.8.0/components.css b/articles/bs4Dash_files/bslib-component-css-0.8.0/components.css new file mode 100644 index 00000000..f59749f3 --- /dev/null +++ b/articles/bs4Dash_files/bslib-component-css-0.8.0/components.css @@ -0,0 +1 @@ +.accordion .accordion-header{font-size:calc(1.325rem + .9vw);margin-top:0;margin-bottom:.5rem;font-weight:400;line-height:1.2;color:var(--bs-heading-color);margin-bottom:0}@media (min-width: 1200px){.accordion .accordion-header{font-size:2rem}}.accordion .accordion-icon:not(:empty){margin-right:0.75rem;display:flex}.accordion .accordion-button:not(.collapsed){box-shadow:none}.accordion .accordion-button:not(.collapsed):focus{box-shadow:var(--bs-accordion-btn-focus-box-shadow)}.bslib-card{overflow:auto}.bslib-card .card-body+.card-body{padding-top:0}.bslib-card .card-body{overflow:auto}.bslib-card .card-body p{margin-top:0}.bslib-card .card-body p:last-child{margin-bottom:0}.bslib-card .card-body{max-height:var(--bslib-card-body-max-height, none)}.bslib-card[data-full-screen="true"]>.card-body{max-height:var(--bslib-card-body-max-height-full-screen, none)}.bslib-card .card-header .form-group{margin-bottom:0}.bslib-card .card-header .selectize-control{margin-bottom:0}.bslib-card .card-header .selectize-control .item{margin-right:1.15rem}.bslib-card .card-footer{margin-top:auto}.bslib-card .bslib-navs-card-title{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center}.bslib-card .bslib-navs-card-title .nav{margin-left:auto}.bslib-card .bslib-sidebar-layout:not([data-bslib-sidebar-border="true"]){border:none}.bslib-card .bslib-sidebar-layout:not([data-bslib-sidebar-border-radius="true"]){border-top-left-radius:0;border-top-right-radius:0}.bslib-card[data-full-screen="true"]{position:fixed;inset:3.5rem 1rem 1rem;height:auto !important;max-height:none !important;width:auto !important;z-index:1070}.bslib-full-screen-enter{position:absolute;bottom:var(--bslib-full-screen-enter-bottom, 0.2rem);right:var(--bslib-full-screen-enter-right, 0);top:var(--bslib-full-screen-enter-top);left:var(--bslib-full-screen-enter-left);color:var(--bslib-color-fg, var(--bs-card-color));background-color:var(--bslib-color-bg, var(--bs-card-bg, var(--bs-body-bg)));border:var(--bs-card-border-width) solid var(--bslib-color-fg, var(--bs-card-border-color));box-shadow:0 2px 4px rgba(0,0,0,0.15);margin:0.2rem 0.4rem;padding:0.55rem !important;font-size:.8rem;cursor:pointer;opacity:0;z-index:1070}.card:hover>*>.bslib-full-screen-enter,.card:focus-within>*>.bslib-full-screen-enter{opacity:0.6}.card:hover>*>.bslib-full-screen-enter:hover,.card:hover>*>.bslib-full-screen-enter:focus,.card:focus-within>*>.bslib-full-screen-enter:hover,.card:focus-within>*>.bslib-full-screen-enter:focus{opacity:1}.card[data-full-screen="false"]:hover>*>.bslib-full-screen-enter{display:block}.bslib-has-full-screen .bslib-full-screen-enter{display:none !important}.bslib-full-screen-exit{position:relative;top:1.35rem;font-size:0.9rem;cursor:pointer;text-decoration:none;display:flex;float:right;margin-right:2.15rem;align-items:center;color:rgba(var(--bs-body-bg-rgb), 0.8)}.bslib-full-screen-exit:hover{color:rgba(var(--bs-body-bg-rgb), 1)}.bslib-full-screen-exit svg{margin-left:0.5rem;font-size:1.5rem}#bslib-full-screen-overlay{position:fixed;inset:0;background-color:rgba(var(--bs-body-color-rgb), 0.6);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);z-index:1069;animation:bslib-full-screen-overlay-enter 400ms cubic-bezier(0.6, 0.02, 0.65, 1) forwards}@keyframes bslib-full-screen-overlay-enter{0%{opacity:0}100%{opacity:1}}@media (max-width: 575.98px){.bslib-card[data-full-screen="true"]{inset:2.5rem 0.5rem 0.5rem}.bslib-full-screen-exit{top:0.75rem;margin-right:1.25rem}}.bslib-grid{--_item-column-span: 1;display:grid !important;gap:var(--bslib-spacer, 1rem);height:var(--bslib-grid-height)}.bslib-grid>*{grid-column:auto/span var(--_item-column-span, 1)}.bslib-grid.grid{grid-template-columns:repeat(var(--bs-columns, 12), minmax(0, 1fr));grid-template-rows:unset;grid-auto-rows:var(--bslib-grid--row-heights);--bslib-grid--row-heights--xs: unset;--bslib-grid--row-heights--sm: unset;--bslib-grid--row-heights--md: unset;--bslib-grid--row-heights--lg: unset;--bslib-grid--row-heights--xl: unset;--bslib-grid--row-heights--xxl: unset}.bslib-grid.grid.bslib-grid--row-heights--xs{--bslib-grid--row-heights: var(--bslib-grid--row-heights--xs)}@media (min-width: 576px){.bslib-grid.grid.bslib-grid--row-heights--sm{--bslib-grid--row-heights: var(--bslib-grid--row-heights--sm)}}@media (min-width: 768px){.bslib-grid.grid.bslib-grid--row-heights--md{--bslib-grid--row-heights: var(--bslib-grid--row-heights--md)}}@media (min-width: 992px){.bslib-grid.grid.bslib-grid--row-heights--lg{--bslib-grid--row-heights: var(--bslib-grid--row-heights--lg)}}@media (min-width: 1200px){.bslib-grid.grid.bslib-grid--row-heights--xl{--bslib-grid--row-heights: var(--bslib-grid--row-heights--xl)}}@media (min-width: 1400px){.bslib-grid.grid.bslib-grid--row-heights--xxl{--bslib-grid--row-heights: var(--bslib-grid--row-heights--xxl)}}.bslib-grid>*>.shiny-input-container{width:100%}bslib-layout-columns.bslib-grid{--_item-column-span: 6}bslib-layout-columns[hidden-until-init]>*{display:none}@media (max-width: 767.98px){bslib-layout-columns:where(.bslib-grid)>*{grid-column:1 / -1}}@media (max-width: 575.98px){.bslib-grid{grid-template-columns:1fr !important;height:var(--bslib-grid-height-mobile)}.bslib-grid.grid{height:unset !important}}@media (min-width: 576px){.nav:not(.nav-hidden){display:flex !important;display:-webkit-flex !important}.nav:not(.nav-hidden):not(.nav-stacked):not(.flex-column){float:none !important}.nav:not(.nav-hidden):not(.nav-stacked):not(.flex-column)>.bslib-nav-spacer{margin-left:auto !important}.nav:not(.nav-hidden):not(.nav-stacked):not(.flex-column)>.form-inline{margin-top:auto;margin-bottom:auto}.nav:not(.nav-hidden).nav-stacked{flex-direction:column;-webkit-flex-direction:column;height:100%}.nav:not(.nav-hidden).nav-stacked>.bslib-nav-spacer{margin-top:auto !important}}.bslib-page-fill{width:100%;height:100%;margin:0;padding:var(--bslib-spacer, 1rem);gap:var(--bslib-spacer, 1rem)}@media (max-width: 575.98px){.bslib-flow-mobile>.html-fill-item{flex:0 0 auto}.bslib-flow-mobile.bslib-page-sidebar>.html-fill-item,.bslib-flow-mobile.bslib-page-navbar.has-page-sidebar>.html-fill-item{flex:1 1 auto}.bslib-flow-mobile.bslib-page-sidebar>.bslib-sidebar-layout>.main>.html-fill-item,.bslib-flow-mobile.bslib-page-navbar.has-page-sidebar>.html-fill-container>.bslib-sidebar-layout>.main>.html-fill-item{flex:0 0 auto}}.navbar+.container-fluid:has(>.tab-content>.tab-pane.active.html-fill-container){padding-left:0;padding-right:0}.navbar+.container-fluid>.tab-content>.tab-pane.active.html-fill-container{padding:var(--bslib-spacer, 1rem);gap:var(--bslib-spacer, 1rem)}.navbar+.container-fluid>.tab-content>.tab-pane.active.html-fill-container:has(>.bslib-sidebar-layout:only-child){padding:0}.navbar+.container-fluid>.tab-content>.tab-pane.active.html-fill-container>.bslib-sidebar-layout:only-child:not([data-bslib-sidebar-border="true"]){border-left:none;border-right:none;border-bottom:none}.navbar+.container-fluid>.tab-content>.tab-pane.active.html-fill-container>.bslib-sidebar-layout:only-child:not([data-bslib-sidebar-border-radius="true"]){border-radius:0}.navbar+div>.bslib-sidebar-layout{border-top:var(--bslib-sidebar-border)}:root{--bslib-page-sidebar-title-bg: #202020;--bslib-page-sidebar-title-color: #fff}.bslib-page-sidebar>.navbar{--bs-navbar-brand-color: var(--bslib-page-sidebar-title-color);border-bottom:var(--bs-border-width) solid var(--bs-border-color-translucent);background-color:var(--bslib-page-sidebar-title-bg);color:var(--bslib-page-sidebar-title-color)}.bslib-page-sidebar .bslib-page-title{margin-bottom:0;line-height:var(--bs-body-line-height)}@media (max-width: 991.98px){.bslib-page-sidebar>.bslib-sidebar-layout.sidebar-collapsed:not(.sidebar-right)>.main,.bslib-page-navbar>div>.bslib-sidebar-layout.sidebar-collapsed:not(.sidebar-right)>.main{padding-right:var(--_padding)}.bslib-page-sidebar>.bslib-sidebar-layout.sidebar-collapsed.sidebar-right>.main,.bslib-page-navbar>div>.bslib-sidebar-layout.sidebar-collapsed.sidebar-right>.main{padding-left:var(--_padding)}}@media (min-width: 576px){.bslib-sidebar-layout .bslib-page-main{min-height:var(--bslib-page-main-min-height, 576px)}.bslib-sidebar-layout:not(.sidebar-collapsed) .bslib-page-main,.bslib-sidebar-layout.transitioning .bslib-page-main{min-width:var(--bslib-page-main-min-width, 576px)}}.bslib-sidebar-layout{--_transition-duration: 0;--_transition-easing-x: var(--bslib-sidebar-transition-easing-x, cubic-bezier(0.8, 0.78, 0.22, 1.07));--_border: var(--bslib-sidebar-border, var(--bs-card-border-width, var(--bs-border-width)) solid var(--bs-card-border-color, var(--bs-border-color-translucent)));--_border-radius: var(--bslib-sidebar-border-radius, var(--bs-border-radius));--_vert-border: var(--bslib-sidebar-vert-border, var(--_border));--_sidebar-width: var(--bslib-sidebar-width, 250px);--_sidebar-bg: var(--bslib-sidebar-bg, rgba(var(--bs-emphasis-color-rgb, 0, 0, 0), 0.05));--_sidebar-fg: var(--bslib-sidebar-fg, var(--_main-fg));--_main-fg: var(--bslib-sidebar-main-fg, var(--bs-card-color, var(--bs-body-color)));--_main-bg: var(--bslib-sidebar-main-bg, transparent);--_toggle-bg: var(--bslib-sidebar-toggle-bg, rgba(var(--bs-emphasis-color-rgb, 0, 0, 0), 0.1));--_padding: var(--bslib-sidebar-padding, var(--bslib-spacer, 1.5rem));--_icon-size: var(--bslib-sidebar-icon-size, 1rem);--_icon-button-size: var(--bslib-sidebar-icon-button-size, calc(var(--_icon-size, 1rem) * 2));--_padding-icon: calc(var(--_icon-button-size, 2rem) * 1.5);--_toggle-border-radius: var(--bslib-collapse-toggle-border-radius, var(--bs-border-radius, 3px));--_toggle-transform: var(--bslib-collapse-toggle-transform, 0deg);--_toggle-transition-easing: var(--bslib-sidebar-toggle-transition-easing, cubic-bezier(1, 0, 0, 1));--_toggle-right-transform: var(--bslib-collapse-toggle-right-transform, 180deg);--_toggle-position-y: calc(var(--_js-toggle-count-this-side, 0) * calc(var(--_icon-size) + var(--_padding)) + var(--_icon-size, 1rem) / 2);--_toggle-position-x: calc(-2.5 * var(--_icon-size) - var(--bs-card-border-width, 1px));--_mobile-max-height: var(--bslib-sidebar-mobile-max-height, var(--bslib-sidebar-max-height-mobile));--_sidebar-mobile-opacity: var(--bslib-sidebar-mobile-opacity);--_main-mobile-expanded-opacity: var(--bslib-sidebar-main-mobile-expanded-opacity, 0);--_sidebar-mobile-max-width: var(--bslib-sidebar-mobile-max-width);--_sidebar-mobile-box-shadow: var(--bslib-sidebar-mobile-box-shadow);--_column-main: minmax(0, 1fr);--_toggle-collective-height: calc(calc(var(--_icon-button-size) + 0.5em) * var(--_js-toggle-count-max-side, 1));display:grid !important;grid-template-columns:Min(calc(100% - var(--_padding-icon)), var(--_sidebar-width)) var(--_column-main);position:relative;transition:grid-template-columns ease-in-out var(--_transition-duration),background-color linear var(--_transition-duration);border:var(--_border);border-radius:var(--_border-radius)}.bslib-sidebar-layout.transitioning{--_transition-duration: max(var(--bslib-sidebar-transition-duration, 300ms), 5ms)}@media (prefers-reduced-motion: reduce){.bslib-sidebar-layout{transition:none}}.bslib-sidebar-layout,.html-fill-container>.bslib-sidebar-layout.html-fill-item{min-height:var(--_toggle-collective-height)}.bslib-sidebar-layout[data-bslib-sidebar-border="false"]{border:none}.bslib-sidebar-layout[data-bslib-sidebar-border-radius="false"]{border-radius:initial}.bslib-sidebar-layout>.main,.bslib-sidebar-layout>.sidebar{grid-row:1 / 2;border-radius:inherit;overflow:auto}.bslib-sidebar-layout>.main{grid-column:2 / 3;border-top-left-radius:0;border-bottom-left-radius:0;padding:var(--_padding);transition:padding var(--_transition-easing-x) var(--_transition-duration);color:var(--_main-fg);background-color:var(--_main-bg)}.bslib-sidebar-layout>.sidebar{grid-column:1 / 2;width:100%;border-right:var(--_vert-border);border-top-right-radius:0;border-bottom-right-radius:0;color:var(--_sidebar-fg);background-color:var(--_sidebar-bg)}.bslib-sidebar-layout>.sidebar>.sidebar-content{display:flex;flex-direction:column;gap:var(--bslib-spacer, 1rem);padding:var(--_padding);padding-top:var(--_padding-icon)}.bslib-sidebar-layout>.sidebar>.sidebar-content>:last-child:not(.sidebar-title){margin-bottom:0}.bslib-sidebar-layout>.sidebar>.sidebar-content>.accordion{margin-left:calc(-1 * var(--_padding));margin-right:calc(-1 * var(--_padding))}.bslib-sidebar-layout>.sidebar>.sidebar-content>.accordion:last-child{margin-bottom:calc(-1 * var(--_padding))}.bslib-sidebar-layout>.sidebar>.sidebar-content>.accordion:not(:last-child){margin-bottom:1rem}.bslib-sidebar-layout>.sidebar>.sidebar-content>.accordion .accordion-body{display:flex;flex-direction:column}.bslib-sidebar-layout>.sidebar>.sidebar-content>.accordion:not(:first-child) .accordion-item:first-child{border-top:var(--bs-accordion-border-width) solid var(--bs-accordion-border-color)}.bslib-sidebar-layout>.sidebar>.sidebar-content>.accordion:not(:last-child) .accordion-item:last-child{border-bottom:var(--bs-accordion-border-width) solid var(--bs-accordion-border-color)}.bslib-sidebar-layout>.sidebar>.sidebar-content.has-accordion>.sidebar-title{border-bottom:none;padding-bottom:0}.bslib-sidebar-layout>.sidebar .shiny-input-container{width:100%}.bslib-sidebar-layout>.collapse-toggle{grid-row:1 / 2;grid-column:1 / 2;z-index:1000;display:inline-flex;align-items:center;position:absolute;right:calc(var(--_icon-size));top:calc(var(--_icon-size, 1rem) / 2);border:none;border-radius:var(--_toggle-border-radius);height:var(--_icon-button-size, 2rem);width:var(--_icon-button-size, 2rem);display:flex;align-items:center;justify-content:center;padding:0;color:var(--_sidebar-fg);background-color:unset;transition:color var(--_transition-easing-x) var(--_transition-duration),top var(--_transition-easing-x) var(--_transition-duration),right var(--_transition-easing-x) var(--_transition-duration),left var(--_transition-easing-x) var(--_transition-duration)}.bslib-sidebar-layout>.collapse-toggle:hover{background-color:var(--_toggle-bg)}.bslib-sidebar-layout>.collapse-toggle>.collapse-icon{opacity:0.8;width:var(--_icon-size);height:var(--_icon-size);transform:rotateY(var(--_toggle-transform));transition:transform var(--_toggle-transition-easing) var(--_transition-duration)}.bslib-sidebar-layout>.collapse-toggle:hover>.collapse-icon{opacity:1}.bslib-sidebar-layout .sidebar-title{font-size:1.25rem;line-height:1.25;margin-top:0;margin-bottom:1rem;padding-bottom:1rem;border-bottom:var(--_border)}.bslib-sidebar-layout.sidebar-right{grid-template-columns:var(--_column-main) Min(calc(100% - var(--_padding-icon)), var(--_sidebar-width))}.bslib-sidebar-layout.sidebar-right>.main{grid-column:1 / 2;border-top-right-radius:0;border-bottom-right-radius:0;border-top-left-radius:inherit;border-bottom-left-radius:inherit}.bslib-sidebar-layout.sidebar-right>.sidebar{grid-column:2 / 3;border-right:none;border-left:var(--_vert-border);border-top-left-radius:0;border-bottom-left-radius:0}.bslib-sidebar-layout.sidebar-right>.collapse-toggle{grid-column:2 / 3;left:var(--_icon-size);right:unset;border:var(--bslib-collapse-toggle-border)}.bslib-sidebar-layout.sidebar-right>.collapse-toggle>.collapse-icon{transform:rotateY(var(--_toggle-right-transform))}.bslib-sidebar-layout.transitioning>.sidebar>.sidebar-content{display:none}.bslib-sidebar-layout.sidebar-collapsed{--_toggle-transform: 180deg;--_toggle-right-transform: 0deg;--_vert-border: none;grid-template-columns:0 minmax(0, 1fr)}.bslib-sidebar-layout.sidebar-collapsed.sidebar-right{grid-template-columns:minmax(0, 1fr) 0}.bslib-sidebar-layout.sidebar-collapsed:not(.transitioning)>.sidebar>*{display:none}.bslib-sidebar-layout.sidebar-collapsed>.main{border-radius:inherit;padding-left:var(--_padding-icon);padding-right:var(--_padding-icon)}.bslib-sidebar-layout.sidebar-collapsed>.collapse-toggle{color:var(--_main-fg);top:var(--_toggle-position-y);right:var(--_toggle-position-x)}.bslib-sidebar-layout.sidebar-collapsed.sidebar-right>.collapse-toggle{left:var(--_toggle-position-x);right:unset}.bslib-sidebar-layout{--bslib-sidebar-js-window-size: desktop}@media (max-width: 575.98px){.bslib-sidebar-layout{--bslib-sidebar-js-window-size: mobile}}@media (min-width: 576px){.bslib-sidebar-layout[data-collapsible-desktop="false"]{--_padding-icon: var(--_padding)}.bslib-sidebar-layout[data-collapsible-desktop="false"]>.collapse-toggle{display:none}.bslib-sidebar-layout[data-collapsible-desktop="false"]>.sidebar[hidden]{display:block !important}.bslib-sidebar-layout[data-collapsible-desktop="false"]>.sidebar[hidden]>.sidebar-content{display:flex !important}}@media (max-width: 575.98px){.bslib-sidebar-layout>.sidebar,.bslib-sidebar-layout.sidebar-right>.sidebar{border:none}.bslib-sidebar-layout>.main,.bslib-sidebar-layout.sidebar-right>.main{grid-column:1 / 3}.bslib-sidebar-layout[data-collapsible-mobile="true"]{grid-template-rows:calc(var(--_icon-button-size) + var(--_padding)) 1fr;grid-template-columns:100% 0}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.collapse-toggle{grid-row:1 / 2}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.main{grid-row:2 / 3}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.sidebar{grid-row:1 / 3}.bslib-sidebar-layout[data-collapsible-mobile="true"]:not(.sidebar-collapsed)>.sidebar,.bslib-sidebar-layout[data-collapsible-mobile="true"].transitioning>.sidebar{z-index:1045}.bslib-sidebar-layout[data-collapsible-mobile="true"]:not(.sidebar-collapsed)>.collapse-toggle,.bslib-sidebar-layout[data-collapsible-mobile="true"].transitioning>.collapse-toggle{z-index:1045}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.collapse-toggle{top:unset;position:relative;align-self:center}.bslib-sidebar-layout[data-collapsible-mobile="true"]:not(.sidebar-right)>.collapse-toggle{left:var(--_icon-size);right:unset;justify-self:left}.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-right>.collapse-toggle{right:var(--_icon-size);left:unset;justify-self:right}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.sidebar{opacity:var(--_sidebar-mobile-opacity, 1);max-width:var(--_sidebar-mobile-max-width, 100%);box-shadow:var(--_sidebar-mobile-box-shadow)}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.sidebar{margin:0;padding-top:var(--_padding-icon)}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.sidebar>.sidebar-content{padding-top:0;height:100%;overflow-y:auto}.bslib-sidebar-layout[data-collapsible-mobile="true"]:not(.sidebar-right)>.sidebar{margin-right:auto}.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-right>.sidebar{margin-left:auto}.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-right{grid-template-columns:0 100%}.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-collapsed{grid-template-columns:0 100%}.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-collapsed.sidebar-right{grid-template-columns:100% 0}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.main{padding-top:1px;padding-left:var(--_padding);padding-right:var(--_padding)}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.main{opacity:var(--_main-mobile-expanded-opacity);transition:opacity var(--_transition-easing-x) var(--_transition-duration)}.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-collapsed>.main{opacity:1}.bslib-sidebar-layout[data-collapsible-mobile="true"]>.main{background-color:none}.bslib-sidebar-layout[data-collapsible-mobile="true"],.bslib-sidebar-layout[data-collapsible-mobile="true"].sidebar-collapsed{background-color:var(--_main-bg)}}@media (max-width: 575.98px){.bslib-sidebar-layout[data-collapsible-mobile="false"]{display:block !important;--_padding-icon: var(--_padding);--_vert-border: var(--_border)}.bslib-sidebar-layout[data-collapsible-mobile="false"]>.sidebar[hidden]{display:block !important}.bslib-sidebar-layout[data-collapsible-mobile="false"]>.sidebar[hidden]>.sidebar-content{display:flex !important}.bslib-sidebar-layout[data-collapsible-mobile="false"]>.sidebar{max-height:var(--_mobile-max-height);overflow-y:auto}.bslib-sidebar-layout[data-collapsible-mobile="false"][data-open-mobile="always"]>.sidebar{border-top:var(--_vert-border)}.bslib-sidebar-layout[data-collapsible-mobile="false"][data-open-mobile="always-above"]>.sidebar{border-bottom:var(--_vert-border)}.bslib-sidebar-layout[data-collapsible-mobile="false"]>.collapse-toggle{display:none}}.bslib-value-box{container-name:bslib-value-box;container-type:inline-size}.bslib-value-box.default{--bslib-value-box-bg-default: var(--bs-card-bg, #fff);--bslib-value-box-border-color-default: var(--bs-card-border-color, var(--bs-border-color-translucent));color:var(--bslib-value-box-color, var(--bs-body-color));background-color:var(--bslib-value-box-bg, var(--bslib-value-box-bg-default));border-color:var(--bslib-value-box-border-color, var(--bslib-value-box-border-color-default))}.bslib-value-box .value-box-grid{display:grid;grid-template-areas:"left right";align-items:center;overflow:hidden}.bslib-value-box .value-box-showcase{height:100%;max-height:var(---bslib-value-box-showcase-max-h, 100%)}.bslib-value-box .value-box-showcase,.bslib-value-box .value-box-showcase>.html-fill-item{width:100%}.bslib-value-box[data-full-screen="true"] .value-box-showcase{max-height:var(---bslib-value-box-showcase-max-h-fs, 100%)}@media screen and (min-width: 575.98px){@container bslib-value-box (max-width: 300px){.bslib-value-box:not(.showcase-bottom) .value-box-grid{grid-template-columns:1fr !important;grid-template-rows:auto auto;grid-template-areas:"top" "bottom"}.bslib-value-box:not(.showcase-bottom) .value-box-grid .value-box-showcase{grid-area:top !important}.bslib-value-box:not(.showcase-bottom) .value-box-grid .value-box-area{grid-area:bottom !important;justify-content:end}}}.bslib-value-box .value-box-area{justify-content:center;padding:1.5rem 1rem;font-size:.9rem;font-weight:500}.bslib-value-box .value-box-area *{margin-bottom:0;margin-top:0}.bslib-value-box .value-box-title{font-size:1rem;margin-top:0;margin-bottom:.5rem;font-weight:400;line-height:1.2}.bslib-value-box .value-box-title:empty::after{content:'\00a0 '}.bslib-value-box .value-box-value{font-size:calc(1.325rem + .9vw);margin-top:0;margin-bottom:.5rem;font-weight:400;line-height:1.2}@media (min-width: 1200px){.bslib-value-box .value-box-value{font-size:2rem}}.bslib-value-box .value-box-value:empty::after{content:'\00a0 '}.bslib-value-box .value-box-showcase{align-items:center;justify-content:center;margin-top:auto;margin-bottom:auto;padding:1rem}.bslib-value-box .value-box-showcase .bi,.bslib-value-box .value-box-showcase .fa,.bslib-value-box .value-box-showcase .fab,.bslib-value-box .value-box-showcase .fas,.bslib-value-box .value-box-showcase .far{opacity:.85;min-width:50px;max-width:125%}.bslib-value-box .value-box-showcase .bi,.bslib-value-box .value-box-showcase .fa,.bslib-value-box .value-box-showcase .fab,.bslib-value-box .value-box-showcase .fas,.bslib-value-box .value-box-showcase .far{font-size:4rem}.bslib-value-box.showcase-top-right .value-box-grid{grid-template-columns:1fr var(---bslib-value-box-showcase-w, 50%)}.bslib-value-box.showcase-top-right .value-box-grid .value-box-showcase{grid-area:right;margin-left:auto;align-self:start;align-items:end;padding-left:0;padding-bottom:0}.bslib-value-box.showcase-top-right .value-box-grid .value-box-area{grid-area:left;align-self:end}.bslib-value-box.showcase-top-right[data-full-screen="true"] .value-box-grid{grid-template-columns:auto var(---bslib-value-box-showcase-w-fs, 1fr)}.bslib-value-box.showcase-top-right[data-full-screen="true"] .value-box-grid>div{align-self:center}.bslib-value-box.showcase-top-right:not([data-full-screen="true"]) .value-box-showcase{margin-top:0}@container bslib-value-box (max-width: 300px){.bslib-value-box.showcase-top-right:not([data-full-screen="true"]) .value-box-grid .value-box-showcase{padding-left:1rem}}.bslib-value-box.showcase-left-center .value-box-grid{grid-template-columns:var(---bslib-value-box-showcase-w, 30%) auto}.bslib-value-box.showcase-left-center[data-full-screen="true"] .value-box-grid{grid-template-columns:var(---bslib-value-box-showcase-w-fs, 1fr) auto}.bslib-value-box.showcase-left-center:not([data-fill-screen="true"]) .value-box-grid .value-box-showcase{grid-area:left}.bslib-value-box.showcase-left-center:not([data-fill-screen="true"]) .value-box-grid .value-box-area{grid-area:right}.bslib-value-box.showcase-bottom .value-box-grid{grid-template-columns:1fr;grid-template-rows:1fr var(---bslib-value-box-showcase-h, auto);grid-template-areas:"top" "bottom";overflow:hidden}.bslib-value-box.showcase-bottom .value-box-grid .value-box-showcase{grid-area:bottom;padding:0;margin:0}.bslib-value-box.showcase-bottom .value-box-grid .value-box-area{grid-area:top}.bslib-value-box.showcase-bottom[data-full-screen="true"] .value-box-grid{grid-template-rows:1fr var(---bslib-value-box-showcase-h-fs, 2fr)}.bslib-value-box.showcase-bottom[data-full-screen="true"] .value-box-grid .value-box-showcase{padding:1rem} diff --git a/articles/bs4Dash_files/bslib-component-css-0.8.0/components.js b/articles/bs4Dash_files/bslib-component-css-0.8.0/components.js new file mode 100644 index 00000000..57c9c4f2 --- /dev/null +++ b/articles/bs4Dash_files/bslib-component-css-0.8.0/components.js @@ -0,0 +1,1364 @@ +/*! bslib 0.8.0 | (c) 2012-2024 RStudio, PBC. | License: MIT + file LICENSE */ +"use strict"; +(() => { + var __getOwnPropNames = Object.getOwnPropertyNames; + var __esm = (fn, res) => function __init() { + return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res; + }; + var __commonJS = (cb, mod) => function __require() { + return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; + }; + var __accessCheck = (obj, member, msg) => { + if (!member.has(obj)) + throw TypeError("Cannot " + msg); + }; + var __privateGet = (obj, member, getter) => { + __accessCheck(obj, member, "read from private field"); + return getter ? getter.call(obj) : member.get(obj); + }; + var __privateAdd = (obj, member, value) => { + if (member.has(obj)) + throw TypeError("Cannot add the same private member more than once"); + member instanceof WeakSet ? member.add(obj) : member.set(obj, value); + }; + var __privateMethod = (obj, member, method) => { + __accessCheck(obj, member, "access private method"); + return method; + }; + var __async = (__this, __arguments, generator) => { + return new Promise((resolve, reject) => { + var fulfilled = (value) => { + try { + step(generator.next(value)); + } catch (e) { + reject(e); + } + }; + var rejected = (value) => { + try { + step(generator.throw(value)); + } catch (e) { + reject(e); + } + }; + var step = (x) => x.done ? resolve(x.value) : Promise.resolve(x.value).then(fulfilled, rejected); + step((generator = generator.apply(__this, __arguments)).next()); + }); + }; + + // srcts/src/components/_utils.ts + function registerBinding(inputBindingClass, name) { + if (Shiny) { + Shiny.inputBindings.register(new inputBindingClass(), "bslib." + name); + } + } + function registerBslibGlobal(name, value) { + window.bslib = window.bslib || {}; + if (!window.bslib[name]) { + window.bslib[name] = value; + } else { + console.error( + `[bslib] Global window.bslib.${name} was already defined, using previous definition.` + ); + } + } + function hasDefinedProperty(obj, prop) { + return Object.prototype.hasOwnProperty.call(obj, prop) && obj[prop] !== void 0; + } + function getAllFocusableChildren(el) { + const base = [ + "a[href]", + "area[href]", + "button", + "details summary", + "input", + "iframe", + "select", + "textarea", + '[contentEditable=""]', + '[contentEditable="true"]', + '[contentEditable="TRUE"]', + "[tabindex]" + ]; + const modifiers = [':not([tabindex="-1"])', ":not([disabled])"]; + const selectors = base.map((b) => b + modifiers.join("")); + const focusable = el.querySelectorAll(selectors.join(", ")); + return Array.from(focusable); + } + function shinyRenderContent(...args) { + return __async(this, null, function* () { + if (!Shiny) { + throw new Error("This function must be called in a Shiny app."); + } + if (Shiny.renderContentAsync) { + return yield Shiny.renderContentAsync.apply(null, args); + } else { + return yield Shiny.renderContent.apply(null, args); + } + }); + } + var Shiny, InputBinding; + var init_utils = __esm({ + "srcts/src/components/_utils.ts"() { + "use strict"; + Shiny = window.Shiny; + InputBinding = Shiny ? Shiny.InputBinding : class { + }; + } + }); + + // srcts/src/components/accordion.ts + var AccordionInputBinding; + var init_accordion = __esm({ + "srcts/src/components/accordion.ts"() { + "use strict"; + init_utils(); + AccordionInputBinding = class extends InputBinding { + find(scope) { + return $(scope).find(".accordion.bslib-accordion-input"); + } + getValue(el) { + const items = this._getItemInfo(el); + const selected = items.filter((x) => x.isOpen()).map((x) => x.value); + return selected.length === 0 ? null : selected; + } + subscribe(el, callback) { + $(el).on( + "shown.bs.collapse.accordionInputBinding hidden.bs.collapse.accordionInputBinding", + // eslint-disable-next-line @typescript-eslint/no-unused-vars + function(event) { + callback(true); + } + ); + } + unsubscribe(el) { + $(el).off(".accordionInputBinding"); + } + receiveMessage(el, data) { + return __async(this, null, function* () { + const method = data.method; + if (method === "set") { + this._setItems(el, data); + } else if (method === "open") { + this._openItems(el, data); + } else if (method === "close") { + this._closeItems(el, data); + } else if (method === "remove") { + this._removeItem(el, data); + } else if (method === "insert") { + yield this._insertItem(el, data); + } else if (method === "update") { + yield this._updateItem(el, data); + } else { + throw new Error(`Method not yet implemented: ${method}`); + } + }); + } + _setItems(el, data) { + const items = this._getItemInfo(el); + const vals = this._getValues(el, items, data.values); + items.forEach((x) => { + vals.indexOf(x.value) > -1 ? x.show() : x.hide(); + }); + } + _openItems(el, data) { + const items = this._getItemInfo(el); + const vals = this._getValues(el, items, data.values); + items.forEach((x) => { + if (vals.indexOf(x.value) > -1) + x.show(); + }); + } + _closeItems(el, data) { + const items = this._getItemInfo(el); + const vals = this._getValues(el, items, data.values); + items.forEach((x) => { + if (vals.indexOf(x.value) > -1) + x.hide(); + }); + } + _insertItem(el, data) { + return __async(this, null, function* () { + let targetItem = this._findItem(el, data.target); + if (!targetItem) { + targetItem = data.position === "before" ? el.firstElementChild : el.lastElementChild; + } + const panel = data.panel; + if (targetItem) { + yield shinyRenderContent( + targetItem, + panel, + data.position === "before" ? "beforeBegin" : "afterEnd" + ); + } else { + yield shinyRenderContent(el, panel); + } + if (this._isAutoClosing(el)) { + const val = $(panel.html).attr("data-value"); + $(el).find(`[data-value="${val}"] .accordion-collapse`).attr("data-bs-parent", "#" + el.id); + } + }); + } + _removeItem(el, data) { + var _a; + const targetItems = this._getItemInfo(el).filter( + (x) => data.target.indexOf(x.value) > -1 + ); + const unbindAll = (_a = window.Shiny) == null ? void 0 : _a.unbindAll; + targetItems.forEach((x) => { + if (unbindAll) + unbindAll(x.item); + x.item.remove(); + }); + } + _updateItem(el, data) { + return __async(this, null, function* () { + const target = this._findItem(el, data.target); + if (!target) { + throw new Error( + `Unable to find an accordion_panel() with a value of ${data.target}` + ); + } + if (hasDefinedProperty(data, "value")) { + target.dataset.value = data.value; + } + if (hasDefinedProperty(data, "body")) { + const body = target.querySelector(".accordion-body"); + yield shinyRenderContent(body, data.body); + } + const header = target.querySelector(".accordion-header"); + if (hasDefinedProperty(data, "title")) { + const title = header.querySelector(".accordion-title"); + yield shinyRenderContent(title, data.title); + } + if (hasDefinedProperty(data, "icon")) { + const icon = header.querySelector( + ".accordion-button > .accordion-icon" + ); + yield shinyRenderContent(icon, data.icon); + } + }); + } + _getItemInfo(el) { + const items = Array.from( + el.querySelectorAll(":scope > .accordion-item") + ); + return items.map((x) => this._getSingleItemInfo(x)); + } + _getSingleItemInfo(x) { + const collapse = x.querySelector(".accordion-collapse"); + const isOpen = () => $(collapse).hasClass("show"); + return { + item: x, + value: x.dataset.value, + isOpen, + show: () => { + if (!isOpen()) + $(collapse).collapse("show"); + }, + hide: () => { + if (isOpen()) + $(collapse).collapse("hide"); + } + }; + } + _getValues(el, items, values) { + let vals = values !== true ? values : items.map((x) => x.value); + const autoclose = this._isAutoClosing(el); + if (autoclose) { + vals = vals.slice(vals.length - 1, vals.length); + } + return vals; + } + _findItem(el, value) { + return el.querySelector(`[data-value="${value}"]`); + } + _isAutoClosing(el) { + return el.classList.contains("autoclose"); + } + }; + registerBinding(AccordionInputBinding, "accordion"); + } + }); + + // srcts/src/components/_shinyResizeObserver.ts + var ShinyResizeObserver; + var init_shinyResizeObserver = __esm({ + "srcts/src/components/_shinyResizeObserver.ts"() { + "use strict"; + ShinyResizeObserver = class { + /** + * Watch containers for size changes and ensure that Shiny outputs and + * htmlwidgets within resize appropriately. + * + * @details + * The ShinyResizeObserver is used to watch the containers, such as Sidebars + * and Cards for size changes, in particular when the sidebar state is toggled + * or the card body is expanded full screen. It performs two primary tasks: + * + * 1. Dispatches a `resize` event on the window object. This is necessary to + * ensure that Shiny outputs resize appropriately. In general, the window + * resizing is throttled and the output update occurs when the transition + * is complete. + * 2. If an output with a resize method on the output binding is detected, we + * directly call the `.onResize()` method of the binding. This ensures that + * htmlwidgets transition smoothly. In static mode, htmlwidgets does this + * already. + * + * @note + * This resize observer also handles race conditions in some complex + * fill-based layouts with multiple outputs (e.g., plotly), where shiny + * initializes with the correct sizing, but in-between the 1st and last + * renderValue(), the size of the output containers can change, meaning every + * output but the 1st gets initialized with the wrong size during their + * renderValue(). Then, after the render phase, shiny won't know to trigger a + * resize since all the widgets will return to their original size (and thus, + * Shiny thinks there isn't any resizing to do). The resize observer works + * around this by ensuring that the output is resized whenever its container + * size changes. + * @constructor + */ + constructor() { + this.resizeObserverEntries = []; + this.resizeObserver = new ResizeObserver((entries) => { + const resizeEvent = new Event("resize"); + window.dispatchEvent(resizeEvent); + if (!window.Shiny) + return; + const resized = []; + for (const entry of entries) { + if (!(entry.target instanceof HTMLElement)) + continue; + if (!entry.target.querySelector(".shiny-bound-output")) + continue; + entry.target.querySelectorAll(".shiny-bound-output").forEach((el) => { + if (resized.includes(el)) + return; + const { binding, onResize } = $(el).data("shinyOutputBinding"); + if (!binding || !binding.resize) + return; + const owner = el.shinyResizeObserver; + if (owner && owner !== this) + return; + if (!owner) + el.shinyResizeObserver = this; + onResize(el); + resized.push(el); + if (!el.classList.contains("shiny-plot-output")) + return; + const img = el.querySelector( + 'img:not([width="100%"])' + ); + if (img) + img.setAttribute("width", "100%"); + }); + } + }); + } + /** + * Observe an element for size changes. + * @param {HTMLElement} el - The element to observe. + */ + observe(el) { + this.resizeObserver.observe(el); + this.resizeObserverEntries.push(el); + } + /** + * Stop observing an element for size changes. + * @param {HTMLElement} el - The element to stop observing. + */ + unobserve(el) { + const idxEl = this.resizeObserverEntries.indexOf(el); + if (idxEl < 0) + return; + this.resizeObserver.unobserve(el); + this.resizeObserverEntries.splice(idxEl, 1); + } + /** + * This method checks that we're not continuing to watch elements that no + * longer exist in the DOM. If any are found, we stop observing them and + * remove them from our array of observed elements. + * + * @private + * @static + */ + flush() { + this.resizeObserverEntries.forEach((el) => { + if (!document.body.contains(el)) + this.unobserve(el); + }); + } + }; + } + }); + + // srcts/src/components/_shinyRemovedObserver.ts + var ShinyRemovedObserver; + var init_shinyRemovedObserver = __esm({ + "srcts/src/components/_shinyRemovedObserver.ts"() { + "use strict"; + ShinyRemovedObserver = class { + /** + * Creates a new instance of the `ShinyRemovedObserver` class to watch for the + * removal of specific elements from part of the DOM. + * + * @param selector A CSS selector to identify elements to watch for removal. + * @param callback The function to be called on a matching element when it + * is removed. + */ + constructor(selector, callback) { + this.watching = /* @__PURE__ */ new Set(); + this.observer = new MutationObserver((mutations) => { + const found = /* @__PURE__ */ new Set(); + for (const { type, removedNodes } of mutations) { + if (type !== "childList") + continue; + if (removedNodes.length === 0) + continue; + for (const node of removedNodes) { + if (!(node instanceof HTMLElement)) + continue; + if (node.matches(selector)) { + found.add(node); + } + if (node.querySelector(selector)) { + node.querySelectorAll(selector).forEach((el) => found.add(el)); + } + } + } + if (found.size === 0) + return; + for (const el of found) { + try { + callback(el); + } catch (e) { + console.error(e); + } + } + }); + } + /** + * Starts observing the specified element for removal of its children. If the + * element is already being observed, no change is made to the mutation + * observer. + * @param el The element to observe. + */ + observe(el) { + const changed = this._flush(); + if (this.watching.has(el)) { + if (!changed) + return; + } else { + this.watching.add(el); + } + if (changed) { + this._restartObserver(); + } else { + this.observer.observe(el, { childList: true, subtree: true }); + } + } + /** + * Stops observing the specified element for removal. + * @param el The element to unobserve. + */ + unobserve(el) { + if (!this.watching.has(el)) + return; + this.watching.delete(el); + this._flush(); + this._restartObserver(); + } + /** + * Restarts the mutation observer, observing all elements in the `watching` + * and implicitly unobserving any elements that are no longer in the + * watchlist. + * @private + */ + _restartObserver() { + this.observer.disconnect(); + for (const el of this.watching) { + this.observer.observe(el, { childList: true, subtree: true }); + } + } + /** + * Flushes the set of watched elements, removing any elements that are no + * longer in the DOM, but it does not modify the mutation observer. + * @private + * @returns A boolean indicating whether the watched elements have changed. + */ + _flush() { + let watchedChanged = false; + const watched = Array.from(this.watching); + for (const el of watched) { + if (document.body.contains(el)) + continue; + this.watching.delete(el); + watchedChanged = true; + } + return watchedChanged; + } + }; + } + }); + + // srcts/src/components/card.ts + var _Card, Card; + var init_card = __esm({ + "srcts/src/components/card.ts"() { + "use strict"; + init_utils(); + init_shinyResizeObserver(); + init_shinyRemovedObserver(); + _Card = class { + /** + * Creates an instance of a bslib Card component. + * + * @constructor + * @param {HTMLElement} card + */ + constructor(card) { + var _a; + card.removeAttribute(_Card.attr.ATTR_INIT); + (_a = card.querySelector(`script[${_Card.attr.ATTR_INIT}]`)) == null ? void 0 : _a.remove(); + this.card = card; + _Card.instanceMap.set(card, this); + _Card.shinyResizeObserver.observe(this.card); + _Card.cardRemovedObserver.observe(document.body); + this._addEventListeners(); + this.overlay = this._createOverlay(); + this._setShinyInput(); + this._exitFullScreenOnEscape = this._exitFullScreenOnEscape.bind(this); + this._trapFocusExit = this._trapFocusExit.bind(this); + } + /** + * Enter the card's full screen mode, either programmatically or via an event + * handler. Full screen mode is activated by adding a class to the card that + * positions it absolutely and expands it to fill the viewport. In addition, + * we add a full screen overlay element behind the card and we trap focus in + * the expanded card while in full screen mode. + * + * @param {?Event} [event] + */ + enterFullScreen(event) { + var _a; + if (event) + event.preventDefault(); + if (this.card.id) { + this.overlay.anchor.setAttribute("aria-controls", this.card.id); + } + document.addEventListener("keydown", this._exitFullScreenOnEscape, false); + document.addEventListener("keydown", this._trapFocusExit, true); + this.card.setAttribute(_Card.attr.ATTR_FULL_SCREEN, "true"); + document.body.classList.add(_Card.attr.CLASS_HAS_FULL_SCREEN); + this.card.insertAdjacentElement("beforebegin", this.overlay.container); + if (!this.card.contains(document.activeElement) || ((_a = document.activeElement) == null ? void 0 : _a.classList.contains( + _Card.attr.CLASS_FULL_SCREEN_ENTER + ))) { + this.card.setAttribute("tabindex", "-1"); + this.card.focus(); + } + this._emitFullScreenEvent(true); + this._setShinyInput(); + } + /** + * Exit full screen mode. This removes the full screen overlay element, + * removes the full screen class from the card, and removes the keyboard event + * listeners that were added when entering full screen mode. + */ + exitFullScreen() { + document.removeEventListener( + "keydown", + this._exitFullScreenOnEscape, + false + ); + document.removeEventListener("keydown", this._trapFocusExit, true); + this.overlay.container.remove(); + this.card.setAttribute(_Card.attr.ATTR_FULL_SCREEN, "false"); + this.card.removeAttribute("tabindex"); + document.body.classList.remove(_Card.attr.CLASS_HAS_FULL_SCREEN); + this._emitFullScreenEvent(false); + this._setShinyInput(); + } + _setShinyInput() { + if (!this.card.classList.contains(_Card.attr.CLASS_SHINY_INPUT)) + return; + if (!Shiny) + return; + if (!Shiny.setInputValue) { + setTimeout(() => this._setShinyInput(), 0); + return; + } + const fsAttr = this.card.getAttribute(_Card.attr.ATTR_FULL_SCREEN); + Shiny.setInputValue(this.card.id + "_full_screen", fsAttr === "true"); + } + /** + * Emits a custom event to communicate the card's full screen state change. + * @private + * @param {boolean} fullScreen + */ + _emitFullScreenEvent(fullScreen) { + const event = new CustomEvent("bslib.card", { + bubbles: true, + detail: { fullScreen } + }); + this.card.dispatchEvent(event); + } + /** + * Adds general card-specific event listeners. + * @private + */ + _addEventListeners() { + const btnFullScreen = this.card.querySelector( + `:scope > * > .${_Card.attr.CLASS_FULL_SCREEN_ENTER}` + ); + if (!btnFullScreen) + return; + btnFullScreen.addEventListener("click", (ev) => this.enterFullScreen(ev)); + } + /** + * An event handler to exit full screen mode when the Escape key is pressed. + * @private + * @param {KeyboardEvent} event + */ + _exitFullScreenOnEscape(event) { + if (!(event.target instanceof HTMLElement)) + return; + const selOpenSelectInput = ["select[open]", "input[aria-expanded='true']"]; + if (event.target.matches(selOpenSelectInput.join(", "))) + return; + if (event.key === "Escape") { + this.exitFullScreen(); + } + } + /** + * An event handler to trap focus within the card when in full screen mode. + * + * @description + * This keyboard event handler ensures that tab focus stays within the card + * when in full screen mode. When the card is first expanded, + * we move focus to the card element itself. If focus somehow leaves the card, + * we returns focus to the card container. + * + * Within the card, we handle only tabbing from the close anchor or the last + * focusable element and only when tab focus would have otherwise left the + * card. In those cases, we cycle focus to the last focusable element or back + * to the anchor. If the card doesn't have any focusable elements, we move + * focus to the close anchor. + * + * @note + * Because the card contents may change, we check for focusable elements + * every time the handler is called. + * + * @private + * @param {KeyboardEvent} event + */ + _trapFocusExit(event) { + if (!(event instanceof KeyboardEvent)) + return; + if (event.key !== "Tab") + return; + const isFocusedContainer = event.target === this.card; + const isFocusedAnchor = event.target === this.overlay.anchor; + const isFocusedWithin = this.card.contains(event.target); + const stopEvent = () => { + event.preventDefault(); + event.stopImmediatePropagation(); + }; + if (!(isFocusedWithin || isFocusedContainer || isFocusedAnchor)) { + stopEvent(); + this.card.focus(); + return; + } + const focusableElements = getAllFocusableChildren(this.card).filter( + (el) => !el.classList.contains(_Card.attr.CLASS_FULL_SCREEN_ENTER) + ); + const hasFocusableElements = focusableElements.length > 0; + if (!hasFocusableElements) { + stopEvent(); + this.overlay.anchor.focus(); + return; + } + if (isFocusedContainer) + return; + const lastFocusable = focusableElements[focusableElements.length - 1]; + const isFocusedLast = event.target === lastFocusable; + if (isFocusedAnchor && event.shiftKey) { + stopEvent(); + lastFocusable.focus(); + return; + } + if (isFocusedLast && !event.shiftKey) { + stopEvent(); + this.overlay.anchor.focus(); + return; + } + } + /** + * Creates the full screen overlay. + * @private + * @returns {CardFullScreenOverlay} + */ + _createOverlay() { + const container = document.createElement("div"); + container.id = _Card.attr.ID_FULL_SCREEN_OVERLAY; + container.onclick = this.exitFullScreen.bind(this); + const anchor = this._createOverlayCloseAnchor(); + container.appendChild(anchor); + return { container, anchor }; + } + /** + * Creates the anchor element used to exit the full screen mode. + * @private + * @returns {CardFullScreenOverlay["anchor"]} + */ + _createOverlayCloseAnchor() { + const anchor = document.createElement("a"); + anchor.classList.add(_Card.attr.CLASS_FULL_SCREEN_EXIT); + anchor.tabIndex = 0; + anchor.setAttribute("aria-expanded", "true"); + anchor.setAttribute("aria-label", "Close card"); + anchor.setAttribute("role", "button"); + anchor.onclick = (ev) => { + this.exitFullScreen(); + ev.stopPropagation(); + }; + anchor.onkeydown = (ev) => { + if (ev.key === "Enter" || ev.key === " ") { + this.exitFullScreen(); + } + }; + anchor.innerHTML = this._overlayCloseHtml(); + return anchor; + } + /** + * Returns the HTML for the close icon. + * @private + * @returns {string} + */ + _overlayCloseHtml() { + return "Close "; + } + /** + * Returns the card instance associated with the given element, if any. + * @public + * @static + * @param {HTMLElement} el + * @returns {(Card | undefined)} + */ + static getInstance(el) { + return _Card.instanceMap.get(el); + } + /** + * Initializes all cards that require initialization on the page, or schedules + * initialization if the DOM is not yet ready. + * @public + * @static + * @param {boolean} [flushResizeObserver=true] + */ + static initializeAllCards(flushResizeObserver = true) { + if (document.readyState === "loading") { + if (!_Card.onReadyScheduled) { + _Card.onReadyScheduled = true; + document.addEventListener("DOMContentLoaded", () => { + _Card.initializeAllCards(false); + }); + } + return; + } + if (flushResizeObserver) { + _Card.shinyResizeObserver.flush(); + } + const initSelector = `.${_Card.attr.CLASS_CARD}[${_Card.attr.ATTR_INIT}]`; + if (!document.querySelector(initSelector)) { + return; + } + const cards = document.querySelectorAll(initSelector); + cards.forEach((card) => new _Card(card)); + } + }; + Card = _Card; + /** + * Key bslib-specific classes and attributes used by the card component. + * @private + * @static + */ + Card.attr = { + // eslint-disable-next-line @typescript-eslint/naming-convention + ATTR_INIT: "data-bslib-card-init", + // eslint-disable-next-line @typescript-eslint/naming-convention + CLASS_CARD: "bslib-card", + // eslint-disable-next-line @typescript-eslint/naming-convention + ATTR_FULL_SCREEN: "data-full-screen", + // eslint-disable-next-line @typescript-eslint/naming-convention + CLASS_HAS_FULL_SCREEN: "bslib-has-full-screen", + // eslint-disable-next-line @typescript-eslint/naming-convention + CLASS_FULL_SCREEN_ENTER: "bslib-full-screen-enter", + // eslint-disable-next-line @typescript-eslint/naming-convention + CLASS_FULL_SCREEN_EXIT: "bslib-full-screen-exit", + // eslint-disable-next-line @typescript-eslint/naming-convention + ID_FULL_SCREEN_OVERLAY: "bslib-full-screen-overlay", + // eslint-disable-next-line @typescript-eslint/naming-convention + CLASS_SHINY_INPUT: "bslib-card-input" + }; + /** + * A Shiny-specific resize observer that ensures Shiny outputs in within the + * card resize appropriately. + * @private + * @type {ShinyResizeObserver} + * @static + */ + Card.shinyResizeObserver = new ShinyResizeObserver(); + /** + * Watch card parent containers for removal and exit full screen mode if a + * full screen card is removed from the DOM. + * + * @private + * @type {ShinyRemovedObserver} + * @static + */ + Card.cardRemovedObserver = new ShinyRemovedObserver( + `.${_Card.attr.CLASS_CARD}`, + (el) => { + const card = _Card.getInstance(el); + if (!card) + return; + if (card.card.getAttribute(_Card.attr.ATTR_FULL_SCREEN) === "true") { + card.exitFullScreen(); + } + } + ); + /** + * The registry of card instances and their associated DOM elements. + * @private + * @static + * @type {WeakMap} + */ + Card.instanceMap = /* @__PURE__ */ new WeakMap(); + /** + * If cards are initialized before the DOM is ready, we re-schedule the + * initialization to occur on DOMContentLoaded. + * @private + * @static + * @type {boolean} + */ + Card.onReadyScheduled = false; + registerBslibGlobal("Card", Card); + } + }); + + // srcts/src/components/sidebar.ts + var _Sidebar, Sidebar, SidebarInputBinding; + var init_sidebar = __esm({ + "srcts/src/components/sidebar.ts"() { + "use strict"; + init_utils(); + init_shinyResizeObserver(); + _Sidebar = class { + /** + * Creates an instance of a collapsible bslib Sidebar. + * @constructor + * @param {HTMLElement} container + */ + constructor(container) { + /** + * The current window size, either `"desktop"` or `"mobile"`. + * @private + * @type {SidebarWindowSize | ""} + */ + this.windowSize = ""; + var _a; + _Sidebar.instanceMap.set(container, this); + this.layout = { + container, + main: container.querySelector(":scope > .main"), + sidebar: container.querySelector(":scope > .sidebar"), + toggle: container.querySelector( + ":scope > .collapse-toggle" + ) + }; + const sideAccordion = this.layout.sidebar.querySelector( + ":scope > .sidebar-content > .accordion" + ); + if (sideAccordion) { + (_a = sideAccordion == null ? void 0 : sideAccordion.parentElement) == null ? void 0 : _a.classList.add("has-accordion"); + sideAccordion.classList.add("accordion-flush"); + } + this._initSidebarCounters(); + this._initSidebarState(); + if (this._isCollapsible("desktop") || this._isCollapsible("mobile")) { + this._initEventListeners(); + } + _Sidebar.shinyResizeObserver.observe(this.layout.main); + container.removeAttribute("data-bslib-sidebar-init"); + const initScript = container.querySelector( + ":scope > script[data-bslib-sidebar-init]" + ); + if (initScript) { + container.removeChild(initScript); + } + } + /** + * Read the current state of the sidebar. Note that, when calling this method, + * the sidebar may be transitioning into the state returned by this method. + * + * @description + * The sidebar state works as follows, starting from the open state. When the + * sidebar is closed: + * 1. We add both the `COLLAPSE` and `TRANSITIONING` classes to the sidebar. + * 2. The sidebar collapse begins to animate. In general, where it is + * supported, we transition the `grid-template-columns` property of the + * sidebar layout. We also rotate the collapse icon and we use this + * rotation to determine when the transition is complete. + * 3. If another sidebar state toggle is requested while closing the sidebar, + * we remove the `COLLAPSE` class and the animation immediately starts to + * reverse. + * 4. When the `transition` is complete, we remove the `TRANSITIONING` class. + * @readonly + * @type {boolean} + */ + get isClosed() { + return this.layout.container.classList.contains(_Sidebar.classes.COLLAPSE); + } + /** + * Given a sidebar container, return the Sidebar instance associated with it. + * @public + * @static + * @param {HTMLElement} el + * @returns {(Sidebar | undefined)} + */ + static getInstance(el) { + return _Sidebar.instanceMap.get(el); + } + /** + * Determine whether the sidebar is collapsible at a given screen size. + * @private + * @param {SidebarWindowSize} [size="desktop"] + * @returns {boolean} + */ + _isCollapsible(size = "desktop") { + const { container } = this.layout; + const attr = size === "desktop" ? "collapsibleDesktop" : "collapsibleMobile"; + const isCollapsible = container.dataset[attr]; + if (isCollapsible === void 0) { + return true; + } + return isCollapsible.trim().toLowerCase() !== "false"; + } + /** + * Initialize all collapsible sidebars on the page. + * @public + * @static + * @param {boolean} [flushResizeObserver=true] When `true`, we remove + * non-existent elements from the ResizeObserver. This is required + * periodically to prevent memory leaks. To avoid over-checking, we only flush + * the ResizeObserver when initializing sidebars after page load. + */ + static initCollapsibleAll(flushResizeObserver = true) { + if (document.readyState === "loading") { + if (!_Sidebar.onReadyScheduled) { + _Sidebar.onReadyScheduled = true; + document.addEventListener("DOMContentLoaded", () => { + _Sidebar.initCollapsibleAll(false); + }); + } + return; + } + const initSelector = `.${_Sidebar.classes.LAYOUT}[data-bslib-sidebar-init]`; + if (!document.querySelector(initSelector)) { + return; + } + if (flushResizeObserver) + _Sidebar.shinyResizeObserver.flush(); + const containers = document.querySelectorAll(initSelector); + containers.forEach((container) => new _Sidebar(container)); + } + /** + * Initialize event listeners for the sidebar toggle button. + * @private + */ + _initEventListeners() { + var _a; + const { toggle } = this.layout; + toggle.addEventListener("click", (ev) => { + ev.preventDefault(); + this.toggle("toggle"); + }); + (_a = toggle.querySelector(".collapse-icon")) == null ? void 0 : _a.addEventListener("transitionend", () => this._finalizeState()); + if (this._isCollapsible("desktop") && this._isCollapsible("mobile")) { + return; + } + window.addEventListener("resize", () => this._handleWindowResizeEvent()); + } + /** + * Initialize nested sidebar counters. + * + * @description + * This function walks up the DOM tree, adding CSS variables to each direct + * parent sidebar layout that count the layout's position in the stack of + * nested layouts. We use these counters to keep the collapse toggles from + * overlapping. Note that always-open sidebars that don't have collapse + * toggles break the chain of nesting. + * @private + */ + _initSidebarCounters() { + const { container } = this.layout; + const selectorChildLayouts = `.${_Sidebar.classes.LAYOUT}> .main > .${_Sidebar.classes.LAYOUT}:not([data-bslib-sidebar-open="always"])`; + const isInnermostLayout = container.querySelector(selectorChildLayouts) === null; + if (!isInnermostLayout) { + return; + } + function nextSidebarParent(el) { + el = el ? el.parentElement : null; + if (el && el.classList.contains("main")) { + el = el.parentElement; + } + if (el && el.classList.contains(_Sidebar.classes.LAYOUT)) { + return el; + } + return null; + } + const layouts = [container]; + let parent = nextSidebarParent(container); + while (parent) { + layouts.unshift(parent); + parent = nextSidebarParent(parent); + } + const count = { left: 0, right: 0 }; + layouts.forEach(function(x) { + const isRight = x.classList.contains("sidebar-right"); + const thisCount = isRight ? count.right++ : count.left++; + x.style.setProperty("--_js-toggle-count-this-side", thisCount.toString()); + x.style.setProperty( + "--_js-toggle-count-max-side", + Math.max(count.right, count.left).toString() + ); + }); + } + /** + * Retrieves the current window size by reading a CSS variable whose value is + * toggled via media queries. + * @returns The window size as `"desktop"` or `"mobile"`, or `""` if not + * available. + */ + _getWindowSize() { + const { container } = this.layout; + return window.getComputedStyle(container).getPropertyValue("--bslib-sidebar-js-window-size").trim(); + } + /** + * Determine the initial toggle state of the sidebar at a current screen size. + * It always returns whether we should `"open"` or `"close"` the sidebar. + * + * @private + * @returns {("close" | "open")} + */ + _initialToggleState() { + var _a, _b; + const { container } = this.layout; + const attr = this.windowSize === "desktop" ? "openDesktop" : "openMobile"; + const initState = (_b = (_a = container.dataset[attr]) == null ? void 0 : _a.trim()) == null ? void 0 : _b.toLowerCase(); + if (initState === void 0) { + return "open"; + } + if (["open", "always"].includes(initState)) { + return "open"; + } + if (["close", "closed"].includes(initState)) { + return "close"; + } + return "open"; + } + /** + * Initialize the sidebar's initial state when `open = "desktop"`. + * @private + */ + _initSidebarState() { + this.windowSize = this._getWindowSize(); + const initState = this._initialToggleState(); + this.toggle(initState, true); + } + /** + * Updates the sidebar state when the window is resized across the mobile- + * desktop boundary. + */ + _handleWindowResizeEvent() { + const newSize = this._getWindowSize(); + if (!newSize || newSize == this.windowSize) { + return; + } + this._initSidebarState(); + } + /** + * Toggle the sidebar's open/closed state. + * @public + * @param {SidebarToggleMethod | undefined} method Whether to `"open"`, + * `"close"` or `"toggle"` the sidebar. If `.toggle()` is called without an + * argument, it will toggle the sidebar's state. + * @param {boolean} [immediate=false] If `true`, the sidebar state will be + * set immediately, without a transition. This is primarily used when the + * sidebar is initialized. + */ + toggle(method, immediate = false) { + if (typeof method === "undefined") { + method = "toggle"; + } else if (method === "closed") { + method = "close"; + } + const { container, sidebar } = this.layout; + const isClosed = this.isClosed; + if (["open", "close", "toggle"].indexOf(method) === -1) { + throw new Error(`Unknown method ${method}`); + } + if (method === "toggle") { + method = isClosed ? "open" : "close"; + } + if (isClosed && method === "close" || !isClosed && method === "open") { + if (immediate) + this._finalizeState(); + return; + } + if (method === "open") { + sidebar.hidden = false; + } + container.classList.toggle(_Sidebar.classes.TRANSITIONING, !immediate); + container.classList.toggle(_Sidebar.classes.COLLAPSE); + if (immediate) { + this._finalizeState(); + } + } + /** + * When the sidebar open/close transition ends, finalize the sidebar's state. + * @private + */ + _finalizeState() { + const { container, sidebar, toggle } = this.layout; + container.classList.remove(_Sidebar.classes.TRANSITIONING); + sidebar.hidden = this.isClosed; + toggle.setAttribute("aria-expanded", this.isClosed ? "false" : "true"); + const event = new CustomEvent("bslib.sidebar", { + bubbles: true, + detail: { open: !this.isClosed } + }); + sidebar.dispatchEvent(event); + $(sidebar).trigger("toggleCollapse.sidebarInputBinding"); + $(sidebar).trigger(this.isClosed ? "hidden" : "shown"); + } + }; + Sidebar = _Sidebar; + /** + * A Shiny-specific resize observer that ensures Shiny outputs in the main + * content areas of the sidebar resize appropriately. + * @private + * @type {ShinyResizeObserver} + * @static + */ + Sidebar.shinyResizeObserver = new ShinyResizeObserver(); + /** + * Static classes related to the sidebar layout or state. + * @public + * @static + * @readonly + * @type {{ LAYOUT: string; COLLAPSE: string; TRANSITIONING: string; }} + */ + Sidebar.classes = { + // eslint-disable-next-line @typescript-eslint/naming-convention + LAYOUT: "bslib-sidebar-layout", + // eslint-disable-next-line @typescript-eslint/naming-convention + COLLAPSE: "sidebar-collapsed", + // eslint-disable-next-line @typescript-eslint/naming-convention + TRANSITIONING: "transitioning" + }; + /** + * If sidebars are initialized before the DOM is ready, we re-schedule the + * initialization to occur on DOMContentLoaded. + * @private + * @static + * @type {boolean} + */ + Sidebar.onReadyScheduled = false; + /** + * A map of initialized sidebars to their respective Sidebar instances. + * @private + * @static + * @type {WeakMap} + */ + Sidebar.instanceMap = /* @__PURE__ */ new WeakMap(); + SidebarInputBinding = class extends InputBinding { + find(scope) { + return $(scope).find(`.${Sidebar.classes.LAYOUT} > .bslib-sidebar-input`); + } + getValue(el) { + const sb = Sidebar.getInstance(el.parentElement); + if (!sb) + return false; + return !sb.isClosed; + } + setValue(el, value) { + const method = value ? "open" : "close"; + this.receiveMessage(el, { method }); + } + subscribe(el, callback) { + $(el).on( + "toggleCollapse.sidebarInputBinding", + // eslint-disable-next-line @typescript-eslint/no-unused-vars + function(event) { + callback(true); + } + ); + } + unsubscribe(el) { + $(el).off(".sidebarInputBinding"); + } + receiveMessage(el, data) { + const sb = Sidebar.getInstance(el.parentElement); + if (sb) + sb.toggle(data.method); + } + }; + registerBinding(SidebarInputBinding, "sidebar"); + registerBslibGlobal("Sidebar", Sidebar); + } + }); + + // srcts/src/components/taskButton.ts + var _clickCount, _clickListeners, _setState, setState_fn, BslibTaskButtonInputBinding; + var init_taskButton = __esm({ + "srcts/src/components/taskButton.ts"() { + "use strict"; + init_utils(); + BslibTaskButtonInputBinding = class extends InputBinding { + constructor() { + super(...arguments); + /** + * Reach into the child and to switch to the state case. + */ + __privateAdd(this, _setState); + __privateAdd(this, _clickCount, /* @__PURE__ */ new WeakMap()); + __privateAdd(this, _clickListeners, /* @__PURE__ */ new WeakMap()); + } + find(scope) { + return $(scope).find(".bslib-task-button"); + } + getValue(el) { + var _a; + return { + value: (_a = __privateGet(this, _clickCount).get(el)) != null ? _a : 0, + autoReset: el.hasAttribute("data-auto-reset") + }; + } + getType() { + return "bslib.taskbutton"; + } + subscribe(el, callback) { + if (__privateGet(this, _clickListeners).has(el)) { + this.unsubscribe(el); + } + const eventListener = () => { + var _a; + __privateGet(this, _clickCount).set(el, ((_a = __privateGet(this, _clickCount).get(el)) != null ? _a : 0) + 1); + callback(true); + __privateMethod(this, _setState, setState_fn).call(this, el, "busy"); + }; + __privateGet(this, _clickListeners).set(el, eventListener); + el.addEventListener("click", eventListener); + } + unsubscribe(el) { + const listener = __privateGet(this, _clickListeners).get(el); + if (listener) { + el.removeEventListener("click", listener); + } + } + receiveMessage(_0, _1) { + return __async(this, arguments, function* (el, { state }) { + __privateMethod(this, _setState, setState_fn).call(this, el, state); + }); + } + }; + _clickCount = new WeakMap(); + _clickListeners = new WeakMap(); + _setState = new WeakSet(); + setState_fn = function(el, state) { + el.disabled = state === "busy"; + const tbc = el.querySelector( + "bslib-switch-inline" + ); + if (tbc) { + tbc.case = state; + } + }; + registerBinding(BslibTaskButtonInputBinding, "task-button"); + } + }); + + // srcts/src/components/_shinyAddCustomMessageHandlers.ts + function shinyAddCustomMessageHandlers(handlers) { + if (!window.Shiny) { + return; + } + for (const [name, handler] of Object.entries(handlers)) { + window.Shiny.addCustomMessageHandler(name, handler); + } + } + var init_shinyAddCustomMessageHandlers = __esm({ + "srcts/src/components/_shinyAddCustomMessageHandlers.ts"() { + "use strict"; + } + }); + + // srcts/src/components/index.ts + var require_components = __commonJS({ + "srcts/src/components/index.ts"(exports) { + init_accordion(); + init_card(); + init_sidebar(); + init_taskButton(); + init_utils(); + init_shinyAddCustomMessageHandlers(); + var bslibMessageHandlers = { + // eslint-disable-next-line @typescript-eslint/naming-convention + "bslib.toggle-input-binary": (msg) => __async(exports, null, function* () { + const el = document.getElementById(msg.id); + if (!el) { + console.warn("[bslib.toggle-input-binary] No element found", msg); + } + const binding = $(el).data("shiny-input-binding"); + if (!(binding instanceof InputBinding)) { + console.warn("[bslib.toggle-input-binary] No input binding found", msg); + return; + } + let value = msg.value; + if (typeof value === "undefined") { + value = !binding.getValue(el); + } + yield binding.receiveMessage(el, { value }); + }) + }; + if (window.Shiny) { + shinyAddCustomMessageHandlers(bslibMessageHandlers); + } + function insertSvgGradient() { + const temp = document.createElement("div"); + temp.innerHTML = ` + `; + document.body.appendChild(temp.children[0]); + } + if (document.readyState === "complete") { + insertSvgGradient(); + } else { + document.addEventListener("DOMContentLoaded", insertSvgGradient); + } + } + }); + require_components(); +})(); +//# sourceMappingURL=components.js.map diff --git a/articles/bs4Dash_files/bslib-component-css-0.8.0/components.js.map b/articles/bs4Dash_files/bslib-component-css-0.8.0/components.js.map new file mode 100644 index 00000000..68bf7ced --- /dev/null +++ b/articles/bs4Dash_files/bslib-component-css-0.8.0/components.js.map @@ -0,0 +1,7 @@ +{ + "version": 3, + "sources": ["../../../srcts/src/components/_utils.ts", "../../../srcts/src/components/accordion.ts", "../../../srcts/src/components/_shinyResizeObserver.ts", "../../../srcts/src/components/_shinyRemovedObserver.ts", "../../../srcts/src/components/card.ts", "../../../srcts/src/components/sidebar.ts", "../../../srcts/src/components/taskButton.ts", "../../../srcts/src/components/_shinyAddCustomMessageHandlers.ts", "../../../srcts/src/components/index.ts"], + "sourcesContent": ["import type { HtmlDep } from \"rstudio-shiny/srcts/types/src/shiny/render\";\n\nimport type { InputBinding as InputBindingType } from \"rstudio-shiny/srcts/types/src/bindings/input\";\n\nimport type { ShinyClass } from \"rstudio-shiny/srcts/types/src\";\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nconst Shiny: ShinyClass | undefined = window.Shiny;\n\n// Exclude undefined from T\ntype NotUndefined = T extends undefined ? never : T;\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nconst InputBinding = (\n Shiny ? Shiny.InputBinding : class {}\n) as typeof InputBindingType;\n\nfunction registerBinding(\n inputBindingClass: new () => InputBindingType,\n name: string\n): void {\n if (Shiny) {\n Shiny.inputBindings.register(new inputBindingClass(), \"bslib.\" + name);\n }\n}\n\nfunction registerBslibGlobal(name: string, value: object): void {\n (window as any).bslib = (window as any).bslib || {};\n if (!(window as any).bslib[name]) {\n (window as any).bslib[name] = value;\n } else {\n console.error(\n `[bslib] Global window.bslib.${name} was already defined, using previous definition.`\n );\n }\n}\n\n// Return true if the key exists on the object and the value is not undefined.\n//\n// This method is mainly used in input bindings' `receiveMessage` method.\n// Since we know that the values are sent by Shiny via `{jsonlite}`,\n// then we know that there are no `undefined` values. `null` is possible, but not `undefined`.\nfunction hasDefinedProperty<\n Prop extends keyof X,\n X extends { [key: string]: any }\n>(\n obj: X,\n prop: Prop\n): obj is X & { [key in NonNullable]: NotUndefined } {\n return (\n Object.prototype.hasOwnProperty.call(obj, prop) && obj[prop] !== undefined\n );\n}\n\n// TODO: Shiny should trigger resize events when the output\n// https://github.com/rstudio/shiny/pull/3682\nfunction doWindowResizeOnElementResize(el: HTMLElement): void {\n if ($(el).data(\"window-resize-observer\")) {\n return;\n }\n const resizeEvent = new Event(\"resize\");\n const ro = new ResizeObserver(() => {\n window.dispatchEvent(resizeEvent);\n });\n ro.observe(el);\n $(el).data(\"window-resize-observer\", ro);\n}\n\nfunction getAllFocusableChildren(el: HTMLElement): HTMLElement[] {\n // Cross-referenced with https://allyjs.io/data-tables/focusable.html\n const base = [\n \"a[href]\",\n \"area[href]\",\n \"button\",\n \"details summary\",\n \"input\",\n \"iframe\",\n \"select\",\n \"textarea\",\n '[contentEditable=\"\"]',\n '[contentEditable=\"true\"]',\n '[contentEditable=\"TRUE\"]',\n \"[tabindex]\",\n ];\n const modifiers = [':not([tabindex=\"-1\"])', \":not([disabled])\"];\n const selectors = base.map((b) => b + modifiers.join(\"\"));\n const focusable = el.querySelectorAll(selectors.join(\", \"));\n return Array.from(focusable) as HTMLElement[];\n}\n\nasync function shinyRenderContent(\n ...args: Parameters\n): Promise {\n if (!Shiny) {\n throw new Error(\"This function must be called in a Shiny app.\");\n }\n if (Shiny.renderContentAsync) {\n return await Shiny.renderContentAsync.apply(null, args);\n } else {\n return await Shiny.renderContent.apply(null, args);\n }\n}\n\nexport {\n InputBinding,\n registerBinding,\n registerBslibGlobal,\n hasDefinedProperty,\n doWindowResizeOnElementResize,\n getAllFocusableChildren,\n shinyRenderContent,\n Shiny,\n};\nexport type { HtmlDep };\n", "import type { HtmlDep } from \"./_utils\";\nimport {\n InputBinding,\n registerBinding,\n hasDefinedProperty,\n shinyRenderContent,\n} from \"./_utils\";\n\ntype AccordionItem = {\n item: HTMLElement;\n value: string;\n isOpen: () => boolean;\n show: () => void;\n hide: () => void;\n};\n\ntype HTMLContent = {\n html: string;\n deps?: HtmlDep[];\n};\n\ntype SetMessage = {\n method: \"set\";\n values: string[];\n};\n\ntype OpenMessage = {\n method: \"open\";\n values: string[] | true;\n};\n\ntype CloseMessage = {\n method: \"close\";\n values: string[] | true;\n};\n\ntype InsertMessage = {\n method: \"insert\";\n panel: HTMLContent;\n target: string;\n position: \"after\" | \"before\";\n};\n\ntype RemoveMessage = {\n method: \"remove\";\n target: string[];\n};\n\ntype UpdateMessage = {\n method: \"update\";\n target: string;\n value: string;\n body: HTMLContent;\n title: HTMLContent;\n icon: HTMLContent;\n};\n\ntype MessageData =\n | CloseMessage\n | InsertMessage\n | OpenMessage\n | RemoveMessage\n | SetMessage\n | UpdateMessage;\n\nclass AccordionInputBinding extends InputBinding {\n find(scope: HTMLElement) {\n return $(scope).find(\".accordion.bslib-accordion-input\");\n }\n\n getValue(el: HTMLElement): string[] | null {\n const items = this._getItemInfo(el);\n const selected = items.filter((x) => x.isOpen()).map((x) => x.value);\n return selected.length === 0 ? null : selected;\n }\n\n subscribe(el: HTMLElement, callback: (x: boolean) => void) {\n $(el).on(\n \"shown.bs.collapse.accordionInputBinding hidden.bs.collapse.accordionInputBinding\",\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n function (event) {\n callback(true);\n }\n );\n }\n\n unsubscribe(el: HTMLElement) {\n $(el).off(\".accordionInputBinding\");\n }\n\n async receiveMessage(el: HTMLElement, data: MessageData) {\n const method = data.method;\n if (method === \"set\") {\n this._setItems(el, data);\n } else if (method === \"open\") {\n this._openItems(el, data);\n } else if (method === \"close\") {\n this._closeItems(el, data);\n } else if (method === \"remove\") {\n this._removeItem(el, data);\n } else if (method === \"insert\") {\n await this._insertItem(el, data);\n } else if (method === \"update\") {\n await this._updateItem(el, data);\n } else {\n throw new Error(`Method not yet implemented: ${method}`);\n }\n }\n\n protected _setItems(el: HTMLElement, data: SetMessage) {\n const items = this._getItemInfo(el);\n const vals = this._getValues(el, items, data.values);\n items.forEach((x) => {\n vals.indexOf(x.value) > -1 ? x.show() : x.hide();\n });\n }\n\n protected _openItems(el: HTMLElement, data: OpenMessage) {\n const items = this._getItemInfo(el);\n const vals = this._getValues(el, items, data.values);\n items.forEach((x) => {\n if (vals.indexOf(x.value) > -1) x.show();\n });\n }\n\n protected _closeItems(el: HTMLElement, data: CloseMessage) {\n const items = this._getItemInfo(el);\n const vals = this._getValues(el, items, data.values);\n items.forEach((x) => {\n if (vals.indexOf(x.value) > -1) x.hide();\n });\n }\n\n protected async _insertItem(el: HTMLElement, data: InsertMessage) {\n let targetItem = this._findItem(el, data.target);\n\n // If no target was specified, or the target was not found, then default\n // to the first or last item, depending on the position\n if (!targetItem) {\n targetItem = (\n data.position === \"before\" ? el.firstElementChild : el.lastElementChild\n ) as HTMLElement;\n }\n\n const panel = data.panel;\n\n // If there is still no targetItem, then there are no items in the accordion\n if (targetItem) {\n await shinyRenderContent(\n targetItem,\n panel,\n data.position === \"before\" ? \"beforeBegin\" : \"afterEnd\"\n );\n } else {\n await shinyRenderContent(el, panel);\n }\n\n // Need to add a reference to the parent id that makes autoclose to work\n if (this._isAutoClosing(el)) {\n const val = $(panel.html).attr(\"data-value\");\n $(el)\n .find(`[data-value=\"${val}\"] .accordion-collapse`)\n .attr(\"data-bs-parent\", \"#\" + el.id);\n }\n }\n\n protected _removeItem(el: HTMLElement, data: RemoveMessage) {\n const targetItems = this._getItemInfo(el).filter(\n (x) => data.target.indexOf(x.value) > -1\n );\n\n const unbindAll = window.Shiny?.unbindAll;\n\n targetItems.forEach((x) => {\n if (unbindAll) unbindAll(x.item);\n x.item.remove();\n });\n }\n\n protected async _updateItem(el: HTMLElement, data: UpdateMessage) {\n const target = this._findItem(el, data.target);\n\n if (!target) {\n throw new Error(\n `Unable to find an accordion_panel() with a value of ${data.target}`\n );\n }\n\n if (hasDefinedProperty(data, \"value\")) {\n target.dataset.value = data.value;\n }\n\n if (hasDefinedProperty(data, \"body\")) {\n const body = target.querySelector(\".accordion-body\") as HTMLElement; // always exists\n await shinyRenderContent(body, data.body);\n }\n\n const header = target.querySelector(\".accordion-header\") as HTMLElement; // always exists\n\n if (hasDefinedProperty(data, \"title\")) {\n const title = header.querySelector(\".accordion-title\") as HTMLElement; // always exists\n await shinyRenderContent(title, data.title);\n }\n\n if (hasDefinedProperty(data, \"icon\")) {\n const icon = header.querySelector(\n \".accordion-button > .accordion-icon\"\n ) as HTMLElement; // always exists\n await shinyRenderContent(icon, data.icon);\n }\n }\n\n protected _getItemInfo(el: HTMLElement): AccordionItem[] {\n const items = Array.from(\n el.querySelectorAll(\":scope > .accordion-item\")\n ) as HTMLElement[];\n return items.map((x) => this._getSingleItemInfo(x));\n }\n\n protected _getSingleItemInfo(x: HTMLElement): AccordionItem {\n const collapse = x.querySelector(\".accordion-collapse\") as HTMLElement;\n const isOpen = () => $(collapse).hasClass(\"show\");\n return {\n item: x,\n value: x.dataset.value as string,\n isOpen: isOpen,\n show: () => {\n if (!isOpen()) $(collapse).collapse(\"show\");\n },\n hide: () => {\n if (isOpen()) $(collapse).collapse(\"hide\");\n },\n };\n }\n\n protected _getValues(\n el: HTMLElement,\n items: AccordionItem[],\n values: string[] | true\n ): string[] {\n let vals = values !== true ? values : items.map((x) => x.value);\n const autoclose = this._isAutoClosing(el);\n if (autoclose) {\n vals = vals.slice(vals.length - 1, vals.length);\n }\n return vals;\n }\n\n protected _findItem(el: HTMLElement, value: string): HTMLElement | null {\n return el.querySelector(`[data-value=\"${value}\"]`);\n }\n\n protected _isAutoClosing(el: HTMLElement): boolean {\n return el.classList.contains(\"autoclose\");\n }\n}\n\nregisterBinding(AccordionInputBinding, \"accordion\");\n", "/**\n * A resize observer that ensures Shiny outputs resize during or just after\n * their parent container size changes. Useful, in particular, for sidebar\n * transitions or for full-screen card transitions.\n *\n * @class ShinyResizeObserver\n * @typedef {ShinyResizeObserver}\n */\nclass ShinyResizeObserver {\n /**\n * The actual ResizeObserver instance.\n * @private\n * @type {ResizeObserver}\n */\n private resizeObserver: ResizeObserver;\n /**\n * An array of elements that are currently being watched by the Resize\n * Observer.\n *\n * @details\n * We don't currently have lifecycle hooks that allow us to unobserve elements\n * when they are removed from the DOM. As a result, we need to manually check\n * that the elements we're watching still exist in the DOM. This array keeps\n * track of the elements we're watching so that we can check them later.\n * @private\n * @type {HTMLElement[]}\n */\n private resizeObserverEntries: HTMLElement[];\n\n /**\n * Watch containers for size changes and ensure that Shiny outputs and\n * htmlwidgets within resize appropriately.\n *\n * @details\n * The ShinyResizeObserver is used to watch the containers, such as Sidebars\n * and Cards for size changes, in particular when the sidebar state is toggled\n * or the card body is expanded full screen. It performs two primary tasks:\n *\n * 1. Dispatches a `resize` event on the window object. This is necessary to\n * ensure that Shiny outputs resize appropriately. In general, the window\n * resizing is throttled and the output update occurs when the transition\n * is complete.\n * 2. If an output with a resize method on the output binding is detected, we\n * directly call the `.onResize()` method of the binding. This ensures that\n * htmlwidgets transition smoothly. In static mode, htmlwidgets does this\n * already.\n *\n * @note\n * This resize observer also handles race conditions in some complex\n * fill-based layouts with multiple outputs (e.g., plotly), where shiny\n * initializes with the correct sizing, but in-between the 1st and last\n * renderValue(), the size of the output containers can change, meaning every\n * output but the 1st gets initialized with the wrong size during their\n * renderValue(). Then, after the render phase, shiny won't know to trigger a\n * resize since all the widgets will return to their original size (and thus,\n * Shiny thinks there isn't any resizing to do). The resize observer works\n * around this by ensuring that the output is resized whenever its container\n * size changes.\n * @constructor\n */\n constructor() {\n this.resizeObserverEntries = [];\n this.resizeObserver = new ResizeObserver((entries) => {\n const resizeEvent = new Event(\"resize\");\n window.dispatchEvent(resizeEvent);\n\n // the rest of this callback is only relevant in Shiny apps\n if (!window.Shiny) return;\n\n const resized = [] as HTMLElement[];\n\n for (const entry of entries) {\n if (!(entry.target instanceof HTMLElement)) continue;\n if (!entry.target.querySelector(\".shiny-bound-output\")) continue;\n\n entry.target\n .querySelectorAll(\".shiny-bound-output\")\n .forEach((el) => {\n if (resized.includes(el)) return;\n\n const { binding, onResize } = $(el).data(\"shinyOutputBinding\");\n if (!binding || !binding.resize) return;\n\n // if this output is owned by another observer, skip it\n const owner = (el as any).shinyResizeObserver;\n if (owner && owner !== this) return;\n // mark this output as owned by this shinyResizeObserver instance\n if (!owner) (el as any).shinyResizeObserver = this;\n\n // trigger immediate resizing of outputs with a resize method\n onResize(el);\n // only once per output and resize event\n resized.push(el);\n\n // set plot images to 100% width temporarily during the transition\n if (!el.classList.contains(\"shiny-plot-output\")) return;\n const img = el.querySelector(\n 'img:not([width=\"100%\"])'\n );\n if (img) img.setAttribute(\"width\", \"100%\");\n });\n }\n });\n }\n\n /**\n * Observe an element for size changes.\n * @param {HTMLElement} el - The element to observe.\n */\n observe(el: HTMLElement): void {\n this.resizeObserver.observe(el);\n this.resizeObserverEntries.push(el);\n }\n\n /**\n * Stop observing an element for size changes.\n * @param {HTMLElement} el - The element to stop observing.\n */\n unobserve(el: HTMLElement): void {\n const idxEl = this.resizeObserverEntries.indexOf(el);\n if (idxEl < 0) return;\n\n this.resizeObserver.unobserve(el);\n this.resizeObserverEntries.splice(idxEl, 1);\n }\n\n /**\n * This method checks that we're not continuing to watch elements that no\n * longer exist in the DOM. If any are found, we stop observing them and\n * remove them from our array of observed elements.\n *\n * @private\n * @static\n */\n flush(): void {\n this.resizeObserverEntries.forEach((el) => {\n if (!document.body.contains(el)) this.unobserve(el);\n });\n }\n}\n\nexport { ShinyResizeObserver };\n", "type Callback = (el: T) => void;\n\n/**\n * Watch for the removal of specific elements from regions of the page.\n */\nexport class ShinyRemovedObserver {\n private observer: MutationObserver;\n private watching: Set;\n\n /**\n * Creates a new instance of the `ShinyRemovedObserver` class to watch for the\n * removal of specific elements from part of the DOM.\n *\n * @param selector A CSS selector to identify elements to watch for removal.\n * @param callback The function to be called on a matching element when it\n * is removed.\n */\n constructor(selector: string, callback: Callback) {\n this.watching = new Set();\n this.observer = new MutationObserver((mutations) => {\n const found = new Set();\n for (const { type, removedNodes } of mutations) {\n if (type !== \"childList\") continue;\n if (removedNodes.length === 0) continue;\n\n for (const node of removedNodes) {\n if (!(node instanceof HTMLElement)) continue;\n if (node.matches(selector)) {\n found.add(node);\n }\n if (node.querySelector(selector)) {\n node\n .querySelectorAll(selector)\n .forEach((el) => found.add(el));\n }\n }\n }\n if (found.size === 0) return;\n for (const el of found) {\n try {\n callback(el);\n } catch (e) {\n console.error(e);\n }\n }\n });\n }\n\n /**\n * Starts observing the specified element for removal of its children. If the\n * element is already being observed, no change is made to the mutation\n * observer.\n * @param el The element to observe.\n */\n observe(el: HTMLElement): void {\n const changed = this._flush();\n if (this.watching.has(el)) {\n if (!changed) return;\n } else {\n this.watching.add(el);\n }\n\n if (changed) {\n this._restartObserver();\n } else {\n this.observer.observe(el, { childList: true, subtree: true });\n }\n }\n\n /**\n * Stops observing the specified element for removal.\n * @param el The element to unobserve.\n */\n unobserve(el: HTMLElement): void {\n if (!this.watching.has(el)) return;\n // MutationObserver doesn't have an \"unobserve\" method, so we have to\n // disconnect and re-observe all elements that are still being watched.\n this.watching.delete(el);\n this._flush();\n this._restartObserver();\n }\n\n /**\n * Restarts the mutation observer, observing all elements in the `watching`\n * and implicitly unobserving any elements that are no longer in the\n * watchlist.\n * @private\n */\n private _restartObserver(): void {\n this.observer.disconnect();\n for (const el of this.watching) {\n this.observer.observe(el, { childList: true, subtree: true });\n }\n }\n\n /**\n * Flushes the set of watched elements, removing any elements that are no\n * longer in the DOM, but it does not modify the mutation observer.\n * @private\n * @returns A boolean indicating whether the watched elements have changed.\n */\n private _flush(): boolean {\n let watchedChanged = false;\n const watched = Array.from(this.watching);\n for (const el of watched) {\n if (document.body.contains(el)) continue;\n this.watching.delete(el);\n watchedChanged = true;\n }\n return watchedChanged;\n }\n}\n", "import { getAllFocusableChildren, registerBslibGlobal, Shiny } from \"./_utils\";\nimport { ShinyResizeObserver } from \"./_shinyResizeObserver\";\nimport { ShinyRemovedObserver } from \"./_shinyRemovedObserver\";\n\n/**\n * The overlay element that is placed behind the card when expanded full screen.\n *\n * @interface CardFullScreenOverlay\n * @typedef {CardFullScreenOverlay}\n */\ninterface CardFullScreenOverlay {\n /**\n * The full screen overlay container.\n * @type {HTMLDivElement}\n */\n container: HTMLDivElement;\n /**\n * The anchor element used to close the full screen overlay.\n * @type {HTMLAnchorElement}\n */\n anchor: HTMLAnchorElement;\n}\n\n/**\n * The bslib card component class.\n *\n * @class Card\n * @typedef {Card}\n */\nclass Card {\n /**\n * The card container element.\n * @private\n * @type {HTMLElement}\n */\n private card: HTMLElement;\n /**\n * The card's full screen overlay element. We create this element once and add\n * and remove it from the DOM as needed (this simplifies focus management\n * while in full screen mode).\n * @private\n * @type {CardFullScreenOverlay}\n */\n private overlay: CardFullScreenOverlay;\n\n /**\n * Key bslib-specific classes and attributes used by the card component.\n * @private\n * @static\n */\n private static attr = {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n ATTR_INIT: \"data-bslib-card-init\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n CLASS_CARD: \"bslib-card\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n ATTR_FULL_SCREEN: \"data-full-screen\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n CLASS_HAS_FULL_SCREEN: \"bslib-has-full-screen\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n CLASS_FULL_SCREEN_ENTER: \"bslib-full-screen-enter\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n CLASS_FULL_SCREEN_EXIT: \"bslib-full-screen-exit\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n ID_FULL_SCREEN_OVERLAY: \"bslib-full-screen-overlay\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n CLASS_SHINY_INPUT: \"bslib-card-input\",\n };\n\n /**\n * A Shiny-specific resize observer that ensures Shiny outputs in within the\n * card resize appropriately.\n * @private\n * @type {ShinyResizeObserver}\n * @static\n */\n private static shinyResizeObserver = new ShinyResizeObserver();\n\n /**\n * Watch card parent containers for removal and exit full screen mode if a\n * full screen card is removed from the DOM.\n *\n * @private\n * @type {ShinyRemovedObserver}\n * @static\n */\n private static cardRemovedObserver = new ShinyRemovedObserver(\n `.${Card.attr.CLASS_CARD}`,\n (el) => {\n const card = Card.getInstance(el);\n if (!card) return;\n if (card.card.getAttribute(Card.attr.ATTR_FULL_SCREEN) === \"true\") {\n card.exitFullScreen();\n }\n }\n );\n\n /**\n * Creates an instance of a bslib Card component.\n *\n * @constructor\n * @param {HTMLElement} card\n */\n constructor(card: HTMLElement) {\n // remove initialization attribute and script\n card.removeAttribute(Card.attr.ATTR_INIT);\n card\n .querySelector(`script[${Card.attr.ATTR_INIT}]`)\n ?.remove();\n\n this.card = card;\n Card.instanceMap.set(card, this);\n\n // Let Shiny know to trigger resize when the card size changes\n // TODO: shiny could/should do this itself (rstudio/shiny#3682)\n Card.shinyResizeObserver.observe(this.card);\n Card.cardRemovedObserver.observe(document.body);\n\n this._addEventListeners();\n this.overlay = this._createOverlay();\n this._setShinyInput();\n\n // bind event handler methods to this card instance\n this._exitFullScreenOnEscape = this._exitFullScreenOnEscape.bind(this);\n this._trapFocusExit = this._trapFocusExit.bind(this);\n }\n\n /**\n * Enter the card's full screen mode, either programmatically or via an event\n * handler. Full screen mode is activated by adding a class to the card that\n * positions it absolutely and expands it to fill the viewport. In addition,\n * we add a full screen overlay element behind the card and we trap focus in\n * the expanded card while in full screen mode.\n *\n * @param {?Event} [event]\n */\n enterFullScreen(event?: Event): void {\n if (event) event.preventDefault();\n\n // Update close anchor to control current expanded card\n if (this.card.id) {\n this.overlay.anchor.setAttribute(\"aria-controls\", this.card.id);\n }\n\n document.addEventListener(\"keydown\", this._exitFullScreenOnEscape, false);\n\n // trap focus in the fullscreen container, listening for Tab key on the\n // capture phase so we have the best chance of preventing other handlers\n document.addEventListener(\"keydown\", this._trapFocusExit, true);\n\n this.card.setAttribute(Card.attr.ATTR_FULL_SCREEN, \"true\");\n document.body.classList.add(Card.attr.CLASS_HAS_FULL_SCREEN);\n this.card.insertAdjacentElement(\"beforebegin\", this.overlay.container);\n\n // Set initial focus on the card, if not already\n if (\n !this.card.contains(document.activeElement) ||\n document.activeElement?.classList.contains(\n Card.attr.CLASS_FULL_SCREEN_ENTER\n )\n ) {\n this.card.setAttribute(\"tabindex\", \"-1\");\n this.card.focus();\n }\n\n this._emitFullScreenEvent(true);\n this._setShinyInput();\n }\n\n /**\n * Exit full screen mode. This removes the full screen overlay element,\n * removes the full screen class from the card, and removes the keyboard event\n * listeners that were added when entering full screen mode.\n */\n exitFullScreen(): void {\n document.removeEventListener(\n \"keydown\",\n this._exitFullScreenOnEscape,\n false\n );\n document.removeEventListener(\"keydown\", this._trapFocusExit, true);\n\n // Remove overlay and remove full screen classes from card\n this.overlay.container.remove();\n this.card.setAttribute(Card.attr.ATTR_FULL_SCREEN, \"false\");\n this.card.removeAttribute(\"tabindex\");\n document.body.classList.remove(Card.attr.CLASS_HAS_FULL_SCREEN);\n\n this._emitFullScreenEvent(false);\n this._setShinyInput();\n }\n\n private _setShinyInput(): void {\n if (!this.card.classList.contains(Card.attr.CLASS_SHINY_INPUT)) return;\n if (!Shiny) return;\n if (!Shiny.setInputValue) {\n // Shiny isn't ready yet, so we'll try to set the input value again later,\n // (but it might not be ready then either, so we'll keep trying).\n setTimeout(() => this._setShinyInput(), 0);\n return;\n }\n const fsAttr = this.card.getAttribute(Card.attr.ATTR_FULL_SCREEN);\n Shiny.setInputValue(this.card.id + \"_full_screen\", fsAttr === \"true\");\n }\n\n /**\n * Emits a custom event to communicate the card's full screen state change.\n * @private\n * @param {boolean} fullScreen\n */\n private _emitFullScreenEvent(fullScreen: boolean): void {\n const event = new CustomEvent(\"bslib.card\", {\n bubbles: true,\n detail: { fullScreen },\n });\n this.card.dispatchEvent(event);\n }\n\n /**\n * Adds general card-specific event listeners.\n * @private\n */\n private _addEventListeners(): void {\n const btnFullScreen = this.card.querySelector(\n `:scope > * > .${Card.attr.CLASS_FULL_SCREEN_ENTER}`\n );\n if (!btnFullScreen) return;\n btnFullScreen.addEventListener(\"click\", (ev) => this.enterFullScreen(ev));\n }\n\n /**\n * An event handler to exit full screen mode when the Escape key is pressed.\n * @private\n * @param {KeyboardEvent} event\n */\n private _exitFullScreenOnEscape(event: KeyboardEvent): void {\n if (!(event.target instanceof HTMLElement)) return;\n // If the user is in the middle of a select input choice, don't exit\n const selOpenSelectInput = [\"select[open]\", \"input[aria-expanded='true']\"];\n if (event.target.matches(selOpenSelectInput.join(\", \"))) return;\n\n if (event.key === \"Escape\") {\n this.exitFullScreen();\n }\n }\n\n /**\n * An event handler to trap focus within the card when in full screen mode.\n *\n * @description\n * This keyboard event handler ensures that tab focus stays within the card\n * when in full screen mode. When the card is first expanded,\n * we move focus to the card element itself. If focus somehow leaves the card,\n * we returns focus to the card container.\n *\n * Within the card, we handle only tabbing from the close anchor or the last\n * focusable element and only when tab focus would have otherwise left the\n * card. In those cases, we cycle focus to the last focusable element or back\n * to the anchor. If the card doesn't have any focusable elements, we move\n * focus to the close anchor.\n *\n * @note\n * Because the card contents may change, we check for focusable elements\n * every time the handler is called.\n *\n * @private\n * @param {KeyboardEvent} event\n */\n private _trapFocusExit(event: KeyboardEvent): void {\n if (!(event instanceof KeyboardEvent)) return;\n if (event.key !== \"Tab\") return;\n\n const isFocusedContainer = event.target === this.card;\n const isFocusedAnchor = event.target === this.overlay.anchor;\n const isFocusedWithin = this.card.contains(event.target as Node);\n\n const stopEvent = () => {\n event.preventDefault();\n event.stopImmediatePropagation();\n };\n\n if (!(isFocusedWithin || isFocusedContainer || isFocusedAnchor)) {\n // If focus is outside the card, return to the card\n stopEvent();\n this.card.focus();\n return;\n }\n\n // Check focusables every time because the card contents may have changed\n // but exclude the full screen enter button from this list of elements\n const focusableElements = getAllFocusableChildren(this.card).filter(\n (el) => !el.classList.contains(Card.attr.CLASS_FULL_SCREEN_ENTER)\n );\n const hasFocusableElements = focusableElements.length > 0;\n\n // We need to handle five cases:\n // 1. The card has no focusable elements --> focus the anchor\n // 2. Focus is on the card container (do nothing, natural tab order)\n // 3. Focus is on the anchor and the user pressed Tab + Shift (backwards)\n // -> Move to the last focusable element (end of card)\n // 4. Focus is on the last focusable element and the user pressed Tab\n // (forwards) -> Move to the anchor (top of card)\n // 5. otherwise we don't interfere\n\n if (!hasFocusableElements) {\n // case 1\n stopEvent();\n this.overlay.anchor.focus();\n return;\n }\n\n // case 2\n if (isFocusedContainer) return;\n\n const lastFocusable = focusableElements[focusableElements.length - 1];\n const isFocusedLast = event.target === lastFocusable;\n\n if (isFocusedAnchor && event.shiftKey) {\n stopEvent();\n lastFocusable.focus();\n return;\n }\n\n if (isFocusedLast && !event.shiftKey) {\n stopEvent();\n this.overlay.anchor.focus();\n return;\n }\n }\n\n /**\n * Creates the full screen overlay.\n * @private\n * @returns {CardFullScreenOverlay}\n */\n private _createOverlay(): CardFullScreenOverlay {\n const container = document.createElement(\"div\");\n container.id = Card.attr.ID_FULL_SCREEN_OVERLAY;\n container.onclick = this.exitFullScreen.bind(this);\n\n const anchor = this._createOverlayCloseAnchor();\n container.appendChild(anchor);\n\n return { container, anchor };\n }\n\n /**\n * Creates the anchor element used to exit the full screen mode.\n * @private\n * @returns {CardFullScreenOverlay[\"anchor\"]}\n */\n private _createOverlayCloseAnchor(): CardFullScreenOverlay[\"anchor\"] {\n const anchor = document.createElement(\"a\");\n anchor.classList.add(Card.attr.CLASS_FULL_SCREEN_EXIT);\n anchor.tabIndex = 0;\n anchor.setAttribute(\"aria-expanded\", \"true\");\n anchor.setAttribute(\"aria-label\", \"Close card\");\n anchor.setAttribute(\"role\", \"button\");\n anchor.onclick = (ev) => {\n this.exitFullScreen();\n ev.stopPropagation();\n };\n anchor.onkeydown = (ev) => {\n if (ev.key === \"Enter\" || ev.key === \" \") {\n this.exitFullScreen();\n }\n };\n anchor.innerHTML = this._overlayCloseHtml();\n\n return anchor;\n }\n\n /**\n * Returns the HTML for the close icon.\n * @private\n * @returns {string}\n */\n private _overlayCloseHtml(): string {\n return (\n \"Close \" +\n \"\" +\n \"\"\n );\n }\n\n /**\n * The registry of card instances and their associated DOM elements.\n * @private\n * @static\n * @type {WeakMap}\n */\n private static instanceMap: WeakMap = new WeakMap();\n\n /**\n * Returns the card instance associated with the given element, if any.\n * @public\n * @static\n * @param {HTMLElement} el\n * @returns {(Card | undefined)}\n */\n public static getInstance(el: HTMLElement): Card | undefined {\n return Card.instanceMap.get(el);\n }\n\n /**\n * If cards are initialized before the DOM is ready, we re-schedule the\n * initialization to occur on DOMContentLoaded.\n * @private\n * @static\n * @type {boolean}\n */\n private static onReadyScheduled = false;\n\n /**\n * Initializes all cards that require initialization on the page, or schedules\n * initialization if the DOM is not yet ready.\n * @public\n * @static\n * @param {boolean} [flushResizeObserver=true]\n */\n public static initializeAllCards(flushResizeObserver = true): void {\n if (document.readyState === \"loading\") {\n if (!Card.onReadyScheduled) {\n Card.onReadyScheduled = true;\n document.addEventListener(\"DOMContentLoaded\", () => {\n Card.initializeAllCards(false);\n });\n }\n return;\n }\n\n if (flushResizeObserver) {\n // Trigger a recheck of observed cards to unobserve non-existent cards\n Card.shinyResizeObserver.flush();\n }\n\n const initSelector = `.${Card.attr.CLASS_CARD}[${Card.attr.ATTR_INIT}]`;\n if (!document.querySelector(initSelector)) {\n // no cards to initialize\n return;\n }\n\n const cards = document.querySelectorAll(initSelector);\n cards.forEach((card) => new Card(card as HTMLElement));\n }\n}\n\n// attach Sidebar class to window for global usage\nregisterBslibGlobal(\"Card\", Card);\n\nexport { Card };\n", "import { InputBinding, registerBinding, registerBslibGlobal } from \"./_utils\";\nimport { ShinyResizeObserver } from \"./_shinyResizeObserver\";\n\n/**\n * Methods for programmatically toggling the state of the sidebar. These methods\n * describe the desired state of the sidebar: `\"close\"` and `\"open\"` transition\n * the sidebar to the desired state, unless the sidebar is already in that\n * state. `\"toggle\"` transitions the sidebar to the state opposite of its\n * current state.\n * @typedef {SidebarToggleMethod}\n */\ntype SidebarToggleMethod = \"close\" | \"closed\" | \"open\" | \"toggle\";\n\n/**\n * Data received by the input binding's `receiveMessage` method.\n * @typedef {SidebarMessageData}\n */\ntype SidebarMessageData = {\n method: SidebarToggleMethod;\n};\n\n/**\n * Represents the size of the sidebar window either: \"desktop\" or \"mobile\".\n */\ntype SidebarWindowSize = \"desktop\" | \"mobile\";\n\n/**\n * The DOM elements that make up the sidebar. `main`, `sidebar`, and `toggle`\n * are all direct children of `container` (in that order).\n * @interface SidebarComponents\n * @typedef {SidebarComponents}\n */\ninterface SidebarComponents {\n /**\n * The `layout_sidebar()` parent container, with class\n * `Sidebar.classes.LAYOUT`.\n * @type {HTMLElement}\n */\n container: HTMLElement;\n /**\n * The main content area of the sidebar layout.\n * @type {HTMLElement}\n */\n main: HTMLElement;\n /**\n * The sidebar container of the sidebar layout.\n * @type {HTMLElement}\n */\n sidebar: HTMLElement;\n /**\n * The toggle button that is used to toggle the sidebar state.\n * @type {HTMLElement}\n */\n toggle: HTMLElement;\n}\n\n/**\n * The bslib sidebar component class. This class is only used for collapsible\n * sidebars.\n *\n * @class Sidebar\n * @typedef {Sidebar}\n */\nclass Sidebar {\n /**\n * The DOM elements that make up the sidebar, see `SidebarComponents`.\n * @private\n * @type {SidebarComponents}\n */\n private layout: SidebarComponents;\n\n /**\n * A Shiny-specific resize observer that ensures Shiny outputs in the main\n * content areas of the sidebar resize appropriately.\n * @private\n * @type {ShinyResizeObserver}\n * @static\n */\n private static shinyResizeObserver = new ShinyResizeObserver();\n\n /**\n * Creates an instance of a collapsible bslib Sidebar.\n * @constructor\n * @param {HTMLElement} container\n */\n constructor(container: HTMLElement) {\n Sidebar.instanceMap.set(container, this);\n this.layout = {\n container,\n main: container.querySelector(\":scope > .main\") as HTMLElement,\n sidebar: container.querySelector(\":scope > .sidebar\") as HTMLElement,\n toggle: container.querySelector(\n \":scope > .collapse-toggle\"\n ) as HTMLElement,\n } as SidebarComponents;\n\n const sideAccordion = this.layout.sidebar.querySelector(\n \":scope > .sidebar-content > .accordion\"\n );\n if (sideAccordion) {\n // Add `.has-accordion` class to `.sidebar-content` container\n sideAccordion?.parentElement?.classList.add(\"has-accordion\");\n sideAccordion.classList.add(\"accordion-flush\");\n }\n\n this._initSidebarCounters();\n this._initSidebarState();\n\n if (this._isCollapsible(\"desktop\") || this._isCollapsible(\"mobile\")) {\n this._initEventListeners();\n }\n\n // Start watching the main content area for size changes to ensure Shiny\n // outputs resize appropriately during sidebar transitions.\n Sidebar.shinyResizeObserver.observe(this.layout.main);\n\n container.removeAttribute(\"data-bslib-sidebar-init\");\n const initScript = container.querySelector(\n \":scope > script[data-bslib-sidebar-init]\"\n );\n if (initScript) {\n container.removeChild(initScript);\n }\n }\n\n /**\n * Read the current state of the sidebar. Note that, when calling this method,\n * the sidebar may be transitioning into the state returned by this method.\n *\n * @description\n * The sidebar state works as follows, starting from the open state. When the\n * sidebar is closed:\n * 1. We add both the `COLLAPSE` and `TRANSITIONING` classes to the sidebar.\n * 2. The sidebar collapse begins to animate. In general, where it is\n * supported, we transition the `grid-template-columns` property of the\n * sidebar layout. We also rotate the collapse icon and we use this\n * rotation to determine when the transition is complete.\n * 3. If another sidebar state toggle is requested while closing the sidebar,\n * we remove the `COLLAPSE` class and the animation immediately starts to\n * reverse.\n * 4. When the `transition` is complete, we remove the `TRANSITIONING` class.\n * @readonly\n * @type {boolean}\n */\n get isClosed(): boolean {\n return this.layout.container.classList.contains(Sidebar.classes.COLLAPSE);\n }\n\n /**\n * Static classes related to the sidebar layout or state.\n * @public\n * @static\n * @readonly\n * @type {{ LAYOUT: string; COLLAPSE: string; TRANSITIONING: string; }}\n */\n public static readonly classes = {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n LAYOUT: \"bslib-sidebar-layout\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n COLLAPSE: \"sidebar-collapsed\",\n // eslint-disable-next-line @typescript-eslint/naming-convention\n TRANSITIONING: \"transitioning\",\n };\n\n /**\n * If sidebars are initialized before the DOM is ready, we re-schedule the\n * initialization to occur on DOMContentLoaded.\n * @private\n * @static\n * @type {boolean}\n */\n private static onReadyScheduled = false;\n /**\n * A map of initialized sidebars to their respective Sidebar instances.\n * @private\n * @static\n * @type {WeakMap}\n */\n private static instanceMap: WeakMap = new WeakMap();\n\n /**\n * Given a sidebar container, return the Sidebar instance associated with it.\n * @public\n * @static\n * @param {HTMLElement} el\n * @returns {(Sidebar | undefined)}\n */\n public static getInstance(el: HTMLElement): Sidebar | undefined {\n return Sidebar.instanceMap.get(el);\n }\n\n /**\n * Determine whether the sidebar is collapsible at a given screen size.\n * @private\n * @param {SidebarWindowSize} [size=\"desktop\"]\n * @returns {boolean}\n */\n private _isCollapsible(size: SidebarWindowSize = \"desktop\"): boolean {\n const { container } = this.layout;\n\n const attr =\n size === \"desktop\" ? \"collapsibleDesktop\" : \"collapsibleMobile\";\n\n const isCollapsible = container.dataset[attr];\n\n if (isCollapsible === undefined) {\n return true;\n }\n\n return isCollapsible.trim().toLowerCase() !== \"false\";\n }\n\n /**\n * Initialize all collapsible sidebars on the page.\n * @public\n * @static\n * @param {boolean} [flushResizeObserver=true] When `true`, we remove\n * non-existent elements from the ResizeObserver. This is required\n * periodically to prevent memory leaks. To avoid over-checking, we only flush\n * the ResizeObserver when initializing sidebars after page load.\n */\n public static initCollapsibleAll(flushResizeObserver = true): void {\n if (document.readyState === \"loading\") {\n if (!Sidebar.onReadyScheduled) {\n Sidebar.onReadyScheduled = true;\n document.addEventListener(\"DOMContentLoaded\", () => {\n Sidebar.initCollapsibleAll(false);\n });\n }\n return;\n }\n\n const initSelector = `.${Sidebar.classes.LAYOUT}[data-bslib-sidebar-init]`;\n if (!document.querySelector(initSelector)) {\n // no sidebars to initialize\n return;\n }\n\n if (flushResizeObserver) Sidebar.shinyResizeObserver.flush();\n\n const containers = document.querySelectorAll(initSelector);\n containers.forEach((container) => new Sidebar(container as HTMLElement));\n }\n\n /**\n * Initialize event listeners for the sidebar toggle button.\n * @private\n */\n private _initEventListeners(): void {\n const { toggle } = this.layout;\n\n toggle.addEventListener(\"click\", (ev) => {\n ev.preventDefault();\n this.toggle(\"toggle\");\n });\n\n // Remove the transitioning class when the transition ends. We watch the\n // collapse toggle icon because it's guaranteed to transition, whereas not\n // all browsers support animating grid-template-columns.\n toggle\n .querySelector(\".collapse-icon\")\n ?.addEventListener(\"transitionend\", () => this._finalizeState());\n\n if (this._isCollapsible(\"desktop\") && this._isCollapsible(\"mobile\")) {\n return;\n }\n\n // The sidebar is *sometimes* collapsible, so we need to handle window\n // resize events to ensure visibility and expected behavior.\n window.addEventListener(\"resize\", () => this._handleWindowResizeEvent());\n }\n\n /**\n * Initialize nested sidebar counters.\n *\n * @description\n * This function walks up the DOM tree, adding CSS variables to each direct\n * parent sidebar layout that count the layout's position in the stack of\n * nested layouts. We use these counters to keep the collapse toggles from\n * overlapping. Note that always-open sidebars that don't have collapse\n * toggles break the chain of nesting.\n * @private\n */\n private _initSidebarCounters(): void {\n const { container } = this.layout;\n\n const selectorChildLayouts =\n `.${Sidebar.classes.LAYOUT}` +\n \"> .main > \" +\n `.${Sidebar.classes.LAYOUT}:not([data-bslib-sidebar-open=\"always\"])`;\n\n const isInnermostLayout =\n container.querySelector(selectorChildLayouts) === null;\n\n if (!isInnermostLayout) {\n // There are sidebar layouts nested within this layout; defer to children\n return;\n }\n\n function nextSidebarParent(el: HTMLElement | null): HTMLElement | null {\n el = el ? el.parentElement : null;\n if (el && el.classList.contains(\"main\")) {\n // .bslib-sidebar-layout > .main > .bslib-sidebar-layout\n el = el.parentElement;\n }\n if (el && el.classList.contains(Sidebar.classes.LAYOUT)) {\n return el;\n }\n return null;\n }\n\n const layouts = [container];\n let parent = nextSidebarParent(container);\n\n while (parent) {\n // Add parent to front of layouts array, so we sort outer -> inner\n layouts.unshift(parent);\n parent = nextSidebarParent(parent);\n }\n\n const count = { left: 0, right: 0 };\n layouts.forEach(function (x: HTMLElement): void {\n const isRight = x.classList.contains(\"sidebar-right\");\n const thisCount = isRight ? count.right++ : count.left++;\n x.style.setProperty(\"--_js-toggle-count-this-side\", thisCount.toString());\n x.style.setProperty(\n \"--_js-toggle-count-max-side\",\n Math.max(count.right, count.left).toString()\n );\n });\n }\n\n /**\n * Retrieves the current window size by reading a CSS variable whose value is\n * toggled via media queries.\n * @returns The window size as `\"desktop\"` or `\"mobile\"`, or `\"\"` if not\n * available.\n */\n private _getWindowSize(): SidebarWindowSize | \"\" {\n const { container } = this.layout;\n\n return window\n .getComputedStyle(container)\n .getPropertyValue(\"--bslib-sidebar-js-window-size\")\n .trim() as SidebarWindowSize | \"\";\n }\n\n /**\n * Determine the initial toggle state of the sidebar at a current screen size.\n * It always returns whether we should `\"open\"` or `\"close\"` the sidebar.\n *\n * @private\n * @returns {(\"close\" | \"open\")}\n */\n private _initialToggleState(): \"close\" | \"open\" {\n const { container } = this.layout;\n\n const attr = this.windowSize === \"desktop\" ? \"openDesktop\" : \"openMobile\";\n\n const initState = container.dataset[attr]?.trim()?.toLowerCase();\n\n if (initState === undefined) {\n return \"open\";\n }\n\n if ([\"open\", \"always\"].includes(initState)) {\n return \"open\";\n }\n\n if ([\"close\", \"closed\"].includes(initState)) {\n return \"close\";\n }\n\n return \"open\";\n }\n\n /**\n * Initialize the sidebar's initial state when `open = \"desktop\"`.\n * @private\n */\n private _initSidebarState(): void {\n // Check the CSS variable to find out which mode we're in right now\n this.windowSize = this._getWindowSize();\n\n const initState = this._initialToggleState();\n this.toggle(initState, true);\n }\n\n /**\n * The current window size, either `\"desktop\"` or `\"mobile\"`.\n * @private\n * @type {SidebarWindowSize | \"\"}\n */\n private windowSize: SidebarWindowSize | \"\" = \"\";\n\n /**\n * Updates the sidebar state when the window is resized across the mobile-\n * desktop boundary.\n */\n private _handleWindowResizeEvent(): void {\n const newSize = this._getWindowSize();\n if (!newSize || newSize == this.windowSize) {\n return;\n }\n\n // Re-initializing for the new size also updates the tracked window size\n this._initSidebarState();\n }\n\n /**\n * Toggle the sidebar's open/closed state.\n * @public\n * @param {SidebarToggleMethod | undefined} method Whether to `\"open\"`,\n * `\"close\"` or `\"toggle\"` the sidebar. If `.toggle()` is called without an\n * argument, it will toggle the sidebar's state.\n * @param {boolean} [immediate=false] If `true`, the sidebar state will be\n * set immediately, without a transition. This is primarily used when the\n * sidebar is initialized.\n */\n public toggle(\n method: SidebarToggleMethod | undefined,\n immediate = false\n ): void {\n if (typeof method === \"undefined\") {\n method = \"toggle\";\n } else if (method === \"closed\") {\n method = \"close\";\n }\n\n const { container, sidebar } = this.layout;\n const isClosed = this.isClosed;\n\n if ([\"open\", \"close\", \"toggle\"].indexOf(method) === -1) {\n throw new Error(`Unknown method ${method}`);\n }\n\n if (method === \"toggle\") {\n method = isClosed ? \"open\" : \"close\";\n }\n\n if ((isClosed && method === \"close\") || (!isClosed && method === \"open\")) {\n // nothing to do, sidebar is already in the desired state\n if (immediate) this._finalizeState();\n return;\n }\n\n if (method === \"open\") {\n // unhide sidebar immediately when opening,\n // otherwise the sidebar is hidden on transitionend\n sidebar.hidden = false;\n }\n\n // If not immediate, add the .transitioning class to the sidebar for smooth\n // transitions. This class is removed when the transition ends.\n container.classList.toggle(Sidebar.classes.TRANSITIONING, !immediate);\n container.classList.toggle(Sidebar.classes.COLLAPSE);\n\n if (immediate) {\n // When transitioning, state is finalized on transitionend, otherwise we\n // need to manually and immediately finalize the state.\n this._finalizeState();\n }\n }\n\n /**\n * When the sidebar open/close transition ends, finalize the sidebar's state.\n * @private\n */\n private _finalizeState(): void {\n const { container, sidebar, toggle } = this.layout;\n container.classList.remove(Sidebar.classes.TRANSITIONING);\n sidebar.hidden = this.isClosed;\n toggle.setAttribute(\"aria-expanded\", this.isClosed ? \"false\" : \"true\");\n\n // Send browser-native event with updated sidebar state\n const event = new CustomEvent(\"bslib.sidebar\", {\n bubbles: true,\n detail: { open: !this.isClosed },\n });\n sidebar.dispatchEvent(event);\n\n // Trigger Shiny input and output binding events\n $(sidebar).trigger(\"toggleCollapse.sidebarInputBinding\");\n $(sidebar).trigger(this.isClosed ? \"hidden\" : \"shown\");\n }\n}\n\n/**\n * A Shiny input binding for a sidebar.\n * @class SidebarInputBinding\n * @typedef {SidebarInputBinding}\n * @extends {InputBinding}\n */\nclass SidebarInputBinding extends InputBinding {\n find(scope: HTMLElement) {\n return $(scope).find(`.${Sidebar.classes.LAYOUT} > .bslib-sidebar-input`);\n }\n\n getValue(el: HTMLElement): boolean {\n const sb = Sidebar.getInstance(el.parentElement as HTMLElement);\n if (!sb) return false;\n return !sb.isClosed;\n }\n\n setValue(el: HTMLElement, value: boolean): void {\n const method = value ? \"open\" : \"close\";\n this.receiveMessage(el, { method });\n }\n\n subscribe(el: HTMLElement, callback: (x: boolean) => void) {\n $(el).on(\n \"toggleCollapse.sidebarInputBinding\",\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n function (event) {\n callback(true);\n }\n );\n }\n\n unsubscribe(el: HTMLElement) {\n $(el).off(\".sidebarInputBinding\");\n }\n\n receiveMessage(el: HTMLElement, data: SidebarMessageData) {\n const sb = Sidebar.getInstance(el.parentElement as HTMLElement);\n if (sb) sb.toggle(data.method);\n }\n}\n\nregisterBinding(SidebarInputBinding, \"sidebar\");\n// attach Sidebar class to window for global usage\nregisterBslibGlobal(\"Sidebar\", Sidebar);\n", "import { InputBinding, registerBinding } from \"./_utils\";\nimport type { BslibSwitchInline } from \"./webcomponents/switch\";\n\ntype TaskButtonMessage = {\n state: string;\n};\n\n/**\n * This is a Shiny input binding for `bslib::input_task_button()`. It is not a\n * web component, though one of its children is . The\n * reason it is not a web component is because it is primarily a button, and I\n * wanted to use the native `; + } + // While the popover is shown, watches for changes in the _trigger_ + // visibility. If the trigger element becomes no longer visible, then we hide + // the popover (Bootstrap doesn't do this automatically when showing + // programmatically) + _createVisibilityObserver() { + const handler = (entries) => { + if (!this.visible) + return; + entries.forEach((entry) => { + if (!entry.isIntersecting) + this._hide(); + }); + }; + return new IntersectionObserver(handler); + } + }; + var BslibPopover = _BslibPopover; + BslibPopover.tagName = "bslib-popover"; + BslibPopover.shinyResizeObserver = new ShinyResizeObserver(); + /////////////////////////////////////////////////////////////// + // Shiny-specific stuff + /////////////////////////////////////////////////////////////// + BslibPopover.isShinyInput = true; + __decorateClass([ + n({ type: String }) + ], BslibPopover.prototype, "placement", 2); + __decorateClass([ + n({ type: String }) + ], BslibPopover.prototype, "bsOptions", 2); + function hasHeader(header) { + return !!header && header.childNodes.length > 0; + } + + // srcts/src/components/webcomponents/inputDarkMode.ts + var BslibInputDarkMode = class extends s4 { + constructor() { + super(...arguments); + this.attribute = "data-shinytheme"; + // eslint-disable-next-line @typescript-eslint/no-empty-function, @typescript-eslint/no-unused-vars + this.onChangeCallback = (x2) => { + }; + } + // onValueChange = makeValueChangeEmitter(this, this.id); + connectedCallback() { + super.connectedCallback(); + this.attribute = this.getAttribute("attribute") || this.attribute; + if (typeof this.mode === "undefined") { + this.mode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"; + } + this.reflectPreference(); + window.matchMedia("(prefers-color-scheme: dark)").addEventListener("change", ({ matches: isDark }) => { + this.mode = isDark ? "dark" : "light"; + this.reflectPreference(); + }); + this._observeDocumentThemeAttribute(); + } + disconnectedCallback() { + this.observer.disconnect(); + super.disconnectedCallback(); + } + _observeDocumentThemeAttribute() { + this.observer = new MutationObserver((mutations) => { + mutations.forEach((mutation) => { + if (mutation.target !== document.documentElement) + return; + if (mutation.attributeName !== this.attribute) + return; + const newValue = document.documentElement.getAttribute(this.attribute); + if (!newValue || newValue === this.mode) + return; + this.mode = newValue; + }); + }); + const config = { + attributes: true, + childList: false, + subtree: false + }; + this.observer.observe(document.documentElement, config); + } + getValue() { + return this.mode; + } + render() { + const other = this.mode === "light" ? "dark" : "light"; + const label = `Switch from ${this.mode} to ${other} mode`; + return x` + + `; + } + onClick(e6) { + e6.stopPropagation(); + this.mode = this.mode === "light" ? "dark" : "light"; + } + updated(changedProperties) { + if (changedProperties.has("mode")) { + this.reflectPreference(); + this.onChangeCallback(true); + } + } + reflectPreference() { + document.documentElement.setAttribute(this.attribute, this.mode); + window.dispatchEvent(new Event("resize")); + } + }; + BslibInputDarkMode.isShinyInput = true; + BslibInputDarkMode.tagName = "bslib-input-dark-mode"; + BslibInputDarkMode.shinyCustomMessageHandlers = { + // eslint-disable-next-line @typescript-eslint/naming-convention + "bslib.toggle-dark-mode": ({ + method, + value + }) => { + if (method !== "toggle") + return; + if (typeof value === "undefined" || value === null) { + const current = document.documentElement.dataset.bsTheme || "light"; + value = current === "light" ? "dark" : "light"; + } + document.documentElement.dataset.bsTheme = value; + } + }; + BslibInputDarkMode.styles = [ + // CSS Variables + i2` + :host { + /* open-props.style via shinycomponent */ + --text-1: var(--text-1-light, var(--gray-8, #343a40)); + --text-2: var(--text-2-light, var(--gray-7, #495057)); + --size-xxs: var(--size-1, 0.25rem); + --ease-in-out-1: cubic-bezier(0.1, 0, 0.9, 1); + --ease-in-out-2: cubic-bezier(0.3, 0, 0.7, 1); + --ease-out-1: cubic-bezier(0, 0, 0.75, 1); + --ease-out-3: cubic-bezier(0, 0, 0.3, 1); + --ease-out-4: cubic-bezier(0, 0, 0.1, 1); + + /* shinycomponent */ + --speed-fast: 0.15s; + --speed-normal: 0.3s; + + /* Size of the icon, uses em units so it scales to font-size */ + --size: 1.3em; + + /* Because we are (most likely) bigger than one em we will need to move + the button up or down to keep it looking right inline */ + --vertical-correction: calc((var(--size) - 1em) / 2); + } + `, + i2` + .sun-and-moon > :is(.moon, .sun, .sun-beams) { + transform-origin: center center; + } + + .sun-and-moon > .sun { + fill: none; + stroke: var(--text-1); + stroke-width: var(--stroke-w); + } + + button:is(:hover, :focus-visible) + > :is(.sun-and-moon > :is(.moon, .sun)) { + fill: var(--text-2); + } + + .sun-and-moon > .sun-beams { + stroke: var(--text-1); + stroke-width: var(--stroke-w); + } + + button:is(:hover, :focus-visible) :is(.sun-and-moon > .sun-beams) { + background-color: var(--text-2); + } + + [data-theme="dark"] .sun-and-moon > .sun { + fill: var(--text-1); + stroke: none; + stroke-width: 0; + transform: scale(1.6); + } + + [data-theme="dark"] .sun-and-moon > .sun-beams { + opacity: 0; + } + + [data-theme="dark"] .sun-and-moon > .moon > circle { + transform: translateX(-10px); + } + + @supports (cx: 1) { + [data-theme="dark"] .sun-and-moon > .moon > circle { + transform: translateX(0); + cx: 15; + } + } + `, + // Transitions + i2` + .sun-and-moon > .sun { + transition: transform var(--speed-fast) var(--ease-in-out-2) + var(--speed-fast), + fill var(--speed-fast) var(--ease-in-out-2) var(--speed-fast), + stroke-width var(--speed-normal) var(--ease-in-out-2); + } + + .sun-and-moon > .sun-beams { + transition: transform var(--speed-fast) var(--ease-out-3), + opacity var(--speed-fast) var(--ease-out-4); + transition-delay: var(--speed-normal); + } + + .sun-and-moon .moon > circle { + transition: transform var(--speed-fast) var(--ease-in-out-2), + fill var(--speed-fast) var(--ease-in-out-2); + transition-delay: 0s; + } + + @supports (cx: 1) { + .sun-and-moon .moon > circle { + transition: cx var(--speed-normal) var(--ease-in-out-2); + } + + [data-theme="dark"] .sun-and-moon .moon > circle { + transition: cx var(--speed-fast) var(--ease-in-out-2); + transition-delay: var(--speed-fast); + } + } + + [data-theme="dark"] .sun-and-moon > .sun { + transition-delay: 0s; + transition-duration: var(--speed-normal); + transition-timing-function: var(--ease-in-out-2); + } + + [data-theme="dark"] .sun-and-moon > .sun-beams { + transform: scale(0.3); + transition: transform var(--speed-normal) var(--ease-in-out-2), + opacity var(--speed-fast) var(--ease-out-1); + transition-delay: 0s; + } + `, + i2` + :host { + display: inline-block; + + /* We control the stroke size manually here. We don't want it getting so + small its not visible but also not so big it looks cartoonish */ + --stroke-w: clamp(1px, 0.1em, 6px); + } + + button { + /* This is needed to let the svg use the em sizes */ + font-size: inherit; + + /* Make sure the button is fully centered */ + display: grid; + place-content: center; + + /* A little bit of padding to make it easier to press */ + padding: var(--size-xxs); + background: none; + border: none; + aspect-ratio: 1; + border-radius: 50%; + cursor: pointer; + touch-action: manipulation; + -webkit-tap-highlight-color: transparent; + outline-offset: var(--size-xxs); + + /* Move down to adjust for being larger than 1em */ + transform: translateY(var(--vertical-correction)); + margin-block-end: var(--vertical-correction); + } + + /* + button:is(:hover, :focus-visible) { + background: var(--surface-4); + } + */ + + button > svg { + height: var(--size); + width: var(--size); + stroke-linecap: round; + overflow: visible; + } + + svg line, + svg circle { + vector-effect: non-scaling-stroke; + } + ` + ]; + __decorateClass([ + n({ type: String, reflect: true }) + ], BslibInputDarkMode.prototype, "mode", 2); + + // srcts/src/components/webcomponents/_makeInputBinding.ts + function makeInputBinding(tagName, { type = null } = {}) { + if (!window.Shiny) { + return; + } + class NewCustomBinding extends window.Shiny["InputBinding"] { + constructor() { + super(); + } + find(scope) { + return $(scope).find(tagName); + } + getValue(el) { + if ("getValue" in el) { + return el.getValue(); + } else { + return el.value; + } + } + // eslint-disable-next-line @typescript-eslint/no-unused-vars + getType(el) { + return type; + } + subscribe(el, callback) { + el.onChangeCallback = callback; + } + unsubscribe(el) { + el.onChangeCallback = (x2) => { + }; + } + receiveMessage(el, data) { + el.receiveMessage(el, data); + } + } + window.Shiny.inputBindings.register( + new NewCustomBinding(), + `${tagName}-Binding` + ); + } + + // srcts/src/components/_shinyAddCustomMessageHandlers.ts + function shinyAddCustomMessageHandlers(handlers) { + if (!window.Shiny) { + return; + } + for (const [name, handler] of Object.entries(handlers)) { + window.Shiny.addCustomMessageHandler(name, handler); + } + } + + // srcts/src/components/webcomponents/layoutColumns.ts + var _BslibLayoutColumns = class extends HTMLElement { + constructor() { + super(...arguments); + /** + * The number of column units in a row. + */ + // eslint-disable-next-line @typescript-eslint/naming-convention + this._colUnits = 12; + } + /** + * Create a new default BreakpointMap. If no column widths are specified, we + * auto-fit at the "sm" and "lg" breakpoints. + */ + static defaultColWidths() { + return new Map(Object.entries({ sm: null, lg: null })); + } + get colUnits() { + return this._colUnits; + } + set colUnits(val) { + this.style.setProperty("--bs-columns", `${val}`); + this._colUnits = val; + } + /** + * Fallback item span for breakpoints not provided by the user. For example, + * if the user gives column widths for the "lg" breakpoint, the fallback item + * span covers column widths below "lg", i.e. "sm" and "md". This value only + * needs to be set when auto-fit is used for larger screen sizes and no lower + * breakpoints are set. It also only comes into play when auto-fit adjusts the + * default number of columns. + */ + setFallbackItemSpan(val) { + this.style.setProperty("--_item-column-span", `${val}`); + } + connectedCallback() { + this.classList.add("grid"); + this.colWidths = this._readColWidths(); + setTimeout(() => { + this._applyColWidthsSpec(); + this.removeAttribute("hidden-until-init"); + }); + } + /** + * Reads and parses the column widths from the "col-widths-{break}" attributes. + * @returns A map of breakpoint to column width. + */ + _readColWidths() { + const attrs = readPrefixedAttributes(this, "col-widths-"); + if (!attrs.size) { + return _BslibLayoutColumns.defaultColWidths(); + } + const colWidths = /* @__PURE__ */ new Map(); + const breaks = ["sm", "md", "lg", "xl", "xxl"]; + const asColWidth = (val) => { + return ["null", "true", ""].includes(val) ? null : Array.from(val.split(",").map(Number)); + }; + breaks.forEach((breakName) => { + const attrBreak = `col-widths-${breakName}`; + const valueRaw = attrs.get(attrBreak); + if (typeof valueRaw !== "undefined") { + colWidths.set(breakName, asColWidth(valueRaw)); + attrs.delete(attrBreak); + } + }); + attrs.forEach((valueRaw, attrName) => { + colWidths.set(attrName.replace("col-widths-", ""), asColWidth(valueRaw)); + }); + return colWidths; + } + /** + * Given user-specified column widths, resolve the auto-fit breakpoints and + * then finalize the column width spec. If any auto-fit breakpoints are + * requested, this function needs to know the number of children in the + * layout, so it can determine the best-fit column widths. + * + * @returns The resolved column width specification. + */ + _resolveColWidthsSpec() { + const colValuesNA = Array.from(this.colWidths.values()).map(isNA); + const all = (x2) => x2.every((val) => val === true); + const any = (x2) => x2.some((val) => val === true); + if (!any(colValuesNA)) { + return newBreakpointColumnSpec(this.colWidths); + } + const resolved = /* @__PURE__ */ new Map(); + const allAutoFit = all(colValuesNA); + const units = allAutoFit ? null : 12; + const nChildren = this.children.length; + for (const [breakName, colWidth] of this.colWidths) { + if (colWidth === null) { + const preferWider = ["sm", "md"].includes(breakName); + const bestFit = bestFitColumnWidths(nChildren, preferWider, units); + if (allAutoFit) { + this.colUnits = bestFit.units; + if (bestFit.units !== 12) { + this.setFallbackItemSpan(bestFit.units > nChildren ? nChildren : 1); + } + } + resolved.set(breakName, bestFit.widths); + } else { + resolved.set(breakName, colWidth); + } + } + return newBreakpointColumnSpec(resolved); + } + /** + * Applies the column width specification to the children of the custom element. + */ + _applyColWidthsSpec() { + if (!this.colWidthsSpec) { + this.colWidthsSpec = this._resolveColWidthsSpec(); + } + if (!this.colWidthsSpec) { + throw new Error("Column widths must be specified."); + } + const children = this.children; + writeGridClasses(this.colWidthsSpec, children, this.colUnits); + } + }; + var BslibLayoutColumns = _BslibLayoutColumns; + BslibLayoutColumns.tagName = "bslib-layout-columns"; + BslibLayoutColumns.isShinyInput = false; + function bestFitColumnWidths(nItems, preferWider = false, units = null) { + const fit = { units, widths: [0] }; + if (isNA(fit.units)) { + fit.units = nItems > 7 ? 12 : nItems > 3 ? nItems * 2 : nItems; + if (nItems < 4) { + fit.widths = [1]; + return fit; + } + if (nItems <= 7) { + fit.widths = [preferWider ? nItems : 2]; + return fit; + } + } + if (fit.units === 12) { + if (nItems <= 3) { + fit.widths = [[12, 6, 4][nItems - 1]]; + return fit; + } + if (nItems === 5 || nItems === 7) { + fit.widths = [preferWider ? 4 : 3]; + return fit; + } + if (nItems === 6) { + fit.widths = [preferWider ? 4 : 2]; + return fit; + } + } + const fctrs = preferWider ? [6, 4, 3] : [2, 3, 4]; + const unitsItems = fctrs.map((x2) => x2 * nItems); + const rows = unitsItems.map((val) => Math.ceil(val / 12)); + const unitsTotal = rows.map((val) => val * 12); + const unitsEmpty = unitsTotal.map((val, idx) => val - unitsItems[idx]); + fit.widths = [fctrs[unitsEmpty.indexOf(Math.min(...unitsEmpty))]]; + return fit; + } + function newBreakpointColumnSpec(breaks) { + if (!(breaks instanceof Map)) { + throw new Error("Column widths must be specified as a Map or an object."); + } + const spec = /* @__PURE__ */ new Map(); + for (const [breakName, bk] of breaks) { + if (bk.some((val) => val === 0)) { + throw new Error( + "Column values must be greater than 0 to indicate width, or negative to indicate a column offset." + ); + } + if (bk.length > 1 && bk.some((val) => isNaN(val))) { + throw new Error( + "Cannot mix widths and missing values. All column widths must be specified, or choose auto widths using a single `null` value." + ); + } + if (bk.every((val) => isNA(val)) || bk.every((val) => val > 0)) { + spec.set(breakName, { + width: bk, + before: Array(bk.length).fill(0), + after: Array(bk.length).fill(0) + }); + continue; + } + if (!bk.some((val) => val > 0)) { + throw new Error( + "Column values must include at least one positive integer width." + ); + } + const idxActual = bk.map((val, idx) => val > 0 ? idx : -1).filter((idx) => idx !== -1); + const idxLastActual = Math.max(...idxActual); + const lenActual = idxActual.length; + const actual = idxActual.map((idx) => bk[idx]); + const before = Array(lenActual).fill(0); + const after = Array(lenActual).fill(0); + let i4 = 0; + let idxBefore = 0; + while (i4 < bk.length) { + if (bk[i4] > 0) { + idxBefore++; + } else if (i4 > idxLastActual) { + after[after.length - 1] += Math.abs(bk[i4]); + } else { + before[idxBefore] += Math.abs(bk[i4]); + } + i4++; + } + spec.set(breakName, { + width: actual, + before, + after + }); + } + return spec; + } + function writeGridClasses(breaks, elements, unitsRow = 12) { + const nKids = elements.length; + function addClassToEl(idx, newClass) { + elements[idx].classList.add(newClass); + } + for (const [breakName, bk] of breaks) { + if (bk.width.length > nKids) { + const msg = `Truncating number of widths at '${breakName}' breakpoint to match number of elements.`; + console.warn(msg, { widths: bk.width.length, elements: nKids }); + } + const widths = recycleToLength(bk.width, nKids); + const before = recycleToLength(bk.before, nKids); + const after = recycleToLength(bk.after, nKids); + let cursor = 0; + const updateCursor = (incr, isEmpty = false) => { + cursor = Math.abs(cursor); + let newCursor = cursor + incr; + if (newCursor == unitsRow) { + newCursor = 0; + } + if (newCursor > unitsRow) { + newCursor = isEmpty ? -1 * (newCursor % unitsRow) : incr; + } + cursor = newCursor; + }; + for (let idx = 0; idx < nKids; idx++) { + let addStartClass = false; + const unitsMoveAhead = before[idx] + (idx > 0 ? after[idx - 1] : 0); + const unitsThisItem = Math.min(widths[idx], unitsRow); + let unitsRowRemaining = unitsRow - cursor; + if (unitsMoveAhead > 0) { + updateCursor(unitsMoveAhead, true); + if (cursor < 0) { + cursor = Math.abs(cursor); + if (widths[idx] > unitsRow - cursor) { + cursor = 0; + } + unitsRowRemaining = 0; + } + addStartClass = unitsRowRemaining >= widths[idx] || cursor > 0; + } + if (cursor > 0 && cursor + widths[idx] > unitsRow) { + addStartClass = true; + cursor = 0; + } + if (addStartClass) { + addClassToEl( + idx, + breakName === "xs" ? `g-start-${cursor + 1}` : `g-start-${breakName}-${cursor + 1}` + ); + } + addClassToEl( + idx, + breakName === "xs" ? `g-col-${unitsThisItem}` : `g-col-${breakName}-${unitsThisItem}` + ); + updateCursor(unitsThisItem, false); + } + } + } + function readPrefixedAttributes(el, prefix) { + const out = /* @__PURE__ */ new Map(); + const attrNames = el.getAttributeNames().filter((name) => name.startsWith(prefix)); + for (const attrName of attrNames) { + out.set(attrName, el.getAttribute(attrName)); + } + return out; + } + function recycleToLength(arr, len) { + const newArr = Array(len).fill(0); + for (let i4 = 0; i4 < len; i4++) { + newArr[i4] = arr[i4 % arr.length]; + } + return newArr; + } + function isNA(x2) { + if (x2 === null) + return true; + if (Array.isArray(x2) && x2.length === 1 && x2[0] === null) + return true; + return false; + } + + // srcts/src/components/webcomponents/switch.ts + var BslibSwitch = class extends s4 { + constructor() { + super(...arguments); + this.case = ""; + } + render() { + if (!this.case) { + return x``; + } + return x``; + } + }; + BslibSwitch.tagName = "bslib-switch"; + BslibSwitch.isShinyInput = false; + BslibSwitch.styles = i2` + :host { + display: block; + } + `; + __decorateClass([ + n({ type: String, reflect: true }) + ], BslibSwitch.prototype, "case", 2); + var BslibSwitchInline = class extends BslibSwitch { + }; + BslibSwitchInline.tagName = "bslib-switch-inline"; + BslibSwitchInline.isShinyInput = false; + BslibSwitchInline.styles = i2` + :host { + display: inline; + } + `; + + // srcts/src/components/webcomponents/index.ts + [ + BslibTooltip, + BslibPopover, + BslibInputDarkMode, + BslibLayoutColumns, + BslibSwitch, + BslibSwitchInline + ].forEach((cls) => { + if (!customElements.get(cls.tagName)) { + customElements.define(cls.tagName, cls); + } else { + console.error( + `[bslib] Custom element ${cls.tagName} was already defined, using previous definition.` + ); + } + if (window.Shiny) { + if (cls.isShinyInput) + makeInputBinding(cls.tagName); + if ("shinyCustomMessageHandlers" in cls) { + shinyAddCustomMessageHandlers(cls["shinyCustomMessageHandlers"]); + } + } + }); +})(); +/*! Bundled license information: + +@lit/reactive-element/decorators/custom-element.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/property.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/state.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/base.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/event-options.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/query.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/query-all.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/query-async.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/query-assigned-elements.js: + (** + * @license + * Copyright 2021 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/decorators/query-assigned-nodes.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/css-tag.js: + (** + * @license + * Copyright 2019 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +@lit/reactive-element/reactive-element.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +lit-html/lit-html.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +lit-element/lit-element.js: + (** + * @license + * Copyright 2017 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) + +lit-html/is-server.js: + (** + * @license + * Copyright 2022 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + *) +*/ +//# sourceMappingURL=web-components.js.map diff --git a/articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.js.map b/articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.js.map new file mode 100644 index 00000000..6c32fb38 --- /dev/null +++ b/articles/bs4Dash_files/bslib-component-css-0.8.0/web-components.js.map @@ -0,0 +1,7 @@ +{ + "version": 3, + "sources": ["../../../node_modules/@lit/reactive-element/src/decorators/property.ts", "../../../node_modules/@lit/reactive-element/src/decorators/query-assigned-elements.ts", "../../../node_modules/@lit/reactive-element/src/css-tag.ts", "../../../node_modules/@lit/reactive-element/src/reactive-element.ts", "../../../node_modules/lit-html/src/lit-html.ts", "../../../node_modules/lit-element/src/lit-element.ts", "../../../srcts/src/components/webcomponents/_bslibElement.ts", "../../../srcts/src/components/_utilsTooltip.ts", "../../../srcts/src/components/_shinyResizeObserver.ts", "../../../srcts/src/components/webcomponents/tooltip.ts", "../../../srcts/src/components/webcomponents/popover.ts", "../../../srcts/src/components/webcomponents/inputDarkMode.ts", "../../../srcts/src/components/webcomponents/_makeInputBinding.ts", "../../../srcts/src/components/_shinyAddCustomMessageHandlers.ts", "../../../srcts/src/components/webcomponents/layoutColumns.ts", "../../../srcts/src/components/webcomponents/switch.ts", "../../../srcts/src/components/webcomponents/index.ts"], + "sourcesContent": ["/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/*\n * IMPORTANT: For compatibility with tsickle and the Closure JS compiler, all\n * property decorators (but not class decorators) in this file that have\n * an @ExportDecoratedItems annotation must be defined as a regular function,\n * not an arrow function.\n */\nimport {PropertyDeclaration, ReactiveElement} from '../reactive-element.js';\nimport {ClassElement} from './base.js';\n\nconst standardProperty = (\n options: PropertyDeclaration,\n element: ClassElement\n) => {\n // When decorating an accessor, pass it through and add property metadata.\n // Note, the `hasOwnProperty` check in `createProperty` ensures we don't\n // stomp over the user's accessor.\n if (\n element.kind === 'method' &&\n element.descriptor &&\n !('value' in element.descriptor)\n ) {\n return {\n ...element,\n finisher(clazz: typeof ReactiveElement) {\n clazz.createProperty(element.key, options);\n },\n };\n } else {\n // createProperty() takes care of defining the property, but we still\n // must return some kind of descriptor, so return a descriptor for an\n // unused prototype field. The finisher calls createProperty().\n return {\n kind: 'field',\n key: Symbol(),\n placement: 'own',\n descriptor: {},\n // store the original key so subsequent decorators have access to it.\n originalKey: element.key,\n // When @babel/plugin-proposal-decorators implements initializers,\n // do this instead of the initializer below. See:\n // https://github.com/babel/babel/issues/9260 extras: [\n // {\n // kind: 'initializer',\n // placement: 'own',\n // initializer: descriptor.initializer,\n // }\n // ],\n initializer(this: {[key: string]: unknown}) {\n if (typeof element.initializer === 'function') {\n this[element.key as string] = element.initializer.call(this);\n }\n },\n finisher(clazz: typeof ReactiveElement) {\n clazz.createProperty(element.key, options);\n },\n };\n }\n};\n\nconst legacyProperty = (\n options: PropertyDeclaration,\n proto: Object,\n name: PropertyKey\n) => {\n (proto.constructor as typeof ReactiveElement).createProperty(name, options);\n};\n\n/**\n * A property decorator which creates a reactive property that reflects a\n * corresponding attribute value. When a decorated property is set\n * the element will update and render. A {@linkcode PropertyDeclaration} may\n * optionally be supplied to configure property features.\n *\n * This decorator should only be used for public fields. As public fields,\n * properties should be considered as primarily settable by element users,\n * either via attribute or the property itself.\n *\n * Generally, properties that are changed by the element should be private or\n * protected fields and should use the {@linkcode state} decorator.\n *\n * However, sometimes element code does need to set a public property. This\n * should typically only be done in response to user interaction, and an event\n * should be fired informing the user; for example, a checkbox sets its\n * `checked` property when clicked and fires a `changed` event. Mutating public\n * properties should typically not be done for non-primitive (object or array)\n * properties. In other cases when an element needs to manage state, a private\n * property decorated via the {@linkcode state} decorator should be used. When\n * needed, state properties can be initialized via public properties to\n * facilitate complex interactions.\n *\n * ```ts\n * class MyElement {\n * @property({ type: Boolean })\n * clicked = false;\n * }\n * ```\n * @category Decorator\n * @ExportDecoratedItems\n */\nexport function property(options?: PropertyDeclaration) {\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n return (protoOrDescriptor: Object | ClassElement, name?: PropertyKey): any =>\n name !== undefined\n ? legacyProperty(options!, protoOrDescriptor as Object, name)\n : standardProperty(options!, protoOrDescriptor as ClassElement);\n}\n", "/**\n * @license\n * Copyright 2021 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/*\n * IMPORTANT: For compatibility with tsickle and the Closure JS compiler, all\n * property decorators (but not class decorators) in this file that have\n * an @ExportDecoratedItems annotation must be defined as a regular function,\n * not an arrow function.\n */\n\nimport {decorateProperty} from './base.js';\n\nimport type {ReactiveElement} from '../reactive-element.js';\nimport type {QueryAssignedNodesOptions} from './query-assigned-nodes.js';\n\nconst NODE_MODE = false;\nconst global = NODE_MODE ? globalThis : window;\n\n/**\n * A tiny module scoped polyfill for HTMLSlotElement.assignedElements.\n */\nconst slotAssignedElements =\n global.HTMLSlotElement?.prototype.assignedElements != null\n ? (slot: HTMLSlotElement, opts?: AssignedNodesOptions) =>\n slot.assignedElements(opts)\n : (slot: HTMLSlotElement, opts?: AssignedNodesOptions) =>\n slot\n .assignedNodes(opts)\n .filter(\n (node): node is Element => node.nodeType === Node.ELEMENT_NODE\n );\n\n/**\n * Options for the {@linkcode queryAssignedElements} decorator. Extends the\n * options that can be passed into\n * [HTMLSlotElement.assignedElements](https://developer.mozilla.org/en-US/docs/Web/API/HTMLSlotElement/assignedElements).\n */\nexport interface QueryAssignedElementsOptions\n extends QueryAssignedNodesOptions {\n /**\n * CSS selector used to filter the elements returned. For example, a selector\n * of `\".item\"` will only include elements with the `item` class.\n */\n selector?: string;\n}\n\n/**\n * A property decorator that converts a class property into a getter that\n * returns the `assignedElements` of the given `slot`. Provides a declarative\n * way to use\n * [`HTMLSlotElement.assignedElements`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLSlotElement/assignedElements).\n *\n * Can be passed an optional {@linkcode QueryAssignedElementsOptions} object.\n *\n * Example usage:\n * ```ts\n * class MyElement {\n * @queryAssignedElements({ slot: 'list' })\n * listItems!: Array;\n * @queryAssignedElements()\n * unnamedSlotEls!: Array;\n *\n * render() {\n * return html`\n * \n * \n * `;\n * }\n * }\n * ```\n *\n * Note, the type of this property should be annotated as `Array`.\n *\n * @category Decorator\n */\nexport function queryAssignedElements(options?: QueryAssignedElementsOptions) {\n const {slot, selector} = options ?? {};\n return decorateProperty({\n descriptor: (_name: PropertyKey) => ({\n get(this: ReactiveElement) {\n const slotSelector = `slot${slot ? `[name=${slot}]` : ':not([name])'}`;\n const slotEl =\n this.renderRoot?.querySelector(slotSelector);\n const elements =\n slotEl != null ? slotAssignedElements(slotEl, options) : [];\n if (selector) {\n return elements.filter((node) => node.matches(selector));\n }\n return elements;\n },\n enumerable: true,\n configurable: true,\n }),\n });\n}\n", "/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\nconst NODE_MODE = false;\nconst global = NODE_MODE ? globalThis : window;\n\n/**\n * Whether the current browser supports `adoptedStyleSheets`.\n */\nexport const supportsAdoptingStyleSheets: boolean =\n global.ShadowRoot &&\n (global.ShadyCSS === undefined || global.ShadyCSS.nativeShadow) &&\n 'adoptedStyleSheets' in Document.prototype &&\n 'replace' in CSSStyleSheet.prototype;\n\n/**\n * A CSSResult or native CSSStyleSheet.\n *\n * In browsers that support constructible CSS style sheets, CSSStyleSheet\n * object can be used for styling along side CSSResult from the `css`\n * template tag.\n */\nexport type CSSResultOrNative = CSSResult | CSSStyleSheet;\n\nexport type CSSResultArray = Array;\n\n/**\n * A single CSSResult, CSSStyleSheet, or an array or nested arrays of those.\n */\nexport type CSSResultGroup = CSSResultOrNative | CSSResultArray;\n\nconst constructionToken = Symbol();\n\nconst cssTagCache = new WeakMap();\n\n/**\n * A container for a string of CSS text, that may be used to create a CSSStyleSheet.\n *\n * CSSResult is the return value of `css`-tagged template literals and\n * `unsafeCSS()`. In order to ensure that CSSResults are only created via the\n * `css` tag and `unsafeCSS()`, CSSResult cannot be constructed directly.\n */\nexport class CSSResult {\n // This property needs to remain unminified.\n ['_$cssResult$'] = true;\n readonly cssText: string;\n private _styleSheet?: CSSStyleSheet;\n private _strings: TemplateStringsArray | undefined;\n\n private constructor(\n cssText: string,\n strings: TemplateStringsArray | undefined,\n safeToken: symbol\n ) {\n if (safeToken !== constructionToken) {\n throw new Error(\n 'CSSResult is not constructable. Use `unsafeCSS` or `css` instead.'\n );\n }\n this.cssText = cssText;\n this._strings = strings;\n }\n\n // This is a getter so that it's lazy. In practice, this means stylesheets\n // are not created until the first element instance is made.\n get styleSheet(): CSSStyleSheet | undefined {\n // If `supportsAdoptingStyleSheets` is true then we assume CSSStyleSheet is\n // constructable.\n let styleSheet = this._styleSheet;\n const strings = this._strings;\n if (supportsAdoptingStyleSheets && styleSheet === undefined) {\n const cacheable = strings !== undefined && strings.length === 1;\n if (cacheable) {\n styleSheet = cssTagCache.get(strings);\n }\n if (styleSheet === undefined) {\n (this._styleSheet = styleSheet = new CSSStyleSheet()).replaceSync(\n this.cssText\n );\n if (cacheable) {\n cssTagCache.set(strings, styleSheet);\n }\n }\n }\n return styleSheet;\n }\n\n toString(): string {\n return this.cssText;\n }\n}\n\ntype ConstructableCSSResult = CSSResult & {\n new (\n cssText: string,\n strings: TemplateStringsArray | undefined,\n safeToken: symbol\n ): CSSResult;\n};\n\nconst textFromCSSResult = (value: CSSResultGroup | number) => {\n // This property needs to remain unminified.\n if ((value as CSSResult)['_$cssResult$'] === true) {\n return (value as CSSResult).cssText;\n } else if (typeof value === 'number') {\n return value;\n } else {\n throw new Error(\n `Value passed to 'css' function must be a 'css' function result: ` +\n `${value}. Use 'unsafeCSS' to pass non-literal values, but take care ` +\n `to ensure page security.`\n );\n }\n};\n\n/**\n * Wrap a value for interpolation in a {@linkcode css} tagged template literal.\n *\n * This is unsafe because untrusted CSS text can be used to phone home\n * or exfiltrate data to an attacker controlled site. Take care to only use\n * this with trusted input.\n */\nexport const unsafeCSS = (value: unknown) =>\n new (CSSResult as ConstructableCSSResult)(\n typeof value === 'string' ? value : String(value),\n undefined,\n constructionToken\n );\n\n/**\n * A template literal tag which can be used with LitElement's\n * {@linkcode LitElement.styles} property to set element styles.\n *\n * For security reasons, only literal string values and number may be used in\n * embedded expressions. To incorporate non-literal values {@linkcode unsafeCSS}\n * may be used inside an expression.\n */\nexport const css = (\n strings: TemplateStringsArray,\n ...values: (CSSResultGroup | number)[]\n): CSSResult => {\n const cssText =\n strings.length === 1\n ? strings[0]\n : values.reduce(\n (acc, v, idx) => acc + textFromCSSResult(v) + strings[idx + 1],\n strings[0]\n );\n return new (CSSResult as ConstructableCSSResult)(\n cssText,\n strings,\n constructionToken\n );\n};\n\n/**\n * Applies the given styles to a `shadowRoot`. When Shadow DOM is\n * available but `adoptedStyleSheets` is not, styles are appended to the\n * `shadowRoot` to [mimic spec behavior](https://wicg.github.io/construct-stylesheets/#using-constructed-stylesheets).\n * Note, when shimming is used, any styles that are subsequently placed into\n * the shadowRoot should be placed *before* any shimmed adopted styles. This\n * will match spec behavior that gives adopted sheets precedence over styles in\n * shadowRoot.\n */\nexport const adoptStyles = (\n renderRoot: ShadowRoot,\n styles: Array\n) => {\n if (supportsAdoptingStyleSheets) {\n (renderRoot as ShadowRoot).adoptedStyleSheets = styles.map((s) =>\n s instanceof CSSStyleSheet ? s : s.styleSheet!\n );\n } else {\n styles.forEach((s) => {\n const style = document.createElement('style');\n // eslint-disable-next-line @typescript-eslint/no-explicit-any\n const nonce = (global as any)['litNonce'];\n if (nonce !== undefined) {\n style.setAttribute('nonce', nonce);\n }\n style.textContent = (s as CSSResult).cssText;\n renderRoot.appendChild(style);\n });\n }\n};\n\nconst cssResultFromStyleSheet = (sheet: CSSStyleSheet) => {\n let cssText = '';\n for (const rule of sheet.cssRules) {\n cssText += rule.cssText;\n }\n return unsafeCSS(cssText);\n};\n\nexport const getCompatibleStyle =\n supportsAdoptingStyleSheets ||\n (NODE_MODE && global.CSSStyleSheet === undefined)\n ? (s: CSSResultOrNative) => s\n : (s: CSSResultOrNative) =>\n s instanceof CSSStyleSheet ? cssResultFromStyleSheet(s) : s;\n", "/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\n\n/**\n * Use this module if you want to create your own base class extending\n * {@link ReactiveElement}.\n * @packageDocumentation\n */\n\nimport {\n getCompatibleStyle,\n adoptStyles,\n CSSResultGroup,\n CSSResultOrNative,\n} from './css-tag.js';\nimport type {\n ReactiveController,\n ReactiveControllerHost,\n} from './reactive-controller.js';\n\n// In the Node build, this import will be injected by Rollup:\n// import {HTMLElement, customElements} from '@lit-labs/ssr-dom-shim';\n\nexport * from './css-tag.js';\nexport type {\n ReactiveController,\n ReactiveControllerHost,\n} from './reactive-controller.js';\n\nconst NODE_MODE = false;\nconst global = NODE_MODE ? globalThis : window;\n\nif (NODE_MODE) {\n global.customElements ??= customElements;\n}\n\nconst DEV_MODE = true;\n\nlet requestUpdateThenable: (name: string) => {\n then: (\n onfulfilled?: (value: boolean) => void,\n _onrejected?: () => void\n ) => void;\n};\n\nlet issueWarning: (code: string, warning: string) => void;\n\nconst trustedTypes = (global as unknown as {trustedTypes?: {emptyScript: ''}})\n .trustedTypes;\n\n// Temporary workaround for https://crbug.com/993268\n// Currently, any attribute starting with \"on\" is considered to be a\n// TrustedScript source. Such boolean attributes must be set to the equivalent\n// trusted emptyScript value.\nconst emptyStringForBooleanAttribute = trustedTypes\n ? (trustedTypes.emptyScript as unknown as '')\n : '';\n\nconst polyfillSupport = DEV_MODE\n ? global.reactiveElementPolyfillSupportDevMode\n : global.reactiveElementPolyfillSupport;\n\nif (DEV_MODE) {\n // Ensure warnings are issued only 1x, even if multiple versions of Lit\n // are loaded.\n const issuedWarnings: Set = (global.litIssuedWarnings ??=\n new Set());\n\n // Issue a warning, if we haven't already.\n issueWarning = (code: string, warning: string) => {\n warning += ` See https://lit.dev/msg/${code} for more information.`;\n if (!issuedWarnings.has(warning)) {\n console.warn(warning);\n issuedWarnings.add(warning);\n }\n };\n\n issueWarning(\n 'dev-mode',\n `Lit is in dev mode. Not recommended for production!`\n );\n\n // Issue polyfill support warning.\n if (global.ShadyDOM?.inUse && polyfillSupport === undefined) {\n issueWarning(\n 'polyfill-support-missing',\n `Shadow DOM is being polyfilled via \\`ShadyDOM\\` but ` +\n `the \\`polyfill-support\\` module has not been loaded.`\n );\n }\n\n requestUpdateThenable = (name) => ({\n then: (\n onfulfilled?: (value: boolean) => void,\n _onrejected?: () => void\n ) => {\n issueWarning(\n 'request-update-promise',\n `The \\`requestUpdate\\` method should no longer return a Promise but ` +\n `does so on \\`${name}\\`. Use \\`updateComplete\\` instead.`\n );\n if (onfulfilled !== undefined) {\n onfulfilled(false);\n }\n },\n });\n}\n\n/**\n * Contains types that are part of the unstable debug API.\n *\n * Everything in this API is not stable and may change or be removed in the future,\n * even on patch releases.\n */\n// eslint-disable-next-line @typescript-eslint/no-namespace\nexport namespace ReactiveUnstable {\n /**\n * When Lit is running in dev mode and `window.emitLitDebugLogEvents` is true,\n * we will emit 'lit-debug' events to window, with live details about the update and render\n * lifecycle. These can be useful for writing debug tooling and visualizations.\n *\n * Please be aware that running with window.emitLitDebugLogEvents has performance overhead,\n * making certain operations that are normally very cheap (like a no-op render) much slower,\n * because we must copy data and dispatch events.\n */\n // eslint-disable-next-line @typescript-eslint/no-namespace\n export namespace DebugLog {\n export type Entry = Update;\n export interface Update {\n kind: 'update';\n }\n }\n}\n\ninterface DebugLoggingWindow {\n // Even in dev mode, we generally don't want to emit these events, as that's\n // another level of cost, so only emit them when DEV_MODE is true _and_ when\n // window.emitLitDebugEvents is true.\n emitLitDebugLogEvents?: boolean;\n}\n\n/**\n * Useful for visualizing and logging insights into what the Lit template system is doing.\n *\n * Compiled out of prod mode builds.\n */\nconst debugLogEvent = DEV_MODE\n ? (event: ReactiveUnstable.DebugLog.Entry) => {\n const shouldEmit = (global as unknown as DebugLoggingWindow)\n .emitLitDebugLogEvents;\n if (!shouldEmit) {\n return;\n }\n global.dispatchEvent(\n new CustomEvent('lit-debug', {\n detail: event,\n })\n );\n }\n : undefined;\n\n/*\n * When using Closure Compiler, JSCompiler_renameProperty(property, object) is\n * replaced at compile time by the munged name for object[property]. We cannot\n * alias this function, so we have to use a small shim that has the same\n * behavior when not compiling.\n */\n/*@__INLINE__*/\nconst JSCompiler_renameProperty =

    (\n prop: P,\n _obj: unknown\n): P => prop;\n\n/**\n * Converts property values to and from attribute values.\n */\nexport interface ComplexAttributeConverter {\n /**\n * Called to convert an attribute value to a property\n * value.\n */\n fromAttribute?(value: string | null, type?: TypeHint): Type;\n\n /**\n * Called to convert a property value to an attribute\n * value.\n *\n * It returns unknown instead of string, to be compatible with\n * https://github.com/WICG/trusted-types (and similar efforts).\n */\n toAttribute?(value: Type, type?: TypeHint): unknown;\n}\n\ntype AttributeConverter =\n | ComplexAttributeConverter\n | ((value: string | null, type?: TypeHint) => Type);\n\n/**\n * Defines options for a property accessor.\n */\nexport interface PropertyDeclaration {\n /**\n * When set to `true`, indicates the property is internal private state. The\n * property should not be set by users. When using TypeScript, this property\n * should be marked as `private` or `protected`, and it is also a common\n * practice to use a leading `_` in the name. The property is not added to\n * `observedAttributes`.\n */\n readonly state?: boolean;\n\n /**\n * Indicates how and whether the property becomes an observed attribute.\n * If the value is `false`, the property is not added to `observedAttributes`.\n * If true or absent, the lowercased property name is observed (e.g. `fooBar`\n * becomes `foobar`). If a string, the string value is observed (e.g\n * `attribute: 'foo-bar'`).\n */\n readonly attribute?: boolean | string;\n\n /**\n * Indicates the type of the property. This is used only as a hint for the\n * `converter` to determine how to convert the attribute\n * to/from a property.\n */\n readonly type?: TypeHint;\n\n /**\n * Indicates how to convert the attribute to/from a property. If this value\n * is a function, it is used to convert the attribute value a the property\n * value. If it's an object, it can have keys for `fromAttribute` and\n * `toAttribute`. If no `toAttribute` function is provided and\n * `reflect` is set to `true`, the property value is set directly to the\n * attribute. A default `converter` is used if none is provided; it supports\n * `Boolean`, `String`, `Number`, `Object`, and `Array`. Note,\n * when a property changes and the converter is used to update the attribute,\n * the property is never updated again as a result of the attribute changing,\n * and vice versa.\n */\n readonly converter?: AttributeConverter;\n\n /**\n * Indicates if the property should reflect to an attribute.\n * If `true`, when the property is set, the attribute is set using the\n * attribute name determined according to the rules for the `attribute`\n * property option and the value of the property converted using the rules\n * from the `converter` property option.\n */\n readonly reflect?: boolean;\n\n /**\n * A function that indicates if a property should be considered changed when\n * it is set. The function should take the `newValue` and `oldValue` and\n * return `true` if an update should be requested.\n */\n hasChanged?(value: Type, oldValue: Type): boolean;\n\n /**\n * Indicates whether an accessor will be created for this property. By\n * default, an accessor will be generated for this property that requests an\n * update when set. If this flag is `true`, no accessor will be created, and\n * it will be the user's responsibility to call\n * `this.requestUpdate(propertyName, oldValue)` to request an update when\n * the property changes.\n */\n readonly noAccessor?: boolean;\n}\n\n/**\n * Map of properties to PropertyDeclaration options. For each property an\n * accessor is made, and the property is processed according to the\n * PropertyDeclaration options.\n */\nexport interface PropertyDeclarations {\n readonly [key: string]: PropertyDeclaration;\n}\n\ntype PropertyDeclarationMap = Map;\n\ntype AttributeMap = Map;\n\n/**\n * A Map of property keys to values.\n *\n * Takes an optional type parameter T, which when specified as a non-any,\n * non-unknown type, will make the Map more strongly-typed, associating the map\n * keys with their corresponding value type on T.\n *\n * Use `PropertyValues` when overriding ReactiveElement.update() and\n * other lifecycle methods in order to get stronger type-checking on keys\n * and values.\n */\n// This type is conditional so that if the parameter T is not specified, or\n// is `any`, the type will include `Map`. Since T is not\n// given in the uses of PropertyValues in this file, all uses here fallback to\n// meaning `Map`, but if a developer uses\n// `PropertyValues` (or any other value for T) they will get a\n// strongly-typed Map type.\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nexport type PropertyValues = T extends object\n ? PropertyValueMap\n : Map;\n\n/**\n * Do not use, instead prefer {@linkcode PropertyValues}.\n */\n// This type must be exported such that JavaScript generated by the Google\n// Closure Compiler can import a type reference.\nexport interface PropertyValueMap extends Map {\n get(k: K): T[K];\n set(key: K, value: T[K]): this;\n has(k: K): boolean;\n delete(k: K): boolean;\n}\n\nexport const defaultConverter: ComplexAttributeConverter = {\n toAttribute(value: unknown, type?: unknown): unknown {\n switch (type) {\n case Boolean:\n value = value ? emptyStringForBooleanAttribute : null;\n break;\n case Object:\n case Array:\n // if the value is `null` or `undefined` pass this through\n // to allow removing/no change behavior.\n value = value == null ? value : JSON.stringify(value);\n break;\n }\n return value;\n },\n\n fromAttribute(value: string | null, type?: unknown) {\n let fromValue: unknown = value;\n switch (type) {\n case Boolean:\n fromValue = value !== null;\n break;\n case Number:\n fromValue = value === null ? null : Number(value);\n break;\n case Object:\n case Array:\n // Do *not* generate exception when invalid JSON is set as elements\n // don't normally complain on being mis-configured.\n // TODO(sorvell): Do generate exception in *dev mode*.\n try {\n // Assert to adhere to Bazel's \"must type assert JSON parse\" rule.\n fromValue = JSON.parse(value!) as unknown;\n } catch (e) {\n fromValue = null;\n }\n break;\n }\n return fromValue;\n },\n};\n\nexport interface HasChanged {\n (value: unknown, old: unknown): boolean;\n}\n\n/**\n * Change function that returns true if `value` is different from `oldValue`.\n * This method is used as the default for a property's `hasChanged` function.\n */\nexport const notEqual: HasChanged = (value: unknown, old: unknown): boolean => {\n // This ensures (old==NaN, value==NaN) always returns false\n return old !== value && (old === old || value === value);\n};\n\nconst defaultPropertyDeclaration: PropertyDeclaration = {\n attribute: true,\n type: String,\n converter: defaultConverter,\n reflect: false,\n hasChanged: notEqual,\n};\n\n/**\n * The Closure JS Compiler doesn't currently have good support for static\n * property semantics where \"this\" is dynamic (e.g.\n * https://github.com/google/closure-compiler/issues/3177 and others) so we use\n * this hack to bypass any rewriting by the compiler.\n */\nconst finalized = 'finalized';\n\n/**\n * A string representing one of the supported dev mode warning categories.\n */\nexport type WarningKind = 'change-in-update' | 'migration';\n\nexport type Initializer = (element: ReactiveElement) => void;\n\n/**\n * Base element class which manages element properties and attributes. When\n * properties change, the `update` method is asynchronously called. This method\n * should be supplied by subclassers to render updates as desired.\n * @noInheritDoc\n */\nexport abstract class ReactiveElement\n // In the Node build, this `extends` clause will be substituted with\n // `(globalThis.HTMLElement ?? HTMLElement)`.\n //\n // This way, we will first prefer any global `HTMLElement` polyfill that the\n // user has assigned, and then fall back to the `HTMLElement` shim which has\n // been imported (see note at the top of this file about how this import is\n // generated by Rollup). Note that the `HTMLElement` variable has been\n // shadowed by this import, so it no longer refers to the global.\n extends HTMLElement\n implements ReactiveControllerHost\n{\n // Note: these are patched in only in DEV_MODE.\n /**\n * Read or set all the enabled warning categories for this class.\n *\n * This property is only used in development builds.\n *\n * @nocollapse\n * @category dev-mode\n */\n static enabledWarnings?: WarningKind[];\n\n /**\n * Enable the given warning category for this class.\n *\n * This method only exists in development builds, so it should be accessed\n * with a guard like:\n *\n * ```ts\n * // Enable for all ReactiveElement subclasses\n * ReactiveElement.enableWarning?.('migration');\n *\n * // Enable for only MyElement and subclasses\n * MyElement.enableWarning?.('migration');\n * ```\n *\n * @nocollapse\n * @category dev-mode\n */\n static enableWarning?: (warningKind: WarningKind) => void;\n\n /**\n * Disable the given warning category for this class.\n *\n * This method only exists in development builds, so it should be accessed\n * with a guard like:\n *\n * ```ts\n * // Disable for all ReactiveElement subclasses\n * ReactiveElement.disableWarning?.('migration');\n *\n * // Disable for only MyElement and subclasses\n * MyElement.disableWarning?.('migration');\n * ```\n *\n * @nocollapse\n * @category dev-mode\n */\n static disableWarning?: (warningKind: WarningKind) => void;\n\n /**\n * Adds an initializer function to the class that is called during instance\n * construction.\n *\n * This is useful for code that runs against a `ReactiveElement`\n * subclass, such as a decorator, that needs to do work for each\n * instance, such as setting up a `ReactiveController`.\n *\n * ```ts\n * const myDecorator = (target: typeof ReactiveElement, key: string) => {\n * target.addInitializer((instance: ReactiveElement) => {\n * // This is run during construction of the element\n * new MyController(instance);\n * });\n * }\n * ```\n *\n * Decorating a field will then cause each instance to run an initializer\n * that adds a controller:\n *\n * ```ts\n * class MyElement extends LitElement {\n * @myDecorator foo;\n * }\n * ```\n *\n * Initializers are stored per-constructor. Adding an initializer to a\n * subclass does not add it to a superclass. Since initializers are run in\n * constructors, initializers will run in order of the class hierarchy,\n * starting with superclasses and progressing to the instance's class.\n *\n * @nocollapse\n */\n static addInitializer(initializer: Initializer) {\n this.finalize();\n (this._initializers ??= []).push(initializer);\n }\n\n static _initializers?: Initializer[];\n\n /*\n * Due to closure compiler ES6 compilation bugs, @nocollapse is required on\n * all static methods and properties with initializers. Reference:\n * - https://github.com/google/closure-compiler/issues/1776\n */\n\n /**\n * Maps attribute names to properties; for example `foobar` attribute to\n * `fooBar` property. Created lazily on user subclasses when finalizing the\n * class.\n * @nocollapse\n */\n private static __attributeToPropertyMap: AttributeMap;\n\n /**\n * Marks class as having finished creating properties.\n */\n protected static [finalized] = true;\n\n /**\n * Memoized list of all element properties, including any superclass properties.\n * Created lazily on user subclasses when finalizing the class.\n * @nocollapse\n * @category properties\n */\n static elementProperties: PropertyDeclarationMap = new Map();\n\n /**\n * User-supplied object that maps property names to `PropertyDeclaration`\n * objects containing options for configuring reactive properties. When\n * a reactive property is set the element will update and render.\n *\n * By default properties are public fields, and as such, they should be\n * considered as primarily settable by element users, either via attribute or\n * the property itself.\n *\n * Generally, properties that are changed by the element should be private or\n * protected fields and should use the `state: true` option. Properties\n * marked as `state` do not reflect from the corresponding attribute\n *\n * However, sometimes element code does need to set a public property. This\n * should typically only be done in response to user interaction, and an event\n * should be fired informing the user; for example, a checkbox sets its\n * `checked` property when clicked and fires a `changed` event. Mutating\n * public properties should typically not be done for non-primitive (object or\n * array) properties. In other cases when an element needs to manage state, a\n * private property set with the `state: true` option should be used. When\n * needed, state properties can be initialized via public properties to\n * facilitate complex interactions.\n * @nocollapse\n * @category properties\n */\n static properties: PropertyDeclarations;\n\n /**\n * Memoized list of all element styles.\n * Created lazily on user subclasses when finalizing the class.\n * @nocollapse\n * @category styles\n */\n static elementStyles: Array = [];\n\n /**\n * Array of styles to apply to the element. The styles should be defined\n * using the {@linkcode css} tag function, via constructible stylesheets, or\n * imported from native CSS module scripts.\n *\n * Note on Content Security Policy:\n *\n * Element styles are implemented with `