@eric-emg/symphiq-components 1.2.280 → 1.2.281

package/fesm2022/symphiq-components.mjs

@@ -60609,32 +60609,47 @@ function InitialTargetSettingComponent_Conditional_36_Conditional_6_Template(rf,
     i0.ɵɵadvance();
     i0.ɵɵproperty("ngClass", ctx_r0.calculatingTextClasses());
 } }
-function InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(3);
     i0.ɵɵtextInterpolate1(" > ", ctx_r0.formatCurrency(ctx_r0.submittedAbsoluteInput()), " ");
 } }
-function InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+function InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtext(0);
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(3);
     i0.ɵɵtextInterpolate1(" ", ctx_r0.formatCurrency(ctx_r0.displayedTargetRevenue()), " ");
 } }
+function InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_4_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "p", 69);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("ngClass", ctx_r0.calculatedSecondaryClasses());
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", ctx_r0.formatCurrency(ctx_r0.originalTargetRevenue()), " ");
+} }
 function InitialTargetSettingComponent_Conditional_36_Conditional_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "p", 68);
-    i0.ɵɵconditionalCreate(1, InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_1_Template, 1, 1)(2, InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_2_Template, 1, 1);
+    i0.ɵɵelementStart(0, "div", 55)(1, "p", 68);
+    i0.ɵɵconditionalCreate(2, InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_2_Template, 1, 1)(3, InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_3_Template, 1, 1);
+    i0.ɵɵelementEnd();
+    i0.ɵɵconditionalCreate(4, InitialTargetSettingComponent_Conditional_36_Conditional_7_Conditional_4_Template, 2, 2, "p", 69);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
     const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance();
     i0.ɵɵclassProp("lg:text-3xl", ctx_r0.calculationState() !== "results" || ctx_r0.detailsExpanded());
     i0.ɵɵproperty("ngClass", ctx_r0.calculatedValueClasses());
     i0.ɵɵadvance();
-    i0.ɵɵconditional(ctx_r0.calculationState() === "results" && !ctx_r0.hasExistingTargets() && ctx_r0.submittedAbsoluteInput() !== null ? 1 : 2);
+    i0.ɵɵconditional(ctx_r0.calculationState() === "results" && !ctx_r0.hasExistingTargets() && ctx_r0.submittedAbsoluteInput() !== null ? 2 : 3);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r0.hasRevenueTargetChanged() ? 4 : -1);
 } }
 function InitialTargetSettingComponent_Conditional_36_Conditional_8_Template(rf, ctx) { if (rf & 1) {
     const _r7 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "button", 69);
+    i0.ɵɵelementStart(0, "button", 70);
     i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_8_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.handleAdjustTarget(); return i0.ɵɵresetView($event.stopPropagation()); });
     i0.ɵɵtext(1, " Adjust Revenue Target ");
     i0.ɵɵelementEnd();
