@eric-emg/symphiq-components 1.2.42 → 1.2.44
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -21632,10 +21632,11 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21632
21632
|
// Manage overall assessment loading state during view mode transitions
|
|
21633
21633
|
}
|
|
21634
21634
|
ngAfterViewInit() {
|
|
21635
|
-
console.log('[
|
|
21635
|
+
console.log('[DASHBOARD v4] ngAfterViewInit called', {
|
|
21636
21636
|
embedded: this.embedded(),
|
|
21637
21637
|
scrollContainerId: this.scrollContainerId(),
|
|
21638
|
-
isScrolled: this.isScrolled()
|
|
21638
|
+
isScrolled: this.isScrolled(),
|
|
21639
|
+
viewMode: this.viewMode()
|
|
21639
21640
|
});
|
|
21640
21641
|
// Ensure modal has data after view is initialized
|
|
21641
21642
|
if (this.modalComponent) {
|
|
@@ -21648,7 +21649,7 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21648
21649
|
if (this.scrollContainerId()) {
|
|
21649
21650
|
const setupScrollContainer = () => {
|
|
21650
21651
|
const element = document.getElementById(this.scrollContainerId());
|
|
21651
|
-
console.log('[SCROLL DEBUG] setupScrollContainer attempt', {
|
|
21652
|
+
console.log('[SCROLL DEBUG v2] setupScrollContainer attempt', {
|
|
21652
21653
|
scrollContainerId: this.scrollContainerId(),
|
|
21653
21654
|
elementFound: !!element,
|
|
21654
21655
|
elementTag: element?.tagName
|
|
@@ -21662,7 +21663,7 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21662
21663
|
// Get the scrollable element from Ionic
|
|
21663
21664
|
if (typeof ionContent.getScrollElement === 'function') {
|
|
21664
21665
|
ionContent.getScrollElement().then((scrollElement) => {
|
|
21665
|
-
console.log('[SCROLL DEBUG] Ionic scroll element found', {
|
|
21666
|
+
console.log('[SCROLL DEBUG v2] Ionic scroll element found', {
|
|
21666
21667
|
scrollTop: scrollElement.scrollTop,
|
|
21667
21668
|
scrollHeight: scrollElement.scrollHeight,
|
|
21668
21669
|
clientHeight: scrollElement.clientHeight
|
|
@@ -21675,51 +21676,79 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21675
21676
|
const currentScrollTop = scrollElement.scrollTop;
|
|
21676
21677
|
const scrollHeight = scrollElement.scrollHeight;
|
|
21677
21678
|
const clientHeight = scrollElement.clientHeight;
|
|
21678
|
-
console.log('[SCROLL DEBUG] Checking initial scroll position', {
|
|
21679
|
+
console.log('[SCROLL DEBUG v2] Checking initial scroll position', {
|
|
21679
21680
|
scrollTop: currentScrollTop,
|
|
21680
21681
|
scrollHeight,
|
|
21681
21682
|
clientHeight,
|
|
21682
21683
|
shouldCollapse: currentScrollTop > 50
|
|
21683
21684
|
});
|
|
21684
21685
|
if (currentScrollTop > 50) {
|
|
21685
|
-
console.log('[SCROLL DEBUG] Collapsing header due to scroll position', { currentScrollTop });
|
|
21686
|
+
console.log('[SCROLL DEBUG v2] Collapsing header due to scroll position', { currentScrollTop });
|
|
21686
21687
|
this.isScrolled.set(true);
|
|
21687
21688
|
}
|
|
21688
21689
|
else {
|
|
21689
|
-
console.log('[SCROLL DEBUG] Expanding header due to scroll position', { currentScrollTop });
|
|
21690
|
+
console.log('[SCROLL DEBUG v2] Expanding header due to scroll position', { currentScrollTop });
|
|
21690
21691
|
this.isScrolled.set(false);
|
|
21691
21692
|
}
|
|
21692
21693
|
};
|
|
21693
21694
|
// Use ResizeObserver to detect when content has finished rendering
|
|
21695
|
+
// Only check scroll position once content has substantial height
|
|
21696
|
+
const MIN_CONTENT_HEIGHT = 500; // Content should be at least this tall before we check scroll
|
|
21694
21697
|
let lastHeight = scrollElement.scrollHeight;
|
|
21695
21698
|
let stableCount = 0;
|
|
21699
|
+
let scrollCheckTimeout = null;
|
|
21696
21700
|
const resizeObserver = new ResizeObserver(() => {
|
|
21697
21701
|
const currentHeight = scrollElement.scrollHeight;
|
|
21698
|
-
console.log('[SCROLL DEBUG] Content height changed', {
|
|
21702
|
+
console.log('[SCROLL DEBUG v4] Content height changed', {
|
|
21699
21703
|
lastHeight,
|
|
21700
21704
|
currentHeight,
|
|
21701
|
-
stableCount
|
|
21705
|
+
stableCount,
|
|
21706
|
+
minHeightReached: currentHeight >= MIN_CONTENT_HEIGHT
|
|
21702
21707
|
});
|
|
21703
|
-
|
|
21704
|
-
|
|
21705
|
-
|
|
21706
|
-
|
|
21707
|
-
|
|
21708
|
-
|
|
21709
|
-
|
|
21708
|
+
// Clear any pending scroll check
|
|
21709
|
+
if (scrollCheckTimeout) {
|
|
21710
|
+
clearTimeout(scrollCheckTimeout);
|
|
21711
|
+
}
|
|
21712
|
+
// Only start checking when we have substantial content
|
|
21713
|
+
if (currentHeight >= MIN_CONTENT_HEIGHT) {
|
|
21714
|
+
if (currentHeight === lastHeight) {
|
|
21715
|
+
stableCount++;
|
|
21716
|
+
// Height has been stable for 2 consecutive observations
|
|
21717
|
+
if (stableCount >= 2) {
|
|
21718
|
+
console.log('[SCROLL DEBUG v4] Content height stabilized, scheduling scroll check');
|
|
21719
|
+
// Wait a bit for Ionic to restore scroll position
|
|
21720
|
+
scrollCheckTimeout = setTimeout(() => {
|
|
21721
|
+
console.log('[SCROLL DEBUG v4] Performing delayed scroll check after stabilization');
|
|
21722
|
+
checkInitialScroll();
|
|
21723
|
+
}, 50);
|
|
21724
|
+
resizeObserver.disconnect();
|
|
21725
|
+
}
|
|
21726
|
+
}
|
|
21727
|
+
else {
|
|
21728
|
+
stableCount = 0;
|
|
21729
|
+
lastHeight = currentHeight;
|
|
21730
|
+
// Schedule a check after height change
|
|
21731
|
+
scrollCheckTimeout = setTimeout(() => {
|
|
21732
|
+
console.log('[SCROLL DEBUG v4] Checking scroll after height change');
|
|
21733
|
+
checkInitialScroll();
|
|
21734
|
+
}, 50);
|
|
21710
21735
|
}
|
|
21711
21736
|
}
|
|
21712
21737
|
else {
|
|
21738
|
+
// Reset tracking if height drops below threshold (component being destroyed)
|
|
21713
21739
|
stableCount = 0;
|
|
21714
21740
|
lastHeight = currentHeight;
|
|
21715
|
-
// Check on each significant height change
|
|
21716
|
-
checkInitialScroll();
|
|
21717
21741
|
}
|
|
21718
21742
|
});
|
|
21719
21743
|
// Observe the scroll element for size changes
|
|
21720
21744
|
resizeObserver.observe(scrollElement);
|
|
21721
|
-
//
|
|
21722
|
-
|
|
21745
|
+
// Check immediately if we already have content, but allow time for scroll restoration
|
|
21746
|
+
if (scrollElement.scrollHeight >= MIN_CONTENT_HEIGHT) {
|
|
21747
|
+
scrollCheckTimeout = setTimeout(() => {
|
|
21748
|
+
console.log('[SCROLL DEBUG v4] Initial scroll check after delay');
|
|
21749
|
+
checkInitialScroll();
|
|
21750
|
+
}, 100);
|
|
21751
|
+
}
|
|
21723
21752
|
// Attach scroll listeners
|
|
21724
21753
|
scrollElement.addEventListener('scroll', () => this.onContainerScroll(scrollElement), { passive: true });
|
|
21725
21754
|
ionContent.addEventListener('ionScroll', () => this.onContainerScroll(scrollElement), { passive: true });
|
|
@@ -21741,7 +21770,7 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21741
21770
|
}
|
|
21742
21771
|
else {
|
|
21743
21772
|
// Fallback for older Ionic versions
|
|
21744
|
-
console.log('[SCROLL DEBUG] Using fallback for older Ionic', {
|
|
21773
|
+
console.log('[SCROLL DEBUG v2] Using fallback for older Ionic', {
|
|
21745
21774
|
scrollTop: element.scrollTop
|
|
21746
21775
|
});
|
|
21747
21776
|
this.embeddedScrollContainer = element;
|
|
@@ -21749,52 +21778,62 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21749
21778
|
// Helper function to check and update scroll state
|
|
21750
21779
|
const checkInitialScroll = () => {
|
|
21751
21780
|
const currentScrollTop = element.scrollTop;
|
|
21752
|
-
console.log('[SCROLL DEBUG] Checking initial scroll position (fallback)', {
|
|
21781
|
+
console.log('[SCROLL DEBUG v2] Checking initial scroll position (fallback)', {
|
|
21753
21782
|
scrollTop: currentScrollTop,
|
|
21754
21783
|
shouldCollapse: currentScrollTop > 50
|
|
21755
21784
|
});
|
|
21756
21785
|
if (currentScrollTop > 50) {
|
|
21757
|
-
console.log('[SCROLL DEBUG] Collapsing header due to scroll position', { currentScrollTop });
|
|
21786
|
+
console.log('[SCROLL DEBUG v2] Collapsing header due to scroll position', { currentScrollTop });
|
|
21758
21787
|
this.isScrolled.set(true);
|
|
21759
21788
|
}
|
|
21760
21789
|
else {
|
|
21761
|
-
console.log('[SCROLL DEBUG] Expanding header due to scroll position', { currentScrollTop });
|
|
21790
|
+
console.log('[SCROLL DEBUG v2] Expanding header due to scroll position', { currentScrollTop });
|
|
21762
21791
|
this.isScrolled.set(false);
|
|
21763
21792
|
}
|
|
21764
21793
|
};
|
|
21765
21794
|
// Use ResizeObserver to detect when content has finished rendering
|
|
21795
|
+
const MIN_CONTENT_HEIGHT = 500;
|
|
21766
21796
|
let lastHeight = element.scrollHeight;
|
|
21767
21797
|
let stableCount = 0;
|
|
21768
21798
|
const resizeObserver = new ResizeObserver(() => {
|
|
21769
21799
|
const currentHeight = element.scrollHeight;
|
|
21770
|
-
console.log('[SCROLL DEBUG] Content height changed (fallback)', {
|
|
21800
|
+
console.log('[SCROLL DEBUG v2] Content height changed (fallback)', {
|
|
21771
21801
|
lastHeight,
|
|
21772
21802
|
currentHeight,
|
|
21773
|
-
stableCount
|
|
21803
|
+
stableCount,
|
|
21804
|
+
minHeightReached: currentHeight >= MIN_CONTENT_HEIGHT
|
|
21774
21805
|
});
|
|
21775
|
-
if (currentHeight
|
|
21776
|
-
|
|
21777
|
-
|
|
21778
|
-
|
|
21806
|
+
if (currentHeight >= MIN_CONTENT_HEIGHT) {
|
|
21807
|
+
if (currentHeight === lastHeight) {
|
|
21808
|
+
stableCount++;
|
|
21809
|
+
if (stableCount >= 2) {
|
|
21810
|
+
console.log('[SCROLL DEBUG v2] Content height stabilized (fallback), checking scroll position');
|
|
21811
|
+
checkInitialScroll();
|
|
21812
|
+
resizeObserver.disconnect();
|
|
21813
|
+
}
|
|
21814
|
+
}
|
|
21815
|
+
else {
|
|
21816
|
+
stableCount = 0;
|
|
21817
|
+
lastHeight = currentHeight;
|
|
21779
21818
|
checkInitialScroll();
|
|
21780
|
-
resizeObserver.disconnect();
|
|
21781
21819
|
}
|
|
21782
21820
|
}
|
|
21783
21821
|
else {
|
|
21784
21822
|
stableCount = 0;
|
|
21785
21823
|
lastHeight = currentHeight;
|
|
21786
|
-
checkInitialScroll();
|
|
21787
21824
|
}
|
|
21788
21825
|
});
|
|
21789
21826
|
resizeObserver.observe(element);
|
|
21790
|
-
|
|
21827
|
+
if (element.scrollHeight >= MIN_CONTENT_HEIGHT) {
|
|
21828
|
+
checkInitialScroll();
|
|
21829
|
+
}
|
|
21791
21830
|
element.addEventListener('scroll', () => this.onContainerScroll(element), { passive: true });
|
|
21792
21831
|
return true;
|
|
21793
21832
|
}
|
|
21794
21833
|
}
|
|
21795
21834
|
else {
|
|
21796
21835
|
// Regular HTML element
|
|
21797
|
-
console.log('[SCROLL DEBUG] Regular HTML element setup', {
|
|
21836
|
+
console.log('[SCROLL DEBUG v2] Regular HTML element setup', {
|
|
21798
21837
|
scrollTop: element.scrollTop
|
|
21799
21838
|
});
|
|
21800
21839
|
this.embeddedScrollContainer = element;
|
|
@@ -21802,45 +21841,55 @@ class SymphiqFunnelAnalysisDashboardComponent {
|
|
|
21802
21841
|
// Helper function to check and update scroll state
|
|
21803
21842
|
const checkInitialScroll = () => {
|
|
21804
21843
|
const currentScrollTop = element.scrollTop;
|
|
21805
|
-
console.log('[SCROLL DEBUG] Checking initial scroll position (regular)', {
|
|
21844
|
+
console.log('[SCROLL DEBUG v2] Checking initial scroll position (regular)', {
|
|
21806
21845
|
scrollTop: currentScrollTop,
|
|
21807
21846
|
shouldCollapse: currentScrollTop > 50
|
|
21808
21847
|
});
|
|
21809
21848
|
if (currentScrollTop > 50) {
|
|
21810
|
-
console.log('[SCROLL DEBUG] Collapsing header due to scroll position', { currentScrollTop });
|
|
21849
|
+
console.log('[SCROLL DEBUG v2] Collapsing header due to scroll position', { currentScrollTop });
|
|
21811
21850
|
this.isScrolled.set(true);
|
|
21812
21851
|
}
|
|
21813
21852
|
else {
|
|
21814
|
-
console.log('[SCROLL DEBUG] Expanding header due to scroll position', { currentScrollTop });
|
|
21853
|
+
console.log('[SCROLL DEBUG v2] Expanding header due to scroll position', { currentScrollTop });
|
|
21815
21854
|
this.isScrolled.set(false);
|
|
21816
21855
|
}
|
|
21817
21856
|
};
|
|
21818
21857
|
// Use ResizeObserver to detect when content has finished rendering
|
|
21858
|
+
const MIN_CONTENT_HEIGHT = 500;
|
|
21819
21859
|
let lastHeight = element.scrollHeight;
|
|
21820
21860
|
let stableCount = 0;
|
|
21821
21861
|
const resizeObserver = new ResizeObserver(() => {
|
|
21822
21862
|
const currentHeight = element.scrollHeight;
|
|
21823
|
-
console.log('[SCROLL DEBUG] Content height changed (regular)', {
|
|
21863
|
+
console.log('[SCROLL DEBUG v2] Content height changed (regular)', {
|
|
21824
21864
|
lastHeight,
|
|
21825
21865
|
currentHeight,
|
|
21826
|
-
stableCount
|
|
21866
|
+
stableCount,
|
|
21867
|
+
minHeightReached: currentHeight >= MIN_CONTENT_HEIGHT
|
|
21827
21868
|
});
|
|
21828
|
-
if (currentHeight
|
|
21829
|
-
|
|
21830
|
-
|
|
21831
|
-
|
|
21869
|
+
if (currentHeight >= MIN_CONTENT_HEIGHT) {
|
|
21870
|
+
if (currentHeight === lastHeight) {
|
|
21871
|
+
stableCount++;
|
|
21872
|
+
if (stableCount >= 2) {
|
|
21873
|
+
console.log('[SCROLL DEBUG v2] Content height stabilized (regular), checking scroll position');
|
|
21874
|
+
checkInitialScroll();
|
|
21875
|
+
resizeObserver.disconnect();
|
|
21876
|
+
}
|
|
21877
|
+
}
|
|
21878
|
+
else {
|
|
21879
|
+
stableCount = 0;
|
|
21880
|
+
lastHeight = currentHeight;
|
|
21832
21881
|
checkInitialScroll();
|
|
21833
|
-
resizeObserver.disconnect();
|
|
21834
21882
|
}
|
|
21835
21883
|
}
|
|
21836
21884
|
else {
|
|
21837
21885
|
stableCount = 0;
|
|
21838
21886
|
lastHeight = currentHeight;
|
|
21839
|
-
checkInitialScroll();
|
|
21840
21887
|
}
|
|
21841
21888
|
});
|
|
21842
21889
|
resizeObserver.observe(element);
|
|
21843
|
-
|
|
21890
|
+
if (element.scrollHeight >= MIN_CONTENT_HEIGHT) {
|
|
21891
|
+
checkInitialScroll();
|
|
21892
|
+
}
|
|
21844
21893
|
element.addEventListener('scroll', () => this.onContainerScroll(element), { passive: true });
|
|
21845
21894
|
return true;
|
|
21846
21895
|
}
|