@eric-emg/symphiq-components 1.2.366 → 1.2.367
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.
|
@@ -88681,6 +88681,8 @@ class ShopProfileQuestionAnswerComponent {
|
|
|
88681
88681
|
this.saveButtonsDisabled = computed(() => {
|
|
88682
88682
|
return this.selectedAnswerTexts().length === 0 || this.addOtherAnswersExpanded();
|
|
88683
88683
|
}, ...(ngDevMode ? [{ debugName: "saveButtonsDisabled" }] : []));
|
|
88684
|
+
this.lastScrollTop = 0;
|
|
88685
|
+
this.scrollLogCount = 0;
|
|
88684
88686
|
// Initialize selected answers from existing profile answers
|
|
88685
88687
|
effect(() => {
|
|
88686
88688
|
const questionId = this.question().id;
|
|
@@ -88689,11 +88691,31 @@ class ShopProfileQuestionAnswerComponent {
|
|
|
88689
88691
|
.map(a => a.answer || '');
|
|
88690
88692
|
this.selectedAnswerTexts.set(existingAnswers);
|
|
88691
88693
|
});
|
|
88694
|
+
// Log when isSticky changes
|
|
88695
|
+
effect(() => {
|
|
88696
|
+
const sticky = this.isSticky();
|
|
88697
|
+
console.log(`[ScrollDebug] isSticky changed to: ${sticky}`);
|
|
88698
|
+
});
|
|
88692
88699
|
}
|
|
88693
88700
|
onScroll() {
|
|
88694
88701
|
const container = this.scrollContainer?.nativeElement;
|
|
88695
88702
|
if (container) {
|
|
88696
|
-
|
|
88703
|
+
const scrollTop = container.scrollTop;
|
|
88704
|
+
const scrollHeight = container.scrollHeight;
|
|
88705
|
+
const clientHeight = container.clientHeight;
|
|
88706
|
+
const wasSticky = this.isSticky();
|
|
88707
|
+
const willBeSticky = scrollTop > 10;
|
|
88708
|
+
// Detect scroll jumps (scroll position changed by more than 50px unexpectedly)
|
|
88709
|
+
const scrollDelta = scrollTop - this.lastScrollTop;
|
|
88710
|
+
const isJump = Math.abs(scrollDelta) > 50;
|
|
88711
|
+
this.scrollLogCount++;
|
|
88712
|
+
console.log(`[ScrollDebug #${this.scrollLogCount}] scrollTop: ${scrollTop.toFixed(1)}, delta: ${scrollDelta.toFixed(1)}, isJump: ${isJump}, wasSticky: ${wasSticky}, willBeSticky: ${willBeSticky}, scrollHeight: ${scrollHeight}, clientHeight: ${clientHeight}`);
|
|
88713
|
+
if (isJump) {
|
|
88714
|
+
console.warn(`[ScrollDebug] JUMP DETECTED! From ${this.lastScrollTop.toFixed(1)} to ${scrollTop.toFixed(1)} (delta: ${scrollDelta.toFixed(1)})`);
|
|
88715
|
+
console.trace('[ScrollDebug] Stack trace for jump:');
|
|
88716
|
+
}
|
|
88717
|
+
this.lastScrollTop = scrollTop;
|
|
88718
|
+
this.isSticky.set(willBeSticky);
|
|
88697
88719
|
}
|
|
88698
88720
|
}
|
|
88699
88721
|
toggleAnswer(text) {
|
|
@@ -88900,7 +88922,7 @@ class ShopProfileQuestionAnswerComponent {
|
|
|
88900
88922
|
} if (rf & 2) {
|
|
88901
88923
|
let _t;
|
|
88902
88924
|
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.scrollContainer = _t.first);
|
|
88903
|
-
} }, inputs: { question: [1, "question"], viewMode: [1, "viewMode"], viewType: [1, "viewType"], selectedCategoryId: [1, "selectedCategoryId"], selectedFocusAreaId: [1, "selectedFocusAreaId"], filteredQuestions: [1, "filteredQuestions"], profileShopAnswers: [1, "profileShopAnswers"] }, outputs: { backClick: "backClick", saveClick: "saveClick", saveAndNextClick: "saveAndNextClick" }, decls: 42, vars:
|
|
88925
|
+
} }, inputs: { question: [1, "question"], viewMode: [1, "viewMode"], viewType: [1, "viewType"], selectedCategoryId: [1, "selectedCategoryId"], selectedFocusAreaId: [1, "selectedFocusAreaId"], filteredQuestions: [1, "filteredQuestions"], profileShopAnswers: [1, "profileShopAnswers"] }, outputs: { backClick: "backClick", saveClick: "saveClick", saveAndNextClick: "saveAndNextClick" }, decls: 42, vars: 34, consts: [["scrollContainer", ""], [1, "flex", "flex-col", "h-full"], [1, "flex-1", "overflow-y-auto", 3, "scroll"], [1, "px-6", "py-4", "border-b", 3, "ngClass"], [1, "text-sm", "font-semibold", "mb-3", 3, "ngClass"], [1, "flex", "items-center", "gap-3"], [1, "flex-1"], [1, "h-2", "rounded-full", "overflow-hidden", 3, "ngClass"], [1, "h-full", "transition-all", "duration-500", "ease-out", "rounded-full", 3, "ngClass"], [1, "text-sm", "font-medium", "whitespace-nowrap", 3, "ngClass"], [1, "sticky", "top-0", "z-10", "px-6", "py-4", "transition-all", "duration-300", 3, "ngClass"], [1, "text-sm", "italic", "mb-2", 3, "ngClass"], [1, "font-bold", "transition-all", "duration-300", 3, "ngClass"], [1, "grid", "transition-[grid-template-rows,opacity]", "duration-300", "ease-in-out", 3, "grid-template-rows", "opacity"], [1, "px-6", "py-6"], [1, "space-y-3", "mb-4"], [1, "flex", "items-start", "gap-3", "p-4", "rounded-lg", "cursor-pointer", "transition-all", "duration-200", "hover:scale-[1.01]", 3, "ngClass"], [1, "mb-6"], [1, "grid", "transition-[grid-template-rows]", "duration-300", "ease-in-out"], [1, "overflow-hidden", "min-h-0"], [1, "pb-4"], ["rows", "5", "placeholder", "Enter your answer(s) here, separated by returns.", 1, "w-full", "px-4", "py-3", "rounded-lg", "border-2", "text-sm", "resize-y", "transition-colors", "duration-200", "focus:ring-2", "focus:ring-offset-2", 3, "ngModelChange", "ngModel", "ngClass"], [1, "flex", "items-center", "gap-3", "mt-3"], ["type", "button", 1, "px-5", "py-2.5", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", "hover:scale-105", "active:scale-95", 3, "click", "ngClass"], ["type", "button", 1, "flex-1", "px-5", "py-2.5", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", "disabled:opacity-50", "disabled:cursor-not-allowed", "disabled:hover:scale-100", 3, "click", "disabled", "ngClass"], ["type", "button", 1, "w-full", "px-5", "py-3", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", "border-2", "hover:scale-[1.01]", "active:scale-[0.99]", 3, "ngClass"], [1, "px-6", "py-4", "border-t", "sticky", "bottom-0", "z-10", 3, "ngClass"], [1, "flex", "items-center", "gap-4"], ["type", "button", 1, "px-5", "py-2.5", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", "border", "disabled:opacity-50", "disabled:cursor-not-allowed", "hover:scale-[1.02]", "active:scale-95", "disabled:hover:scale-100", 3, "click", "disabled", "ngClass"], ["type", "button", 1, "flex-1", "px-5", "py-2.5", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", "flex", "items-center", "justify-center", "gap-2", "disabled:opacity-50", "disabled:cursor-not-allowed", "hover:scale-[1.01]", "active:scale-[0.99]", "disabled:hover:scale-100", 3, "click", "disabled", "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M9 5l7 7-7 7"], [1, "grid", "transition-[grid-template-rows,opacity]", "duration-300", "ease-in-out"], [1, "text-sm", "leading-relaxed", "mt-3", 3, "ngClass"], [1, "mt-4"], [1, "flex", "items-center", "gap-2", "mb-2"], [1, "text-xs", "font-semibold", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-4", "h-4", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"], [1, "flex", "flex-wrap", "gap-2"], [1, "px-3", "py-1.5", "rounded-full", "text-xs", "font-medium", 3, "ngClass"], ["type", "checkbox", 1, "mt-0.5", "w-5", "h-5", "rounded", "border-2", "cursor-pointer", "transition-all", "duration-200", "focus:ring-2", "focus:ring-offset-2", 3, "change", "checked", "ngClass"], [1, "text-base", "flex-1", 3, "ngClass"], ["type", "button", 1, "w-full", "px-5", "py-3", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", "border-2", "hover:scale-[1.01]", "active:scale-[0.99]", 3, "click", "ngClass"]], template: function ShopProfileQuestionAnswerComponent_Template(rf, ctx) { if (rf & 1) {
|
|
88904
88926
|
const _r1 = i0.ɵɵgetCurrentView();
|
|
88905
88927
|
i0.ɵɵelementStart(0, "div", 1)(1, "div", 2, 0);
|
|
88906
88928
|
i0.ɵɵlistener("scroll", function ShopProfileQuestionAnswerComponent_Template_div_scroll_1_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.onScroll()); });
|
|
@@ -88970,6 +88992,7 @@ class ShopProfileQuestionAnswerComponent {
|
|
|
88970
88992
|
i0.ɵɵadvance();
|
|
88971
88993
|
i0.ɵɵconditional(ctx.viewType() !== "all" ? 13 : -1);
|
|
88972
88994
|
i0.ɵɵadvance();
|
|
88995
|
+
i0.ɵɵclassProp("text-xl", !ctx.isSticky())("text-lg", ctx.isSticky());
|
|
88973
88996
|
i0.ɵɵproperty("ngClass", ctx.questionTextClasses());
|
|
88974
88997
|
i0.ɵɵadvance();
|
|
88975
88998
|
i0.ɵɵtextInterpolate1(" ", ctx.question().question, " ");
|
|
@@ -89054,7 +89077,7 @@ class ShopProfileQuestionAnswerComponent {
|
|
|
89054
89077
|
}
|
|
89055
89078
|
|
|
89056
89079
|
<!-- Question -->
|
|
89057
|
-
<h2 [ngClass]="questionTextClasses()" class="font-bold text-lg">
|
|
89080
|
+
<h2 [ngClass]="questionTextClasses()" class="font-bold transition-all duration-300" [class.text-xl]="!isSticky()" [class.text-lg]="isSticky()">
|
|
89058
89081
|
{{ question().question }}
|
|
89059
89082
|
</h2>
|
|
89060
89083
|
|