@@ -60693,7 +60708,7 @@ function InitialTargetSettingComponent_Conditional_36_Conditional_30_Template(rf
     i0.ɵɵelementStart(10, "p", 65);
     i0.ɵɵconditionalCreate(11, InitialTargetSettingComponent_Conditional_36_Conditional_30_Conditional_11_Template, 1, 1)(12, InitialTargetSettingComponent_Conditional_36_Conditional_30_Conditional_12_Template, 1, 0);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(13, "div")(14, "div", 70)(15, "p", 14);
+    i0.ɵɵelementStart(13, "div")(14, "div", 71)(15, "p", 14);
     i0.ɵɵtext(16, " Additional Growth Needed ");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(17, "button", 40);
@@ -60735,7 +60750,7 @@ function InitialTargetSettingComponent_Conditional_36_Template(rf, ctx) { if (rf
     i0.ɵɵelementStart(0, "div", 53)(1, "div")(2, "div", 54)(3, "div")(4, "p", 14);
     i0.ɵɵtext(5);
     i0.ɵɵelementEnd();
-    i0.ɵɵconditionalCreate(6, InitialTargetSettingComponent_Conditional_36_Conditional_6_Template, 4, 2, "div", 11)(7, InitialTargetSettingComponent_Conditional_36_Conditional_7_Template, 3, 4, "p", 55);
+    i0.ɵɵconditionalCreate(6, InitialTargetSettingComponent_Conditional_36_Conditional_6_Template, 4, 2, "div", 11)(7, InitialTargetSettingComponent_Conditional_36_Conditional_7_Template, 5, 5, "div", 55);
     i0.ɵɵelementEnd();
     i0.ɵɵconditionalCreate(8, InitialTargetSettingComponent_Conditional_36_Conditional_8_Template, 2, 1, "button", 56);
     i0.ɵɵelementEnd();
@@ -60842,13 +60857,13 @@ function InitialTargetSettingComponent_Conditional_40_Conditional_6_Template(rf,
 } }
 function InitialTargetSettingComponent_Conditional_40_Template(rf, ctx) { if (rf & 1) {
     const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 31)(1, "div", 71)(2, "h2", 72);
+    i0.ɵɵelementStart(0, "div", 31)(1, "div", 72)(2, "h2", 73);
     i0.ɵɵtext(3, " Contributing Metrics ");
     i0.ɵɵelementEnd();
     i0.ɵɵelementStart(4, "p", 52);
     i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_40_Conditional_5_Template, 1, 1)(6, InitialTargetSettingComponent_Conditional_40_Conditional_6_Template, 1, 1);
     i0.ɵɵelementEnd()();
-    i0.ɵɵelementStart(7, "symphiq-funnel-metrics-visualization", 73);
+    i0.ɵɵelementStart(7, "symphiq-funnel-metrics-visualization", 74);
     i0.ɵɵlistener("viewStageReport", function InitialTargetSettingComponent_Conditional_40_Template_symphiq_funnel_metrics_visualization_viewStageReport_7_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.openMetricReport($event)); })("viewRelatedMetricReport", function InitialTargetSettingComponent_Conditional_40_Template_symphiq_funnel_metrics_visualization_viewRelatedMetricReport_7_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.openMetricReport($event)); })("editRelatedMetricTarget", function InitialTargetSettingComponent_Conditional_40_Template_symphiq_funnel_metrics_visualization_editRelatedMetricTarget_7_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onEditRelatedMetricTarget($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
@@ -60865,7 +60880,7 @@ function InitialTargetSettingComponent_Conditional_40_Template(rf, ctx) { if (rf
 } }
 function InitialTargetSettingComponent_Conditional_41_Template(rf, ctx) { if (rf & 1) {
     const _r10 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "symphiq-sticky-submit-bar", 74);
+    i0.ɵɵelementStart(0, "symphiq-sticky-submit-bar", 75);
     i0.ɵɵlistener("submitClick", function InitialTargetSettingComponent_Conditional_41_Template_symphiq_sticky_submit_bar_submitClick_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.handleSubmitClick()); })("cancelClick", function InitialTargetSettingComponent_Conditional_41_Template_symphiq_sticky_submit_bar_cancelClick_0_listener() { i0.ɵɵrestoreView(_r10); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.handleCancel()); });
     i0.ɵɵelementEnd();
 } if (rf & 2) {
@@ -60877,11 +60892,11 @@ function InitialTargetSettingComponent_Conditional_42_Template(rf, ctx) { if (rf
     i0.ɵɵelementStart(0, "div", 33)(1, "p", 52);
     i0.ɵɵtext(2, " You have unsaved target changes. ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 75)(4, "button", 76);
+    i0.ɵɵelementStart(3, "div", 76)(4, "button", 77);
     i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_42_Template_button_click_4_listener() { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onDiscardChanges()); });
     i0.ɵɵtext(5, " Reset ");
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(6, "button", 76);
+    i0.ɵɵelementStart(6, "button", 77);
     i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_42_Template_button_click_6_listener() { i0.ɵɵrestoreView(_r11); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSaveTargets()); });
     i0.ɵɵtext(7, " Save Targets ");
     i0.ɵɵelementEnd()()();
