@eric-emg/symphiq-components 1.2.108 → 1.2.110

package/fesm2022/symphiq-components.mjs

@@ -24147,62 +24147,76 @@ class FloatingTocComponent {
         return this.expandedSections().has(sectionId);
     }
     scrollToSection(sectionId) {
+        console.log('[FloatingTOC] scrollToSection called', {
+            sectionId,
+            embedded: this.embedded,
+            hasScrollElement: !!this.scrollElement,
+            scrollElementTag: this.scrollElement?.tagName,
+            hasContainerElement: !!this.containerElement,
+            containerElementTag: this.containerElement?.tagName,
+            parentHeaderOffset: this.parentHeaderOffset
+        });
         const element = document.getElementById(`section-${sectionId}`);
+        console.log('[FloatingTOC] Target element', {
+            elementId: `section-${sectionId}`,
+            found: !!element,
+            elementRect: element?.getBoundingClientRect(),
+            elementOffsetTop: element?.offsetTop,
+            elementOffsetParent: element?.offsetParent?.tagName
+        });
         if (element) {
-            if (this.embedded && this.scrollElement) {
-                const scrollTop = this.scrollElement.scrollTop;
-                const containerRect = this.scrollElement.getBoundingClientRect();
-                const elementRect = element.getBoundingClientRect();
-                const offsetPosition = scrollTop + (elementRect.top - containerRect.top) - this.HEADER_OFFSET - this.parentHeaderOffset;
-                this.scrollElement.scrollTo({
-                    top: offsetPosition,
-                    behavior: 'smooth'
-                });
-            }
-            else {
-                const elementPosition = element.getBoundingClientRect().top + window.scrollY;
-                const offsetPosition = elementPosition - this.HEADER_OFFSET;
-                window.scrollTo({
-                    top: offsetPosition,
-                    behavior: 'smooth'
-                });
-            }
+            console.log('[FloatingTOC] Calling scrollIntoView on element');
+            element.scrollIntoView({ behavior: 'smooth', block: 'start' });
+        }
+        else {
+            console.warn('[FloatingTOC] Element not found for section:', sectionId);
         }
         if (!this.isPinned()) {
             this.isHovered.set(false);
         }
     }
     scrollToSubsection(subsectionId) {
+        console.log('[FloatingTOC] scrollToSubsection called', {
+            subsectionId,
+            embedded: this.embedded,
+            hasScrollElement: !!this.scrollElement,
+            scrollElementTag: this.scrollElement?.tagName,
+            hasContainerElement: !!this.containerElement,
+            containerElementTag: this.containerElement?.tagName,
+            parentHeaderOffset: this.parentHeaderOffset
+        });
         const element = document.getElementById(`subsection-${subsectionId}`);
+        console.log('[FloatingTOC] Target element', {
+            elementId: `subsection-${subsectionId}`,
+            found: !!element,
+            elementRect: element?.getBoundingClientRect(),
+            elementOffsetTop: element?.offsetTop,
+            elementOffsetParent: element?.offsetParent?.tagName
+        });
         if (element) {
-            if (this.embedded && this.scrollElement) {
-                const scrollTop = this.scrollElement.scrollTop;
-                const containerRect = this.scrollElement.getBoundingClientRect();
-                const elementRect = element.getBoundingClientRect();
-                const offsetPosition = scrollTop + (elementRect.top - containerRect.top) - this.HEADER_OFFSET - this.parentHeaderOffset;
-                this.scrollElement.scrollTo({
-                    top: offsetPosition,
-                    behavior: 'smooth'
-                });
-            }
-            else {
-                const elementPosition = element.getBoundingClientRect().top + window.scrollY;
-                const offsetPosition = elementPosition - this.HEADER_OFFSET;
-                window.scrollTo({
-                    top: offsetPosition,
-                    behavior: 'smooth'
-                });
-            }
+            console.log('[FloatingTOC] Calling scrollIntoView on element');
+            element.scrollIntoView({ behavior: 'smooth', block: 'start' });
+        }
+        else {
+            console.warn('[FloatingTOC] Element not found for subsection:', subsectionId);
         }
         if (!this.isPinned()) {
             this.isHovered.set(false);
         }
     }
     scrollToTop() {
+        console.log('[FloatingTOC] scrollToTop called', {
+            embedded: this.embedded,
+            hasScrollElement: !!this.scrollElement,
+            scrollElementTag: this.scrollElement?.tagName,
+            scrollElementScrollTop: this.scrollElement?.scrollTop
+        });
         if (this.embedded && this.scrollElement) {
+            console.log('[FloatingTOC] Scrolling scrollElement to top');
             this.scrollElement.scrollTo({ top: 0, behavior: 'smooth' });
         }
         else {
+            console.log('[FloatingTOC] Scrolling window to top');
             window.scrollTo({ top: 0, behavior: 'smooth' });
         }
         if (!this.isPinned()) {