Forward DataViewer attributes from DatasetSelector

Add automatic forwarding of attributes from DatasetSelector to the inner DataViewer component. This allows setting DataViewer attributes directly on the DatasetSelector without manually implementing each one.

- Import DataViewer to access its observedAttributes
- Add forwardInitialAttributes method to pass attributes when viewer is created
- Skip 'src' attribute to prevent unwanted fetch operations

Author: lcvriend

src/components/dataset-selector.js

@@ -1,3 +1,6 @@
+import { DataViewer } from "../viewer.js"
+
+
 export class DatasetSelector extends HTMLElement {
     static get defaults() {
         return {
@@ -22,7 +25,9 @@ export class DatasetSelector extends HTMLElement {
 
     // MARK: setup
     static get observedAttributes() {
-        return ["src"]
+        // Combine our attributes with DataViewer's
+        const ownAttributes = ["src"]
+        return [...ownAttributes, ...DataViewer.observedAttributes]
     }
 
     connectedCallback() {
@@ -34,6 +39,13 @@ export class DatasetSelector extends HTMLElement {
     attributeChangedCallback(name, oldValue, newValue) {
         if (name === "src" && oldValue !== newValue) {
             this.loadSpecFromSrc(newValue)
+        } else if (this.dataViewer && DataViewer.observedAttributes.includes(name)) {
+            // Forward DataViewer attributes
+            if (newValue !== null) {
+                this.dataViewer.setAttribute(name, newValue)
+            } else {
+                this.dataViewer.removeAttribute(name)
+            }
         }
     }
 
@@ -43,6 +55,17 @@ export class DatasetSelector extends HTMLElement {
         }
     }
 
+    forwardInitialAttributes() {
+        if (!this.dataViewer) return
+
+        DataViewer.observedAttributes.forEach(attr => {
+            if (attr === 'src') return
+            if (this.hasAttribute(attr)) {
+                this.dataViewer.setAttribute(attr, this.getAttribute(attr))
+            }
+        })
+    }
+
     // Load spec and initialize
     async loadSpecFromSrc(src) {
         try {
@@ -436,6 +459,7 @@ export class DatasetSelector extends HTMLElement {
         const viewer = document.createElement("data-viewer")
         this.shadowRoot.querySelector(".viewer-container").appendChild(viewer)
         this.dataViewer = viewer
+        this.forwardInitialAttributes()
     }
 }