Avoid re-registering bslib components and globals (#1045)

NEWS.md

@@ -1,9 +1,11 @@
 # bslib (development version)
 
-* Adjusted the border color of checkbox and radio buttons to match the border color of the input group in `bs_theme(preset="shiny")` . (#1038)
+* Adjusted the border color of checkbox and radio buttons to match the border color of the input group in `bs_theme(preset="shiny")`. (#1038)
 
 * `toggle_sidebar()` once again correctly closes a sidebar. (@fredericva, #1043)
 
+* bslib now avoids re-defining its components when used in a context where they are already available, e.g. in a Quarto dashboard. (#1045)
+
 # bslib 0.7.0
 
 This large release includes many improvements and bug fixes for newer UI components like `layout_columns()`, `card()`, and `sidebar()`. In addition, the new `input_task_button()` offers a drop-in replacement for `shiny::actionButton()` (to prevent multiple submissions of the same operation) as well as pairing nicely with the new `shiny::ExtendedTask` for implementing truly non-blocking operations in Shiny.

srcts/src/components/_utils.ts

@@ -22,6 +22,17 @@ function registerBinding(
   }
 }
 
+function registerBslibGlobal(name: string, value: object): void {
+  (window as any).bslib = (window as any).bslib || {};
+  if (!(window as any).bslib[name]) {
+    (window as any).bslib[name] = value;
+  } else {
+    console.error(
+      `[bslib] Global window.bslib.${name} was already defined, using previous definition.`
+    );
+  }
+}
+
 // Return true if the key exists on the object and the value is not undefined.
 //
 // This method is mainly used in input bindings' `receiveMessage` method.
@@ -91,6 +102,7 @@ async function shinyRenderContent(
 export {
   InputBinding,
   registerBinding,
+  registerBslibGlobal,
   hasDefinedProperty,
   doWindowResizeOnElementResize,
   getAllFocusableChildren,

srcts/src/components/card.ts

@@ -1,4 +1,4 @@
-import { getAllFocusableChildren, Shiny } from "./_utils";
+import { getAllFocusableChildren, registerBslibGlobal, Shiny } from "./_utils";
 import { ShinyResizeObserver } from "./_shinyResizeObserver";
 import { ShinyRemovedObserver } from "./_shinyRemovedObserver";
 
@@ -449,7 +449,6 @@ class Card {
 }
 
 // attach Sidebar class to window for global usage
-(window as any).bslib = (window as any).bslib || {};
-(window as any).bslib.Card = Card;
+registerBslibGlobal("Card", Card);
 
 export { Card };

srcts/src/components/sidebar.ts

@@ -1,4 +1,4 @@
-import { InputBinding, registerBinding } from "./_utils";
+import { InputBinding, registerBinding, registerBslibGlobal } from "./_utils";
 import { ShinyResizeObserver } from "./_shinyResizeObserver";
 
 /**
@@ -528,7 +528,5 @@ class SidebarInputBinding extends InputBinding {
 }
 
 registerBinding(SidebarInputBinding, "sidebar");
-
 // attach Sidebar class to window for global usage
-(window as any).bslib = (window as any).bslib || {};
-(window as any).bslib.Sidebar = Sidebar;
+registerBslibGlobal("Sidebar", Sidebar);

srcts/src/components/webcomponents/index.ts

@@ -14,7 +14,13 @@ import { BslibSwitch, BslibSwitchInline } from "./switch";
   BslibSwitch,
   BslibSwitchInline,
 ].forEach((cls) => {
-  customElements.define(cls.tagName, 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) {