Fix connector license notice disappearing and support server-rendered metadata

src/css/doc.css

@@ -89,7 +89,8 @@ html {
 .component-indicator-sticky {
   display: flex;
   align-items: center;
-  gap: 12px;
+  flex-wrap: wrap;
+  gap: 8px 12px;
   position: sticky;
   top: var(--body-top, 100px);
   z-index: 50;
@@ -301,6 +302,12 @@ html[data-theme="dark"] .component-indicator-sticky .context-dropdown-item:focus
     justify-content: flex-start;
   }
 
+  /* Metadata is left-aligned on mobile, so anchor dropdown menus left to keep them on screen */
+  .component-indicator-sticky .context-dropdown-menu {
+    right: auto;
+    left: 0;
+  }
+
   html[data-theme="dark"] .component-indicator-sticky .metadata-inline {
     border-top-color: rgba(255, 255, 255, 0.06);
   }
@@ -512,6 +519,66 @@ html[data-theme="dark"] .status-badge--cloud {
   border-color: rgba(14, 165, 233, 0.3);
 }
 
+/* Availability badges: links to the other platform's version of this page */
+a.status-badge--cloud-link,
+a.status-badge--self-managed-link {
+  text-decoration: none;
+}
+
+.status-badge--cloud-link {
+  background: #e0f2fe;
+  color: #0369a1;
+  border: 1px solid #7dd3fc;
+}
+
+.status-badge--cloud-link:hover {
+  background: #bae6fd;
+  color: #075985;
+}
+
+.status-badge--self-managed-link {
+  background: #dcfce7;
+  color: #15803d;
+  border: 1px solid #86efac;
+}
+
+.status-badge--self-managed-link:hover {
+  background: #bbf7d0;
+  color: #166534;
+}
+
+.status-badge--self-managed-only {
+  background: var(--grey-100-new, #f3f4f6);
+  color: #4b5563;
+  border: 1px solid var(--grey-200-new, #e5e5e5);
+}
+
+html[data-theme="dark"] .status-badge--cloud-link {
+  background: rgba(14, 165, 233, 0.15);
+  color: #7dd3fc;
+  border-color: rgba(14, 165, 233, 0.3);
+}
+
+html[data-theme="dark"] .status-badge--cloud-link:hover {
+  background: rgba(14, 165, 233, 0.25);
+}
+
+html[data-theme="dark"] .status-badge--self-managed-link {
+  background: rgba(34, 197, 94, 0.15);
+  color: #86efac;
+  border-color: rgba(34, 197, 94, 0.3);
+}
+
+html[data-theme="dark"] .status-badge--self-managed-link:hover {
+  background: rgba(34, 197, 94, 0.25);
+}
+
+html[data-theme="dark"] .status-badge--self-managed-only {
+  background: rgba(148, 163, 184, 0.12);
+  color: #cbd5e1;
+  border-color: rgba(148, 163, 184, 0.25);
+}
+
 @media screen and (min-width: 600px) {
   .doc .openblock.side-by-side > .content {
     display: flex;

src/helpers/resolve-resource.js

@@ -57,6 +57,12 @@ module.exports = (resource, { data, hash: context }) => {
     return resource
   }
 
+  // Root-relative URLs pass through (e.g. pub.url values set by extensions such as
+  // the component_type_dropdown macro's page-context-switcher attribute)
+  if (resource.startsWith('/')) {
+    return resource
+  }
+
   // Handle special keyword "current" - not a valid resource ID
   // This is sometimes incorrectly used to mean "current page" or "current version"
   if (resource === 'current') {

src/js/24-move-connector-metadata.js

@@ -18,6 +18,10 @@
     const metadataInline = document.createElement('div')
     metadataInline.className = 'metadata-inline'
 
+    // Elements whose content now lives in the sticky bar, to hide in place.
+    // Anything else in the metadata block (e.g. license requirements) must stay visible.
+    const movedElements = []
+
     // Move the Type dropdown if it exists
     const typeDropdownWrapper = metadataContent.querySelector('.dropdown-wrapper')
     if (typeDropdownWrapper) {
@@ -116,6 +120,7 @@
         contextDropdown.appendChild(compactMenu)
         contextSwitcher.appendChild(contextDropdown)
         metadataInline.appendChild(contextSwitcher)
+        movedElements.push(typeDropdownWrapper)
       }
     }
 
@@ -264,6 +269,7 @@
         availabilityDropdown.appendChild(dropdownButton)
         availabilityDropdown.appendChild(dropdownMenu)
         metadataInline.appendChild(availabilityDropdown)
+        movedElements.push(availabilityPara)
       }
     }
 
@@ -277,8 +283,19 @@
         stickyBar.appendChild(metadataInline)
       }
 
-      // Hide the original metadata block
-      metadataBlock.style.display = 'none'
+      // Hide only the elements now represented in the sticky bar
+      movedElements.forEach((el) => {
+        el.style.display = 'none'
+      })
+
+      // Hide the whole block only if nothing meaningful remains
+      // (license requirements and other notices must stay visible)
+      const hasRemainingContent = Array.from(metadataContent.children).some(
+        (el) => el.style.display !== 'none' && el.textContent.trim() !== ''
+      )
+      if (!hasRemainingContent) {
+        metadataBlock.style.display = 'none'
+      }
     }
   }