@@ -61076,8 +61091,19 @@ class InitialTargetSettingComponent {
             return resultsWithPending.map(calc => {
                 const responseMetric = calculateResponse.metricValues.find(mv => mv.metric === calc.metric);
                 if (responseMetric) {
-                    const { targetValue: newTargetValue, percentageIncrease: newPercentageIncrease } = this.parseMetricValue(responseMetric.value);
+                    const { targetValue: newTargetValue, percentageIncrease: parsedPercentage } = this.parseMetricValue(responseMetric.value);
                     const originalValue = calc.originalTargetValue !== undefined ? calc.originalTargetValue : calc.targetValue;
+                    let newPercentageIncrease = parsedPercentage;
+                    if (parsedPercentage === 0 && newTargetValue > 0 && calc.currentValue > 0) {
+                        const isPercentageMetric = MetricEnumUtil.numberType(calc.metric) === NumberTypeEnum.PERCENTAGE;
+                        if (isPercentageMetric) {
+                            const normalizedCurrent = calc.currentValue * 100;
+                            newPercentageIncrease = ((newTargetValue - normalizedCurrent) / normalizedCurrent) * 100;
+                        }
+                        else {
+                            newPercentageIncrease = ((newTargetValue - calc.currentValue) / calc.currentValue) * 100;
+                        }
+                    }
                     return {
                         ...calc,
                         originalTargetValue: originalValue,
@@ -61093,6 +61119,16 @@ class InitialTargetSettingComponent {
             if (targets && targets.length > 0) {
                 const revenueTarget = targets.find(t => t.metric === MetricEnum.PURCHASE_REVENUE);
                 if (revenueTarget && revenueTarget.amount !== undefined) {
+                    const calculateResponse = this.storedCalculateResponse();
+                    if (calculateResponse && calculateResponse.metricValues) {
+                        const revenueMetric = calculateResponse.metricValues.find(mv => mv.metric === MetricEnum.PURCHASE_REVENUE);
+                        if (revenueMetric && revenueMetric.value) {
+                            const parsed = parseFloat(revenueMetric.value.replace(/,/g, ''));
+                            if (!isNaN(parsed) && parsed > 0) {
+                                return parsed;
+                            }
+                        }
+                    }
                     return revenueTarget.amount;
                 }
             }
@@ -61105,6 +61141,23 @@ class InitialTargetSettingComponent {
             }
             return this.calculatedRevenue();
         }, ...(ngDevMode ? [{ debugName: "displayedTargetRevenue" }] : []));
+        this.originalTargetRevenue = computed(() => {
+            const targets = this.targets();
+            if (targets && targets.length > 0) {
+                const revenueTarget = targets.find(t => t.metric === MetricEnum.PURCHASE_REVENUE);
+                if (revenueTarget && revenueTarget.amount !== undefined) {
+                    return revenueTarget.amount;
+                }
+            }
+            return null;
+        }, ...(ngDevMode ? [{ debugName: "originalTargetRevenue" }] : []));
+        this.hasRevenueTargetChanged = computed(() => {
+            const original = this.originalTargetRevenue();
+            const displayed = this.displayedTargetRevenue();
+            if (original === null || original === 0)
+                return false;
+            return Math.abs(displayed - original) > 0.01;
+        }, ...(ngDevMode ? [{ debugName: "hasRevenueTargetChanged" }] : []));
         this.isValid = computed(() => {
             return this.calculatedRevenue() > this.priorYearRevenue() && this.priorYearRevenue() > 0;
         }, ...(ngDevMode ? [{ debugName: "isValid" }] : []));
@@ -61674,7 +61727,7 @@ class InitialTargetSettingComponent {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.absoluteInputRef = _t.first);
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.percentageInputRef = _t.first);
-        } }, inputs: { viewMode: [1, "viewMode"], funnelMetrics: [1, "funnelMetrics"], mainUiData: [1, "mainUiData"], trendUiData: [1, "trendUiData"], shopId: [1, "shopId"], pacingMetrics: [1, "pacingMetrics"], dataResults: [1, "dataResults"], calculateRevenueReverseResponse: [1, "calculateRevenueReverseResponse"], calculateRevenueResponse: [1, "calculateRevenueResponse"], isCalculatingTargets: [1, "isCalculatingTargets"], targets: [1, "targets"] }, outputs: { targetsCreated: "targetsCreated", calculateRevenueReverseRequest: "calculateRevenueReverseRequest", calculateRevenueRequest: "calculateRevenueRequest", editRelatedMetricTarget: "editRelatedMetricTarget", saveTargetsClick: "saveTargetsClick", discardChangesClick: "discardChangesClick", targetsUpdated: "targetsUpdated" }, decls: 45, vars: 51, consts: [["absoluteInputRef", ""], ["percentageInputRef", ""], [1, "space-y-8", "pb-32"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "click", "ngClass"], [1, "flex", "items-center", "justify-between", "mb-6"], [1, "text-2xl", "font-bold", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "chevron-rotate", 3, "chevron-rotate-expanded", "ngClass"], [1, "flex", "flex-col", "gap-4"], [1, "grid", "lg:grid-cols-2", "gap-4"], [1, "p-6", "rounded-xl", "border-2", 3, "click", "ngClass"], [1, "flex", "flex-wrap", "gap-4", "place-content-between"], [1, "flex", "items-center", "gap-2"], ["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", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", 3, "ngClass"], [1, "text-lg", "font-bold", 3, "ngClass"], [1, "form-area-collapse"], [1, "form-area-content"], [1, "space-y-6"], [1, "chart-in-column"], [1, "chart-in-column-content"], [1, "text-sm", "font-semibold", "mb-3", 3, "ngClass"], [1, "rounded-xl", "border", "p-4", 3, "ngClass"], [3, "chart", "showAxisLabels", "viewMode", "currencySymbol", "height"], [1, "h-64", "flex", "items-center", "justify-center"], [1, "calculated-card-enter", "order-first", "lg:order-last"], [1, "calculated-card-content"], [1, "p-6", "rounded-xl", "border-2", 3, "ngClass", "h-full"], [1, "w-full"], [1, "metrics-section-enter"], [1, "metrics-section-content"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "ngClass"], [3, "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], [1, "fixed", "bottom-0", "left-0", "right-0", "p-4", "border-t", "shadow-lg", "z-50", "flex", "flex-col", "sm:flex-row", "items-center", "justify-center", "gap-4", "!mb-0", 3, "ngClass"], [3, "closed", "viewMode", "metricEnum", "metricData", "contributingMetrics", "pacingMetrics", "trendChartData", "isOpen"], [3, "closed", "targetApplied", "viewMode", "metricData", "pacingMetrics", "isOpen"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "chevron-rotate", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], [1, "flex", "items-center", "gap-1"], ["type", "button", "tooltipType", "markdown", "tooltipPosition", "top", 1, "flex-shrink-0", "w-4", "h-4", "rounded-full", "inline-flex", "items-center", "justify-center", "transition-colors", 3, "click", "ngClass", "libSymphiqTooltip"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3"], ["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", "gap-2"], [1, "flex-1", "py-2", "px-4", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "relative"], [1, "flex", "justify-end"], [1, "absolute", "left-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "step", "1000", 1, "w-full", "pl-10", "pr-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "max", "1000", "step", "0.1", 1, "w-full", "pr-10", "pl-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], [1, "absolute", "right-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "text-sm", 3, "ngClass"], [1, "p-6", "rounded-xl", "border-2", 3, "ngClass"], [1, "flex", "items-center", "justify-between"], [1, "font-bold", "transition-all", "duration-300", "text-lg", 3, "ngClass", "lg:text-3xl"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "ngClass"], [1, "details-collapse"], [1, "details-collapse-content"], [1, "relative", "pt-6", "mt-6"], [1, "absolute", "top-0", "left-0", "right-0", "flex", "items-center", "-translate-y-1/2"], [1, "flex-1", "h-px", 3, "ngClass"], [1, "px-3", "py-1", "rounded-full", "text-xs", "font-semibold", "whitespace-nowrap", 3, "ngClass"], [1, "grid", "grid-cols-2", "gap-4", "pt-2"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", "mb-1", 3, "ngClass"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "w-5", "h-5", "border-2", "border-t-transparent", "rounded-full", "animate-spin", 3, "ngClass"], [1, "text-lg", "font-medium", 3, "ngClass"], [1, "font-bold", "transition-all", "duration-300", "text-lg", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "click", "ngClass"], [1, "flex", "items-center", "gap-1", "mb-1"], [1, "mb-6"], [1, "text-2xl", "font-bold", "mb-2", 3, "ngClass"], [3, "viewStageReport", "viewRelatedMetricReport", "editRelatedMetricTarget", "viewMode", "calculations", "pacingMetrics", "hasExistingTargets", "isCalculatingTargets"], [3, "submitClick", "cancelClick", "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], [1, "flex", "items-center", "gap-3"], ["type", "button", 1, "px-4", "py-2.5", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", 3, "click", "ngClass"]], template: function InitialTargetSettingComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { viewMode: [1, "viewMode"], funnelMetrics: [1, "funnelMetrics"], mainUiData: [1, "mainUiData"], trendUiData: [1, "trendUiData"], shopId: [1, "shopId"], pacingMetrics: [1, "pacingMetrics"], dataResults: [1, "dataResults"], calculateRevenueReverseResponse: [1, "calculateRevenueReverseResponse"], calculateRevenueResponse: [1, "calculateRevenueResponse"], isCalculatingTargets: [1, "isCalculatingTargets"], targets: [1, "targets"] }, outputs: { targetsCreated: "targetsCreated", calculateRevenueReverseRequest: "calculateRevenueReverseRequest", calculateRevenueRequest: "calculateRevenueRequest", editRelatedMetricTarget: "editRelatedMetricTarget", saveTargetsClick: "saveTargetsClick", discardChangesClick: "discardChangesClick", targetsUpdated: "targetsUpdated" }, decls: 45, vars: 51, consts: [["absoluteInputRef", ""], ["percentageInputRef", ""], [1, "space-y-8", "pb-32"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "click", "ngClass"], [1, "flex", "items-center", "justify-between", "mb-6"], [1, "text-2xl", "font-bold", 3, "ngClass"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "chevron-rotate", 3, "chevron-rotate-expanded", "ngClass"], [1, "flex", "flex-col", "gap-4"], [1, "grid", "lg:grid-cols-2", "gap-4"], [1, "p-6", "rounded-xl", "border-2", 3, "click", "ngClass"], [1, "flex", "flex-wrap", "gap-4", "place-content-between"], [1, "flex", "items-center", "gap-2"], ["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", "M9 19v-6a2 2 0 00-2-2H5a2 2 0 00-2 2v6a2 2 0 002 2h2a2 2 0 002-2zm0 0V9a2 2 0 012-2h2a2 2 0 012 2v10m-6 0a2 2 0 002 2h2a2 2 0 002-2m0 0V5a2 2 0 012-2h2a2 2 0 012 2v14a2 2 0 01-2 2h-2a2 2 0 01-2-2z"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", 3, "ngClass"], [1, "text-lg", "font-bold", 3, "ngClass"], [1, "form-area-collapse"], [1, "form-area-content"], [1, "space-y-6"], [1, "chart-in-column"], [1, "chart-in-column-content"], [1, "text-sm", "font-semibold", "mb-3", 3, "ngClass"], [1, "rounded-xl", "border", "p-4", 3, "ngClass"], [3, "chart", "showAxisLabels", "viewMode", "currencySymbol", "height"], [1, "h-64", "flex", "items-center", "justify-center"], [1, "calculated-card-enter", "order-first", "lg:order-last"], [1, "calculated-card-content"], [1, "p-6", "rounded-xl", "border-2", 3, "ngClass", "h-full"], [1, "w-full"], [1, "metrics-section-enter"], [1, "metrics-section-content"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "ngClass"], [3, "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], [1, "fixed", "bottom-0", "left-0", "right-0", "p-4", "border-t", "shadow-lg", "z-50", "flex", "flex-col", "sm:flex-row", "items-center", "justify-center", "gap-4", "!mb-0", 3, "ngClass"], [3, "closed", "viewMode", "metricEnum", "metricData", "contributingMetrics", "pacingMetrics", "trendChartData", "isOpen"], [3, "closed", "targetApplied", "viewMode", "metricData", "pacingMetrics", "isOpen"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-6", "h-6", "chevron-rotate", 3, "ngClass"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M19 9l-7 7-7-7"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], [1, "flex", "items-center", "gap-1"], ["type", "button", "tooltipType", "markdown", "tooltipPosition", "top", 1, "flex-shrink-0", "w-4", "h-4", "rounded-full", "inline-flex", "items-center", "justify-center", "transition-colors", 3, "click", "ngClass", "libSymphiqTooltip"], ["fill", "none", "stroke", "currentColor", "viewBox", "0 0 24 24", 1, "w-3", "h-3"], ["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", "gap-2"], [1, "flex-1", "py-2", "px-4", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "relative"], [1, "flex", "justify-end"], [1, "absolute", "left-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "step", "1000", 1, "w-full", "pl-10", "pr-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], ["type", "number", "placeholder", "0", "min", "0", "max", "1000", "step", "0.1", 1, "w-full", "pr-10", "pl-4", "py-4", "rounded-xl", "text-2xl", "font-bold", "border-2", "transition-all", 3, "ngModelChange", "ngModel", "ngClass"], [1, "absolute", "right-4", "top-1/2", "-translate-y-1/2", "text-xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "text-sm", 3, "ngClass"], [1, "p-6", "rounded-xl", "border-2", 3, "ngClass"], [1, "flex", "items-center", "justify-between"], [1, "flex", "items-baseline", "gap-2"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "ngClass"], [1, "details-collapse"], [1, "details-collapse-content"], [1, "relative", "pt-6", "mt-6"], [1, "absolute", "top-0", "left-0", "right-0", "flex", "items-center", "-translate-y-1/2"], [1, "flex-1", "h-px", 3, "ngClass"], [1, "px-3", "py-1", "rounded-full", "text-xs", "font-semibold", "whitespace-nowrap", 3, "ngClass"], [1, "grid", "grid-cols-2", "gap-4", "pt-2"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", "mb-1", 3, "ngClass"], [1, "text-xl", "font-bold", 3, "ngClass"], [1, "w-5", "h-5", "border-2", "border-t-transparent", "rounded-full", "animate-spin", 3, "ngClass"], [1, "text-lg", "font-medium", 3, "ngClass"], [1, "font-bold", "transition-all", "duration-300", "text-lg", 3, "ngClass"], [1, "text-base", "line-through", "opacity-60", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "click", "ngClass"], [1, "flex", "items-center", "gap-1", "mb-1"], [1, "mb-6"], [1, "text-2xl", "font-bold", "mb-2", 3, "ngClass"], [3, "viewStageReport", "viewRelatedMetricReport", "editRelatedMetricTarget", "viewMode", "calculations", "pacingMetrics", "hasExistingTargets", "isCalculatingTargets"], [3, "submitClick", "cancelClick", "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], [1, "flex", "items-center", "gap-3"], ["type", "button", 1, "px-4", "py-2.5", "rounded-lg", "font-medium", "text-sm", "transition-all", "duration-200", 3, "click", "ngClass"]], template: function InitialTargetSettingComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 2);
             i0.ɵɵelement(1, "symphiq-tooltip-container");
             i0.ɵɵelementStart(2, "div", 3);
@@ -61995,14 +62048,21 @@ class InitialTargetSettingComponent {
                               <p [ngClass]="calculatingTextClasses()" class="text-lg font-medium">Calculating...</p>
                             </div>
                           } @else {
-                            <p [ngClass]="calculatedValueClasses()" class="font-bold transition-all duration-300 text-lg"
-                              [class.lg:text-3xl]="calculationState() !== 'results' || detailsExpanded()">
-                              @if (calculationState() === 'results' && !hasExistingTargets() && submittedAbsoluteInput() !== null) {
-                                > {{ formatCurrency(submittedAbsoluteInput()!) }}
-                              } @else {
-                                {{ formatCurrency(displayedTargetRevenue()) }}
+                            <div class="flex items-baseline gap-2">
+                              <p [ngClass]="calculatedValueClasses()" class="font-bold transition-all duration-300 text-lg"
+                                [class.lg:text-3xl]="calculationState() !== 'results' || detailsExpanded()">
+                                @if (calculationState() === 'results' && !hasExistingTargets() && submittedAbsoluteInput() !== null) {
+                                  > {{ formatCurrency(submittedAbsoluteInput()!) }}
+                                } @else {
+                                  {{ formatCurrency(displayedTargetRevenue()) }}
+                                }
+                              </p>
+                              @if (hasRevenueTargetChanged()) {
+                                <p [ngClass]="calculatedSecondaryClasses()" class="text-base line-through opacity-60">
+                                  {{ formatCurrency(originalTargetRevenue()!) }}
+                                </p>
                               }
-                            </p>
+                            </div>
                           }
                         </div>
                         @if (calculationState() === 'results' && !hasExistingTargets()) {
@@ -62240,7 +62300,7 @@ class InitialTargetSettingComponent {
             type: ViewChild,
             args: ['percentageInputRef']
         }], viewMode: [{ type: i0.Input, args: [{ isSignal: true, alias: "viewMode", required: false }] }], funnelMetrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "funnelMetrics", required: false }] }], mainUiData: [{ type: i0.Input, args: [{ isSignal: true, alias: "mainUiData", required: false }] }], trendUiData: [{ type: i0.Input, args: [{ isSignal: true, alias: "trendUiData", required: false }] }], shopId: [{ type: i0.Input, args: [{ isSignal: true, alias: "shopId", required: false }] }], pacingMetrics: [{ type: i0.Input, args: [{ isSignal: true, alias: "pacingMetrics", required: false }] }], dataResults: [{ type: i0.Input, args: [{ isSignal: true, alias: "dataResults", required: false }] }], calculateRevenueReverseResponse: [{ type: i0.Input, args: [{ isSignal: true, alias: "calculateRevenueReverseResponse", required: false }] }], calculateRevenueResponse: [{ type: i0.Input, args: [{ isSignal: true, alias: "calculateRevenueResponse", required: false }] }], isCalculatingTargets: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCalculatingTargets", required: false }] }], targets: [{ type: i0.Input, args: [{ isSignal: true, alias: "targets", required: false }] }], targetsCreated: [{ type: i0.Output, args: ["targetsCreated"] }], calculateRevenueReverseRequest: [{ type: i0.Output, args: ["calculateRevenueReverseRequest"] }], calculateRevenueRequest: [{ type: i0.Output, args: ["calculateRevenueRequest"] }], editRelatedMetricTarget: [{ type: i0.Output, args: ["editRelatedMetricTarget"] }], saveTargetsClick: [{ type: i0.Output, args: ["saveTargetsClick"] }], discardChangesClick: [{ type: i0.Output, args: ["discardChangesClick"] }], targetsUpdated: [{ type: i0.Output, args: ["targetsUpdated"] }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InitialTargetSettingComponent, { className: "InitialTargetSettingComponent", filePath: "lib/components/revenue-calculator-dashboard/initial-target-setting.component.ts", lineNumber: 588 }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InitialTargetSettingComponent, { className: "InitialTargetSettingComponent", filePath: "lib/components/revenue-calculator-dashboard/initial-target-setting.component.ts", lineNumber: 595 }); })();
 
 function IndeterminateSpinnerComponent_For_5_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelement(0, "div", 5);