@eric-emg/symphiq-components 1.2.214 → 1.2.216

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.
@@ -56262,17 +56262,39 @@ var areaChart_component = /*#__PURE__*/Object.freeze({
56262
56262
 
56263
56263
  const _c0$r = ["absoluteInputRef"];
56264
56264
  const _c1$b = ["percentageInputRef"];
56265
- function InitialTargetSettingComponent_Conditional_18_Template(rf, ctx) { if (rf & 1) {
56266
- i0.ɵɵelementStart(0, "div", 10);
56265
+ function InitialTargetSettingComponent_Conditional_5_Template(rf, ctx) { if (rf & 1) {
56266
+ i0.ɵɵtext(0);
56267
+ } if (rf & 2) {
56268
+ const ctx_r0 = i0.ɵɵnextContext();
56269
+ i0.ɵɵtextInterpolate1(" Your ", ctx_r0.currentYear(), " Revenue Target ");
56270
+ } }
56271
+ function InitialTargetSettingComponent_Conditional_6_Template(rf, ctx) { if (rf & 1) {
56272
+ i0.ɵɵtext(0);
56273
+ } if (rf & 2) {
56274
+ const ctx_r0 = i0.ɵɵnextContext();
56275
+ i0.ɵɵtextInterpolate1(" Calculate Your ", ctx_r0.currentYear(), " Revenue Target ");
56276
+ } }
56277
+ function InitialTargetSettingComponent_Conditional_7_Template(rf, ctx) { if (rf & 1) {
56267
56278
  i0.ɵɵnamespaceSVG();
56268
- i0.ɵɵelementStart(1, "svg", 11);
56269
- i0.ɵɵelement(2, "path", 31);
56279
+ i0.ɵɵelementStart(0, "svg", 35);
56280
+ i0.ɵɵelement(1, "path", 36);
56281
+ i0.ɵɵelementEnd();
56282
+ } if (rf & 2) {
56283
+ const ctx_r0 = i0.ɵɵnextContext();
56284
+ i0.ɵɵclassProp("chevron-rotate-expanded", ctx_r0.detailsExpanded());
56285
+ i0.ɵɵproperty("ngClass", ctx_r0.chevronClasses());
56286
+ } }
56287
+ function InitialTargetSettingComponent_Conditional_21_Template(rf, ctx) { if (rf & 1) {
56288
+ i0.ɵɵelementStart(0, "div", 12);
56289
+ i0.ɵɵnamespaceSVG();
56290
+ i0.ɵɵelementStart(1, "svg", 13);
56291
+ i0.ɵɵelement(2, "path", 37);
56270
56292
  i0.ɵɵelementEnd();
56271
56293
  i0.ɵɵnamespaceHTML();
56272
- i0.ɵɵelementStart(3, "div")(4, "p", 13);
56294
+ i0.ɵɵelementStart(3, "div")(4, "p", 15);
56273
56295
  i0.ɵɵtext(5, " Current Pace Projection ");
56274
56296
  i0.ɵɵelementEnd();
56275
- i0.ɵɵelementStart(6, "p", 14);
56297
+ i0.ɵɵelementStart(6, "p", 16);
56276
56298
  i0.ɵɵtext(7);
56277
56299
  i0.ɵɵelementEnd()()();
56278
56300
  } if (rf & 2) {
@@ -56286,14 +56308,14 @@ function InitialTargetSettingComponent_Conditional_18_Template(rf, ctx) { if (rf
56286
56308
  i0.ɵɵadvance();
56287
56309
  i0.ɵɵtextInterpolate1(" ", ctx_r0.formatCurrency(ctx_r0.currentPaceProjection()), " ");
56288
56310
  } }
56289
- function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template(rf, ctx) { if (rf & 1) {
56311
+ function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template(rf, ctx) { if (rf & 1) {
56290
56312
  const _r3 = i0.ɵɵgetCurrentView();
56291
- i0.ɵɵelementStart(0, "div", 34)(1, "span", 36);
56313
+ i0.ɵɵelementStart(0, "div", 40)(1, "span", 42);
56292
56314
  i0.ɵɵtext(2, " $ ");
56293
56315
  i0.ɵɵelementEnd();
56294
- i0.ɵɵelementStart(3, "input", 37, 0);
56295
- i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template_input_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.absoluteInput, $event) || (ctx_r0.absoluteInput = $event); return i0.ɵɵresetView($event); });
56296
- i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template_input_ngModelChange_3_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onAbsoluteInputChange()); });
56316
+ i0.ɵɵelementStart(3, "input", 43, 0);
56317
+ i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template_input_ngModelChange_3_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.absoluteInput, $event) || (ctx_r0.absoluteInput = $event); return i0.ɵɵresetView($event); });
56318
+ i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template_input_ngModelChange_3_listener() { i0.ɵɵrestoreView(_r3); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onAbsoluteInputChange()); });
56297
56319
  i0.ɵɵelementEnd()();
56298
56320
  } if (rf & 2) {
56299
56321
  const ctx_r0 = i0.ɵɵnextContext(2);
@@ -56303,13 +56325,13 @@ function InitialTargetSettingComponent_Conditional_22_Conditional_5_Template(rf,
56303
56325
  i0.ɵɵtwoWayProperty("ngModel", ctx_r0.absoluteInput);
56304
56326
  i0.ɵɵproperty("ngClass", ctx_r0.inputClasses());
56305
56327
  } }
56306
- function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template(rf, ctx) { if (rf & 1) {
56328
+ function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template(rf, ctx) { if (rf & 1) {
56307
56329
  const _r4 = i0.ɵɵgetCurrentView();
56308
- i0.ɵɵelementStart(0, "div", 34)(1, "input", 38, 1);
56309
- i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.percentageInput, $event) || (ctx_r0.percentageInput = $event); return i0.ɵɵresetView($event); });
56310
- i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template_input_ngModelChange_1_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onPercentageInputChange()); });
56330
+ i0.ɵɵelementStart(0, "div", 40)(1, "input", 44, 1);
56331
+ i0.ɵɵtwoWayListener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.percentageInput, $event) || (ctx_r0.percentageInput = $event); return i0.ɵɵresetView($event); });
56332
+ i0.ɵɵlistener("ngModelChange", function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template_input_ngModelChange_1_listener() { i0.ɵɵrestoreView(_r4); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.onPercentageInputChange()); });
56311
56333
  i0.ɵɵelementEnd();
56312
- i0.ɵɵelementStart(3, "span", 39);
56334
+ i0.ɵɵelementStart(3, "span", 45);
56313
56335
  i0.ɵɵtext(4, " % ");
56314
56336
  i0.ɵɵelementEnd()();
56315
56337
  } if (rf & 2) {
@@ -56320,10 +56342,10 @@ function InitialTargetSettingComponent_Conditional_22_Conditional_6_Template(rf,
56320
56342
  i0.ɵɵadvance(2);
56321
56343
  i0.ɵɵproperty("ngClass", ctx_r0.inputSuffixClasses());
56322
56344
  } }
56323
- function InitialTargetSettingComponent_Conditional_22_Conditional_7_Template(rf, ctx) { if (rf & 1) {
56345
+ function InitialTargetSettingComponent_Conditional_25_Conditional_7_Template(rf, ctx) { if (rf & 1) {
56324
56346
  const _r5 = i0.ɵɵgetCurrentView();
56325
- i0.ɵɵelementStart(0, "div", 35)(1, "button", 40);
56326
- i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_22_Conditional_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.handleCancel()); });
56347
+ i0.ɵɵelementStart(0, "div", 41)(1, "button", 46);
56348
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_25_Conditional_7_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.handleCancel()); });
56327
56349
  i0.ɵɵtext(2, " Cancel ");
56328
56350
  i0.ɵɵelementEnd()();
56329
56351
  } if (rf & 2) {
@@ -56331,18 +56353,18 @@ function InitialTargetSettingComponent_Conditional_22_Conditional_7_Template(rf,
56331
56353
  i0.ɵɵadvance();
56332
56354
  i0.ɵɵproperty("ngClass", ctx_r0.cancelButtonClasses());
56333
56355
  } }
56334
- function InitialTargetSettingComponent_Conditional_22_Template(rf, ctx) { if (rf & 1) {
56356
+ function InitialTargetSettingComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
56335
56357
  const _r2 = i0.ɵɵgetCurrentView();
56336
- i0.ɵɵelementStart(0, "div", 32)(1, "button", 33);
56337
- i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_22_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("absolute")); });
56358
+ i0.ɵɵelementStart(0, "div", 38)(1, "button", 39);
56359
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_25_Template_button_click_1_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("absolute")); });
56338
56360
  i0.ɵɵtext(2, " Absolute Amount ");
56339
56361
  i0.ɵɵelementEnd();
56340
- i0.ɵɵelementStart(3, "button", 33);
56341
- i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_22_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("percentage")); });
56362
+ i0.ɵɵelementStart(3, "button", 39);
56363
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_25_Template_button_click_3_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.setInputMode("percentage")); });
56342
56364
  i0.ɵɵtext(4, " % Increase ");
56343
56365
  i0.ɵɵelementEnd()();
56344
- i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_22_Conditional_5_Template, 5, 3, "div", 34)(6, InitialTargetSettingComponent_Conditional_22_Conditional_6_Template, 5, 3, "div", 34);
56345
- i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_22_Conditional_7_Template, 3, 1, "div", 35);
56366
+ i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_25_Conditional_5_Template, 5, 3, "div", 40)(6, InitialTargetSettingComponent_Conditional_25_Conditional_6_Template, 5, 3, "div", 40);
56367
+ i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_25_Conditional_7_Template, 3, 1, "div", 41);
56346
56368
  } if (rf & 2) {
56347
56369
  const ctx_r0 = i0.ɵɵnextContext();
56348
56370
  i0.ɵɵadvance();
@@ -56354,14 +56376,14 @@ function InitialTargetSettingComponent_Conditional_22_Template(rf, ctx) { if (rf
56354
56376
  i0.ɵɵadvance(2);
56355
56377
  i0.ɵɵconditional(ctx_r0.hasStoredResponse() ? 7 : -1);
56356
56378
  } }
56357
- function InitialTargetSettingComponent_Conditional_29_Template(rf, ctx) { if (rf & 1) {
56358
- i0.ɵɵelement(0, "symphiq-area-chart", 22);
56379
+ function InitialTargetSettingComponent_Conditional_32_Template(rf, ctx) { if (rf & 1) {
56380
+ i0.ɵɵelement(0, "symphiq-area-chart", 24);
56359
56381
  } if (rf & 2) {
56360
56382
  const ctx_r0 = i0.ɵɵnextContext();
56361
56383
  i0.ɵɵproperty("chart", ctx_r0.revenueChartData())("showAxisLabels", true)("viewMode", ctx_r0.viewMode())("currencySymbol", "$")("height", "108px");
56362
56384
  } }
56363
- function InitialTargetSettingComponent_Conditional_30_Template(rf, ctx) { if (rf & 1) {
56364
- i0.ɵɵelementStart(0, "div", 23)(1, "p", 41);
56385
+ function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf & 1) {
56386
+ i0.ɵɵelementStart(0, "div", 25)(1, "p", 47);
56365
56387
  i0.ɵɵtext(2, " No revenue data available ");
56366
56388
  i0.ɵɵelementEnd()();
56367
56389
  } if (rf & 2) {
@@ -56369,52 +56391,54 @@ function InitialTargetSettingComponent_Conditional_30_Template(rf, ctx) { if (rf
56369
56391
  i0.ɵɵadvance();
56370
56392
  i0.ɵɵproperty("ngClass", ctx_r0.noDataClasses());
56371
56393
  } }
56372
- function InitialTargetSettingComponent_Conditional_33_Conditional_7_Template(rf, ctx) { if (rf & 1) {
56394
+ function InitialTargetSettingComponent_Conditional_36_Conditional_7_Template(rf, ctx) { if (rf & 1) {
56373
56395
  i0.ɵɵtext(0);
56374
56396
  } if (rf & 2) {
56375
56397
  const ctx_r0 = i0.ɵɵnextContext(2);
56376
56398
  i0.ɵɵtextInterpolate1(" > ", ctx_r0.formatCurrency(ctx_r0.submittedAbsoluteInput()), " ");
56377
56399
  } }
56378
- function InitialTargetSettingComponent_Conditional_33_Conditional_8_Template(rf, ctx) { if (rf & 1) {
56400
+ function InitialTargetSettingComponent_Conditional_36_Conditional_8_Template(rf, ctx) { if (rf & 1) {
56379
56401
  i0.ɵɵtext(0);
56380
56402
  } if (rf & 2) {
56381
56403
  const ctx_r0 = i0.ɵɵnextContext(2);
56382
56404
  i0.ɵɵtextInterpolate1(" ", ctx_r0.formatCurrency(ctx_r0.displayedTargetRevenue()), " ");
56383
56405
  } }
56384
- function InitialTargetSettingComponent_Conditional_33_Conditional_9_Template(rf, ctx) { if (rf & 1) {
56406
+ function InitialTargetSettingComponent_Conditional_36_Conditional_9_Template(rf, ctx) { if (rf & 1) {
56385
56407
  const _r6 = i0.ɵɵgetCurrentView();
56386
- i0.ɵɵelementStart(0, "button", 52);
56387
- i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_33_Conditional_9_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.handleAdjustTarget()); });
56408
+ i0.ɵɵelementStart(0, "button", 61);
56409
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_9_Template_button_click_0_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.handleAdjustTarget(); return i0.ɵɵresetView($event.stopPropagation()); });
56388
56410
  i0.ɵɵtext(1, " Adjust Revenue Target ");
56389
56411
  i0.ɵɵelementEnd();
56390
56412
  } if (rf & 2) {
56391
56413
  const ctx_r0 = i0.ɵɵnextContext(2);
56392
56414
  i0.ɵɵproperty("ngClass", ctx_r0.secondaryButtonClasses());
56393
56415
  } }
56394
- function InitialTargetSettingComponent_Conditional_33_Conditional_27_Template(rf, ctx) { if (rf & 1) {
56395
- i0.ɵɵelementStart(0, "div", 46)(1, "div", 47);
56396
- i0.ɵɵelement(2, "div", 48);
56397
- i0.ɵɵelementStart(3, "span", 49);
56416
+ function InitialTargetSettingComponent_Conditional_36_Conditional_29_Template(rf, ctx) { if (rf & 1) {
56417
+ const _r7 = i0.ɵɵgetCurrentView();
56418
+ i0.ɵɵelementStart(0, "div", 54)(1, "div", 55);
56419
+ i0.ɵɵelement(2, "div", 56);
56420
+ i0.ɵɵelementStart(3, "span", 57);
56398
56421
  i0.ɵɵtext(4);
56399
56422
  i0.ɵɵelementEnd();
56400
- i0.ɵɵelement(5, "div", 48);
56423
+ i0.ɵɵelement(5, "div", 56);
56401
56424
  i0.ɵɵelementEnd();
56402
- i0.ɵɵelementStart(6, "div", 50)(7, "div")(8, "p", 43);
56425
+ i0.ɵɵelementStart(6, "div", 58)(7, "div")(8, "p", 49);
56403
56426
  i0.ɵɵtext(9, " Gap to Close ");
56404
56427
  i0.ɵɵelementEnd();
56405
- i0.ɵɵelementStart(10, "p", 51);
56428
+ i0.ɵɵelementStart(10, "p", 59);
56406
56429
  i0.ɵɵtext(11);
56407
56430
  i0.ɵɵelementEnd()();
56408
- i0.ɵɵelementStart(12, "div")(13, "div", 53)(14, "p", 13);
56431
+ i0.ɵɵelementStart(12, "div")(13, "div", 62)(14, "p", 15);
56409
56432
  i0.ɵɵtext(15, " Additional Growth Needed ");
56410
56433
  i0.ɵɵelementEnd();
56411
- i0.ɵɵelementStart(16, "button", 54);
56434
+ i0.ɵɵelementStart(16, "button", 63);
56435
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_29_Template_button_click_16_listener($event) { i0.ɵɵrestoreView(_r7); return i0.ɵɵresetView($event.stopPropagation()); });
56412
56436
  i0.ɵɵnamespaceSVG();
56413
- i0.ɵɵelementStart(17, "svg", 55);
56414
- i0.ɵɵelement(18, "path", 56);
56437
+ i0.ɵɵelementStart(17, "svg", 64);
56438
+ i0.ɵɵelement(18, "path", 65);
56415
56439
  i0.ɵɵelementEnd()()();
56416
56440
  i0.ɵɵnamespaceHTML();
56417
- i0.ɵɵelementStart(19, "p", 51);
56441
+ i0.ɵɵelementStart(19, "p", 59);
56418
56442
  i0.ɵɵtext(20);
56419
56443
  i0.ɵɵelementEnd()()()();
56420
56444
  } if (rf & 2) {
@@ -56442,40 +56466,54 @@ function InitialTargetSettingComponent_Conditional_33_Conditional_27_Template(rf
56442
56466
  i0.ɵɵadvance();
56443
56467
  i0.ɵɵtextInterpolate2(" ", ctx_r0.gapToClose().amount > 0 ? "+" : "", "", ctx_r0.formatPercentage(ctx_r0.gapToClose().percentage, 1), " ");
56444
56468
  } }
56445
- function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf & 1) {
56446
- i0.ɵɵelementStart(0, "div", 26)(1, "div", 17)(2, "div", 42)(3, "div")(4, "p", 43);
56469
+ function InitialTargetSettingComponent_Conditional_36_Conditional_30_Template(rf, ctx) { if (rf & 1) {
56470
+ const _r8 = i0.ɵɵgetCurrentView();
56471
+ i0.ɵɵelementStart(0, "div", 60)(1, "button", 66);
56472
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_36_Conditional_30_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r8); const ctx_r0 = i0.ɵɵnextContext(2); ctx_r0.toggleDetails(); return i0.ɵɵresetView($event.stopPropagation()); });
56473
+ i0.ɵɵtext(2, " Show Less ");
56474
+ i0.ɵɵelementEnd()();
56475
+ } if (rf & 2) {
56476
+ const ctx_r0 = i0.ɵɵnextContext(2);
56477
+ i0.ɵɵadvance();
56478
+ i0.ɵɵproperty("ngClass", ctx_r0.learnMoreButtonClasses());
56479
+ } }
56480
+ function InitialTargetSettingComponent_Conditional_36_Template(rf, ctx) { if (rf & 1) {
56481
+ i0.ɵɵelementStart(0, "div", 28)(1, "div")(2, "div", 48)(3, "div")(4, "p", 49);
56447
56482
  i0.ɵɵtext(5);
56448
56483
  i0.ɵɵelementEnd();
56449
- i0.ɵɵelementStart(6, "p", 44);
56450
- i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_33_Conditional_7_Template, 1, 1)(8, InitialTargetSettingComponent_Conditional_33_Conditional_8_Template, 1, 1);
56484
+ i0.ɵɵelementStart(6, "p", 50);
56485
+ i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_36_Conditional_7_Template, 1, 1)(8, InitialTargetSettingComponent_Conditional_36_Conditional_8_Template, 1, 1);
56451
56486
  i0.ɵɵelementEnd()();
56452
- i0.ɵɵconditionalCreate(9, InitialTargetSettingComponent_Conditional_33_Conditional_9_Template, 2, 1, "button", 45);
56487
+ i0.ɵɵconditionalCreate(9, InitialTargetSettingComponent_Conditional_36_Conditional_9_Template, 2, 1, "button", 51);
56453
56488
  i0.ɵɵelementEnd();
56454
- i0.ɵɵelementStart(10, "div", 46)(11, "div", 47);
56455
- i0.ɵɵelement(12, "div", 48);
56456
- i0.ɵɵelementStart(13, "span", 49);
56457
- i0.ɵɵtext(14);
56489
+ i0.ɵɵelementStart(10, "div", 52)(11, "div", 53)(12, "div", 54)(13, "div", 55);
56490
+ i0.ɵɵelement(14, "div", 56);
56491
+ i0.ɵɵelementStart(15, "span", 57);
56492
+ i0.ɵɵtext(16);
56458
56493
  i0.ɵɵelementEnd();
56459
- i0.ɵɵelement(15, "div", 48);
56494
+ i0.ɵɵelement(17, "div", 56);
56460
56495
  i0.ɵɵelementEnd();
56461
- i0.ɵɵelementStart(16, "div", 50)(17, "div")(18, "p", 43);
56462
- i0.ɵɵtext(19, " Increase Amount ");
56496
+ i0.ɵɵelementStart(18, "div", 58)(19, "div")(20, "p", 49);
56497
+ i0.ɵɵtext(21, " Increase Amount ");
56463
56498
  i0.ɵɵelementEnd();
56464
- i0.ɵɵelementStart(20, "p", 51);
56465
- i0.ɵɵtext(21);
56499
+ i0.ɵɵelementStart(22, "p", 59);
56500
+ i0.ɵɵtext(23);
56466
56501
  i0.ɵɵelementEnd()();
56467
- i0.ɵɵelementStart(22, "div")(23, "p", 43);
56468
- i0.ɵɵtext(24, " % Growth ");
56502
+ i0.ɵɵelementStart(24, "div")(25, "p", 49);
56503
+ i0.ɵɵtext(26, " % Growth ");
56469
56504
  i0.ɵɵelementEnd();
56470
- i0.ɵɵelementStart(25, "p", 51);
56471
- i0.ɵɵtext(26);
56505
+ i0.ɵɵelementStart(27, "p", 59);
56506
+ i0.ɵɵtext(28);
56507
+ i0.ɵɵelementEnd()()()();
56508
+ i0.ɵɵconditionalCreate(29, InitialTargetSettingComponent_Conditional_36_Conditional_29_Template, 21, 13, "div", 54);
56509
+ i0.ɵɵconditionalCreate(30, InitialTargetSettingComponent_Conditional_36_Conditional_30_Template, 3, 1, "div", 60);
56472
56510
  i0.ɵɵelementEnd()()()();
56473
- i0.ɵɵconditionalCreate(27, InitialTargetSettingComponent_Conditional_33_Conditional_27_Template, 21, 13, "div", 46);
56474
- i0.ɵɵelementEnd()();
56475
56511
  } if (rf & 2) {
56476
56512
  const ctx_r0 = i0.ɵɵnextContext();
56477
56513
  i0.ɵɵproperty("ngClass", ctx_r0.calculatedValuesCardClasses());
56478
- i0.ɵɵadvance(4);
56514
+ i0.ɵɵadvance();
56515
+ i0.ɵɵclassProp("space-y-6", ctx_r0.calculationState() !== "results" || ctx_r0.detailsExpanded());
56516
+ i0.ɵɵadvance(3);
56479
56517
  i0.ɵɵproperty("ngClass", ctx_r0.calculatedLabelClasses());
56480
56518
  i0.ɵɵadvance();
56481
56519
  i0.ɵɵtextInterpolate1(" ", ctx_r0.currentYear(), " Revenue Target ");
@@ -56485,7 +56523,9 @@ function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf
56485
56523
  i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.targets() === undefined && ctx_r0.submittedAbsoluteInput() !== null ? 7 : 8);
56486
56524
  i0.ɵɵadvance(2);
56487
56525
  i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.targets() === undefined ? 9 : -1);
56488
- i0.ɵɵadvance(3);
56526
+ i0.ɵɵadvance();
56527
+ i0.ɵɵclassProp("details-collapse-expanded", ctx_r0.calculationState() !== "results" || ctx_r0.detailsExpanded());
56528
+ i0.ɵɵadvance(4);
56489
56529
  i0.ɵɵproperty("ngClass", ctx_r0.dividerBorderClasses());
56490
56530
  i0.ɵɵadvance();
56491
56531
  i0.ɵɵproperty("ngClass", ctx_r0.dividerLabelClasses());
@@ -56506,16 +56546,29 @@ function InitialTargetSettingComponent_Conditional_33_Template(rf, ctx) { if (rf
56506
56546
  i0.ɵɵadvance();
56507
56547
  i0.ɵɵtextInterpolate1(" +", ctx_r0.formatPercentage(ctx_r0.percentageIncrease(), 1), " ");
56508
56548
  i0.ɵɵadvance();
56509
- i0.ɵɵconditional(ctx_r0.currentPaceProjection() > 0 && ctx_r0.gapToClose().amount !== 0 ? 27 : -1);
56549
+ i0.ɵɵconditional(ctx_r0.currentPaceProjection() > 0 && ctx_r0.gapToClose().amount !== 0 ? 29 : -1);
56550
+ i0.ɵɵadvance();
56551
+ i0.ɵɵconditional(ctx_r0.calculationState() === "results" && ctx_r0.detailsExpanded() ? 30 : -1);
56510
56552
  } }
56511
- function InitialTargetSettingComponent_Conditional_34_Conditional_4_Template(rf, ctx) { if (rf & 1) {
56512
- i0.ɵɵelement(0, "symphiq-area-chart", 22);
56553
+ function InitialTargetSettingComponent_Conditional_37_Template(rf, ctx) { if (rf & 1) {
56554
+ const _r9 = i0.ɵɵgetCurrentView();
56555
+ i0.ɵɵelementStart(0, "div", 29)(1, "button", 66);
56556
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Conditional_37_Template_button_click_1_listener($event) { i0.ɵɵrestoreView(_r9); const ctx_r0 = i0.ɵɵnextContext(); ctx_r0.toggleDetails(); return i0.ɵɵresetView($event.stopPropagation()); });
56557
+ i0.ɵɵtext(2, " Learn More ");
56558
+ i0.ɵɵelementEnd()();
56559
+ } if (rf & 2) {
56560
+ const ctx_r0 = i0.ɵɵnextContext();
56561
+ i0.ɵɵadvance();
56562
+ i0.ɵɵproperty("ngClass", ctx_r0.learnMoreButtonClasses());
56563
+ } }
56564
+ function InitialTargetSettingComponent_Conditional_38_Conditional_4_Template(rf, ctx) { if (rf & 1) {
56565
+ i0.ɵɵelement(0, "symphiq-area-chart", 24);
56513
56566
  } if (rf & 2) {
56514
56567
  const ctx_r0 = i0.ɵɵnextContext(2);
56515
56568
  i0.ɵɵproperty("chart", ctx_r0.revenueChartData())("showAxisLabels", true)("viewMode", ctx_r0.viewMode())("currencySymbol", "$")("height", "320px");
56516
56569
  } }
56517
- function InitialTargetSettingComponent_Conditional_34_Conditional_5_Template(rf, ctx) { if (rf & 1) {
56518
- i0.ɵɵelementStart(0, "div", 23)(1, "p", 41);
56570
+ function InitialTargetSettingComponent_Conditional_38_Conditional_5_Template(rf, ctx) { if (rf & 1) {
56571
+ i0.ɵɵelementStart(0, "div", 25)(1, "p", 47);
56519
56572
  i0.ɵɵtext(2, " No revenue data available ");
56520
56573
  i0.ɵɵelementEnd()();
56521
56574
  } if (rf & 2) {
@@ -56523,12 +56576,12 @@ function InitialTargetSettingComponent_Conditional_34_Conditional_5_Template(rf,
56523
56576
  i0.ɵɵadvance();
56524
56577
  i0.ɵɵproperty("ngClass", ctx_r0.noDataClasses());
56525
56578
  } }
56526
- function InitialTargetSettingComponent_Conditional_34_Template(rf, ctx) { if (rf & 1) {
56527
- i0.ɵɵelementStart(0, "div", 27)(1, "p", 20);
56579
+ function InitialTargetSettingComponent_Conditional_38_Template(rf, ctx) { if (rf & 1) {
56580
+ i0.ɵɵelementStart(0, "div", 30)(1, "p", 22);
56528
56581
  i0.ɵɵtext(2, " Year-over-Year Revenue Trend ");
56529
56582
  i0.ɵɵelementEnd();
56530
- i0.ɵɵelementStart(3, "div", 21);
56531
- i0.ɵɵconditionalCreate(4, InitialTargetSettingComponent_Conditional_34_Conditional_4_Template, 1, 5, "symphiq-area-chart", 22)(5, InitialTargetSettingComponent_Conditional_34_Conditional_5_Template, 3, 1, "div", 23);
56583
+ i0.ɵɵelementStart(3, "div", 23);
56584
+ i0.ɵɵconditionalCreate(4, InitialTargetSettingComponent_Conditional_38_Conditional_4_Template, 1, 5, "symphiq-area-chart", 24)(5, InitialTargetSettingComponent_Conditional_38_Conditional_5_Template, 3, 1, "div", 25);
56532
56585
  i0.ɵɵelementEnd()();
56533
56586
  } if (rf & 2) {
56534
56587
  const ctx_r0 = i0.ɵɵnextContext();
@@ -56539,14 +56592,14 @@ function InitialTargetSettingComponent_Conditional_34_Template(rf, ctx) { if (rf
56539
56592
  i0.ɵɵadvance();
56540
56593
  i0.ɵɵconditional(ctx_r0.revenueChartData() ? 4 : 5);
56541
56594
  } }
56542
- function InitialTargetSettingComponent_Conditional_37_Template(rf, ctx) { if (rf & 1) {
56543
- i0.ɵɵelementStart(0, "div", 3)(1, "div", 57)(2, "h2", 58);
56595
+ function InitialTargetSettingComponent_Conditional_41_Template(rf, ctx) { if (rf & 1) {
56596
+ i0.ɵɵelementStart(0, "div", 33)(1, "div", 67)(2, "h2", 68);
56544
56597
  i0.ɵɵtext(3, " Contributing Metrics ");
56545
56598
  i0.ɵɵelementEnd();
56546
- i0.ɵɵelementStart(4, "p", 41);
56599
+ i0.ɵɵelementStart(4, "p", 47);
56547
56600
  i0.ɵɵtext(5);
56548
56601
  i0.ɵɵelementEnd()();
56549
- i0.ɵɵelement(6, "symphiq-funnel-metrics-visualization", 59);
56602
+ i0.ɵɵelement(6, "symphiq-funnel-metrics-visualization", 69);
56550
56603
  i0.ɵɵelementEnd();
56551
56604
  } if (rf & 2) {
56552
56605
  const ctx_r0 = i0.ɵɵnextContext();
@@ -56579,6 +56632,7 @@ class InitialTargetSettingComponent {
56579
56632
  this.calculationState = signal('input', ...(ngDevMode ? [{ debugName: "calculationState" }] : []));
56580
56633
  this.storedResponse = signal(null, ...(ngDevMode ? [{ debugName: "storedResponse" }] : []));
56581
56634
  this.submittedAbsoluteInput = signal(null, ...(ngDevMode ? [{ debugName: "submittedAbsoluteInput" }] : []));
56635
+ this.detailsExpanded = signal(false, ...(ngDevMode ? [{ debugName: "detailsExpanded" }] : []));
56582
56636
  this.priorYearRevenue = computed(() => {
56583
56637
  return sumMetricFromUiData(this.mainUiData(), MetricEnum.PURCHASE_REVENUE, 'priorYear');
56584
56638
  }, ...(ngDevMode ? [{ debugName: "priorYearRevenue" }] : []));
@@ -56867,6 +56921,14 @@ class InitialTargetSettingComponent {
56867
56921
  }
56868
56922
  this.calculationState.set('results');
56869
56923
  }
56924
+ onCardClick() {
56925
+ if (this.calculationState() === 'results') {
56926
+ this.toggleDetails();
56927
+ }
56928
+ }
56929
+ toggleDetails() {
56930
+ this.detailsExpanded.set(!this.detailsExpanded());
56931
+ }
56870
56932
  formatCurrency(value) {
56871
56933
  return formatCurrency(value);
56872
56934
  }
@@ -56982,6 +57044,16 @@ class InitialTargetSettingComponent {
56982
57044
  ? 'bg-slate-700 text-slate-300 border-2 border-slate-600 hover:bg-slate-600'
56983
57045
  : 'bg-slate-100 text-slate-600 border-2 border-slate-300 hover:bg-slate-200';
56984
57046
  }
57047
+ chevronClasses() {
57048
+ return this.viewMode() === ViewModeEnum.DARK
57049
+ ? 'text-slate-400'
57050
+ : 'text-slate-500';
57051
+ }
57052
+ learnMoreButtonClasses() {
57053
+ return this.viewMode() === ViewModeEnum.DARK
57054
+ ? 'text-purple-400 hover:text-purple-300'
57055
+ : 'text-purple-600 hover:text-purple-700';
57056
+ }
56985
57057
  baselineMetricsCardClasses() {
56986
57058
  return this.viewMode() === ViewModeEnum.DARK
56987
57059
  ? 'bg-slate-800/60 border border-slate-700'
@@ -57040,53 +57112,63 @@ class InitialTargetSettingComponent {
57040
57112
  let _t;
57041
57113
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.absoluteInputRef = _t.first);
57042
57114
  i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.percentageInputRef = _t.first);
57043
- } }, inputs: { viewMode: [1, "viewMode"], funnelMetrics: [1, "funnelMetrics"], mainUiData: [1, "mainUiData"], trendUiData: [1, "trendUiData"], shopId: [1, "shopId"], pacingMetrics: [1, "pacingMetrics"], dataResults: [1, "dataResults"], reverseCalculationResponse: [1, "reverseCalculationResponse"], targets: [1, "targets"] }, outputs: { targetsCreated: "targetsCreated", calculateRevenueRequest: "calculateRevenueRequest" }, decls: 39, vars: 33, consts: [["absoluteInputRef", ""], ["percentageInputRef", ""], [1, "space-y-8", "pb-32"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "ngClass"], [1, "text-2xl", "font-bold", "mb-6", 3, "ngClass"], [1, "flex", "flex-col", "gap-8"], [1, "grid", "lg:grid-cols-2", "gap-8"], [1, "flex", "flex-col", "gap-4"], [1, "p-6", "rounded-xl", "border-2", 3, "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", "h-full", 3, "ngClass"], [1, "w-full"], [1, "metrics-section-enter"], [1, "metrics-section-content"], [3, "submitClick", "cancelClick", "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], ["stroke-linecap", "round", "stroke-linejoin", "round", "stroke-width", "2", "d", "M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"], [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, "flex", "items-center", "justify-between"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", "mb-1", 3, "ngClass"], [1, "text-3xl", "font-bold", 3, "ngClass"], [1, "px-4", "py-2", "rounded-lg", "text-sm", "font-semibold", "transition-all", "whitespace-nowrap", 3, "ngClass"], [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-xl", "font-bold", 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"], ["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, "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, "mb-6"], [1, "text-2xl", "font-bold", "mb-2", 3, "ngClass"], [3, "viewMode", "calculations", "pacingMetrics"]], template: function InitialTargetSettingComponent_Template(rf, ctx) { if (rf & 1) {
57115
+ } }, inputs: { viewMode: [1, "viewMode"], funnelMetrics: [1, "funnelMetrics"], mainUiData: [1, "mainUiData"], trendUiData: [1, "trendUiData"], shopId: [1, "shopId"], pacingMetrics: [1, "pacingMetrics"], dataResults: [1, "dataResults"], reverseCalculationResponse: [1, "reverseCalculationResponse"], targets: [1, "targets"] }, outputs: { targetsCreated: "targetsCreated", calculateRevenueRequest: "calculateRevenueRequest" }, decls: 43, vars: 37, 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-8"], [1, "grid", "lg:grid-cols-2", "gap-8"], [1, "flex", "flex-col", "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", "h-full", 3, "ngClass"], [1, "flex", "justify-center"], [1, "w-full"], [1, "metrics-section-enter"], [1, "metrics-section-content"], [1, "rounded-2xl", "border", "shadow-lg", "p-8", 3, "ngClass"], [3, "submitClick", "cancelClick", "viewMode", "isValid", "isSubmitting", "validationMessage", "buttonText", "showCancelButton"], ["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", "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, "flex", "items-center", "justify-between"], [1, "text-xs", "font-medium", "uppercase", "tracking-wider", "mb-1", 3, "ngClass"], [1, "text-3xl", "font-bold", 3, "ngClass"], [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-xl", "font-bold", 3, "ngClass"], [1, "mt-6", "flex", "justify-center"], [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"], ["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, "text-sm", "font-semibold", "transition-all", 3, "click", "ngClass"], [1, "mb-6"], [1, "text-2xl", "font-bold", "mb-2", 3, "ngClass"], [3, "viewMode", "calculations", "pacingMetrics"]], template: function InitialTargetSettingComponent_Template(rf, ctx) { if (rf & 1) {
57044
57116
  i0.ɵɵelementStart(0, "div", 2);
57045
57117
  i0.ɵɵelement(1, "symphiq-tooltip-container");
57046
- i0.ɵɵelementStart(2, "div", 3)(3, "h2", 4);
57047
- i0.ɵɵtext(4);
57118
+ i0.ɵɵelementStart(2, "div", 3);
57119
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Template_div_click_2_listener() { return ctx.onCardClick(); });
57120
+ i0.ɵɵelementStart(3, "div", 4)(4, "h2", 5);
57121
+ i0.ɵɵconditionalCreate(5, InitialTargetSettingComponent_Conditional_5_Template, 1, 1)(6, InitialTargetSettingComponent_Conditional_6_Template, 1, 1);
57122
+ i0.ɵɵelementEnd();
57123
+ i0.ɵɵconditionalCreate(7, InitialTargetSettingComponent_Conditional_7_Template, 2, 3, ":svg:svg", 6);
57048
57124
  i0.ɵɵelementEnd();
57049
- i0.ɵɵelementStart(5, "div", 5)(6, "div", 6)(7, "div", 7)(8, "div", 8)(9, "div", 9)(10, "div", 10);
57125
+ i0.ɵɵelementStart(8, "div", 7)(9, "div", 8)(10, "div", 9)(11, "div", 10);
57126
+ i0.ɵɵlistener("click", function InitialTargetSettingComponent_Template_div_click_11_listener($event) { return $event.stopPropagation(); });
57127
+ i0.ɵɵelementStart(12, "div", 11)(13, "div", 12);
57050
57128
  i0.ɵɵnamespaceSVG();
57051
- i0.ɵɵelementStart(11, "svg", 11);
57052
- i0.ɵɵelement(12, "path", 12);
57129
+ i0.ɵɵelementStart(14, "svg", 13);
57130
+ i0.ɵɵelement(15, "path", 14);
57053
57131
  i0.ɵɵelementEnd();
57054
57132
  i0.ɵɵnamespaceHTML();
57055
- i0.ɵɵelementStart(13, "div")(14, "p", 13);
57056
- i0.ɵɵtext(15);
57133
+ i0.ɵɵelementStart(16, "div")(17, "p", 15);
57134
+ i0.ɵɵtext(18);
57057
57135
  i0.ɵɵelementEnd();
57058
- i0.ɵɵelementStart(16, "p", 14);
57059
- i0.ɵɵtext(17);
57136
+ i0.ɵɵelementStart(19, "p", 16);
57137
+ i0.ɵɵtext(20);
57060
57138
  i0.ɵɵelementEnd()()();
57061
- i0.ɵɵconditionalCreate(18, InitialTargetSettingComponent_Conditional_18_Template, 8, 4, "div", 10);
57139
+ i0.ɵɵconditionalCreate(21, InitialTargetSettingComponent_Conditional_21_Template, 8, 4, "div", 12);
57062
57140
  i0.ɵɵelementEnd();
57063
- i0.ɵɵelementStart(19, "div", 15)(20, "div", 16)(21, "div", 17);
57064
- i0.ɵɵconditionalCreate(22, InitialTargetSettingComponent_Conditional_22_Template, 8, 4);
57141
+ i0.ɵɵelementStart(22, "div", 17)(23, "div", 18)(24, "div", 19);
57142
+ i0.ɵɵconditionalCreate(25, InitialTargetSettingComponent_Conditional_25_Template, 8, 4);
57065
57143
  i0.ɵɵelementEnd()()()();
57066
- i0.ɵɵelementStart(23, "div", 18)(24, "div", 19)(25, "div")(26, "p", 20);
57067
- i0.ɵɵtext(27, " Year-over-Year Revenue Trend ");
57144
+ i0.ɵɵelementStart(26, "div", 20)(27, "div", 21)(28, "div")(29, "p", 22);
57145
+ i0.ɵɵtext(30, " Year-over-Year Revenue Trend ");
57068
57146
  i0.ɵɵelementEnd();
57069
- i0.ɵɵelementStart(28, "div", 21);
57070
- i0.ɵɵconditionalCreate(29, InitialTargetSettingComponent_Conditional_29_Template, 1, 5, "symphiq-area-chart", 22)(30, InitialTargetSettingComponent_Conditional_30_Template, 3, 1, "div", 23);
57147
+ i0.ɵɵelementStart(31, "div", 23);
57148
+ i0.ɵɵconditionalCreate(32, InitialTargetSettingComponent_Conditional_32_Template, 1, 5, "symphiq-area-chart", 24)(33, InitialTargetSettingComponent_Conditional_33_Template, 3, 1, "div", 25);
57071
57149
  i0.ɵɵelementEnd()()()()();
57072
- i0.ɵɵelementStart(31, "div", 24)(32, "div", 25);
57073
- i0.ɵɵconditionalCreate(33, InitialTargetSettingComponent_Conditional_33_Template, 28, 17, "div", 26);
57150
+ i0.ɵɵelementStart(34, "div", 26)(35, "div", 27);
57151
+ i0.ɵɵconditionalCreate(36, InitialTargetSettingComponent_Conditional_36_Template, 31, 22, "div", 28);
57074
57152
  i0.ɵɵelementEnd()()();
57075
- i0.ɵɵconditionalCreate(34, InitialTargetSettingComponent_Conditional_34_Template, 6, 3, "div", 27);
57153
+ i0.ɵɵconditionalCreate(37, InitialTargetSettingComponent_Conditional_37_Template, 3, 1, "div", 29);
57154
+ i0.ɵɵconditionalCreate(38, InitialTargetSettingComponent_Conditional_38_Template, 6, 3, "div", 30);
57076
57155
  i0.ɵɵelementEnd()();
57077
- i0.ɵɵelementStart(35, "div", 28)(36, "div", 29);
57078
- i0.ɵɵconditionalCreate(37, InitialTargetSettingComponent_Conditional_37_Template, 7, 7, "div", 3);
57156
+ i0.ɵɵelementStart(39, "div", 31)(40, "div", 32);
57157
+ i0.ɵɵconditionalCreate(41, InitialTargetSettingComponent_Conditional_41_Template, 7, 7, "div", 33);
57079
57158
  i0.ɵɵelementEnd()();
57080
- i0.ɵɵelementStart(38, "symphiq-sticky-submit-bar", 30);
57081
- i0.ɵɵlistener("submitClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_submitClick_38_listener() { return ctx.handleSubmitClick(); })("cancelClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_cancelClick_38_listener() { return ctx.handleCancel(); });
57159
+ i0.ɵɵelementStart(42, "symphiq-sticky-submit-bar", 34);
57160
+ i0.ɵɵlistener("submitClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_submitClick_42_listener() { return ctx.handleSubmitClick(); })("cancelClick", function InitialTargetSettingComponent_Template_symphiq_sticky_submit_bar_cancelClick_42_listener() { return ctx.handleCancel(); });
57082
57161
  i0.ɵɵelementEnd()();
57083
57162
  } if (rf & 2) {
57084
57163
  i0.ɵɵadvance(2);
57164
+ i0.ɵɵclassProp("cursor-pointer", ctx.calculationState() === "results");
57085
57165
  i0.ɵɵproperty("ngClass", ctx.sectionCardClasses());
57086
- i0.ɵɵadvance();
57166
+ i0.ɵɵadvance(2);
57087
57167
  i0.ɵɵproperty("ngClass", ctx.sectionTitleClasses());
57088
57168
  i0.ɵɵadvance();
57089
- i0.ɵɵtextInterpolate1(" Calculate Your ", ctx.currentYear(), " Revenue Target ");
57169
+ i0.ɵɵconditional(ctx.calculationState() === "results" ? 5 : 6);
57170
+ i0.ɵɵadvance(2);
57171
+ i0.ɵɵconditional(ctx.calculationState() === "results" ? 7 : -1);
57090
57172
  i0.ɵɵadvance(4);
57091
57173
  i0.ɵɵproperty("ngClass", ctx.formAreaClasses());
57092
57174
  i0.ɵɵadvance();
@@ -57102,36 +57184,38 @@ class InitialTargetSettingComponent {
57102
57184
  i0.ɵɵadvance();
57103
57185
  i0.ɵɵtextInterpolate1(" ", ctx.formatCurrency(ctx.priorYearRevenue()), " ");
57104
57186
  i0.ɵɵadvance();
57105
- i0.ɵɵconditional(ctx.currentPaceProjection() > 0 ? 18 : -1);
57187
+ i0.ɵɵconditional(ctx.currentPaceProjection() > 0 ? 21 : -1);
57106
57188
  i0.ɵɵadvance();
57107
57189
  i0.ɵɵclassProp("form-area-collapse-hidden", ctx.calculationState() === "results");
57108
57190
  i0.ɵɵadvance(3);
57109
- i0.ɵɵconditional(ctx.calculationState() !== "results" ? 22 : -1);
57191
+ i0.ɵɵconditional(ctx.calculationState() !== "results" ? 25 : -1);
57110
57192
  i0.ɵɵadvance();
57111
- i0.ɵɵclassProp("chart-in-column-active", ctx.calculationState() === "results");
57193
+ i0.ɵɵclassProp("chart-in-column-active", ctx.calculationState() === "results" && ctx.detailsExpanded());
57112
57194
  i0.ɵɵadvance(3);
57113
57195
  i0.ɵɵproperty("ngClass", ctx.chartTitleClasses());
57114
57196
  i0.ɵɵadvance(2);
57115
57197
  i0.ɵɵproperty("ngClass", ctx.chartContainerClasses());
57116
57198
  i0.ɵɵadvance();
57117
- i0.ɵɵconditional(ctx.revenueChartData() ? 29 : 30);
57199
+ i0.ɵɵconditional(ctx.revenueChartData() ? 32 : 33);
57118
57200
  i0.ɵɵadvance(2);
57119
57201
  i0.ɵɵclassProp("calculated-card-enter-active", ctx.calculatedRevenue() > 0);
57120
57202
  i0.ɵɵadvance(2);
57121
- i0.ɵɵconditional(ctx.calculatedRevenue() > 0 ? 33 : -1);
57203
+ i0.ɵɵconditional(ctx.calculatedRevenue() > 0 ? 36 : -1);
57204
+ i0.ɵɵadvance();
57205
+ i0.ɵɵconditional(ctx.calculationState() === "results" && !ctx.detailsExpanded() ? 37 : -1);
57122
57206
  i0.ɵɵadvance();
57123
- i0.ɵɵconditional(ctx.calculationState() !== "results" ? 34 : -1);
57207
+ i0.ɵɵconditional(ctx.calculationState() !== "results" ? 38 : -1);
57124
57208
  i0.ɵɵadvance();
57125
57209
  i0.ɵɵclassProp("metrics-section-enter-active", ctx.showMetricsVisualization());
57126
57210
  i0.ɵɵadvance(2);
57127
- i0.ɵɵconditional(ctx.showMetricsVisualization() ? 37 : -1);
57211
+ i0.ɵɵconditional(ctx.showMetricsVisualization() ? 41 : -1);
57128
57212
  i0.ɵɵadvance();
57129
57213
  i0.ɵɵproperty("viewMode", ctx.viewMode())("isValid", ctx.isValid())("isSubmitting", ctx.isCalculating())("validationMessage", ctx.validationMessage())("buttonText", ctx.submitButtonText())("showCancelButton", ctx.calculationState() === "input" && ctx.hasStoredResponse());
57130
57214
  } }, dependencies: [CommonModule, i1$1.NgClass, FormsModule, i2$1.DefaultValueAccessor, i2$1.NumberValueAccessor, i2$1.NgControlStatus, i2$1.MinValidator, i2$1.MaxValidator, i2$1.NgModel, FunnelMetricsVisualizationComponent,
57131
57215
  StickySubmitBarComponent,
57132
57216
  AreaChartComponent,
57133
57217
  TooltipDirective,
57134
- TooltipContainerComponent], styles: [".calculated-card-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.calculated-card-content[_ngcontent-%COMP%]{overflow:hidden}.form-area-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.form-area-content[_ngcontent-%COMP%]{overflow:hidden}.chart-section-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.chart-section-content[_ngcontent-%COMP%]{overflow:hidden}.chart-in-column[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.chart-in-column-content[_ngcontent-%COMP%]{overflow:hidden}.metrics-section-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.metrics-section-content[_ngcontent-%COMP%]{overflow:hidden}"], changeDetection: 0 }); }
57218
+ TooltipContainerComponent], styles: [".calculated-card-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.calculated-card-content[_ngcontent-%COMP%]{overflow:hidden}.form-area-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.form-area-content[_ngcontent-%COMP%]{overflow:hidden}.chart-section-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden[_ngcontent-%COMP%]{grid-template-rows:0fr}.chart-section-content[_ngcontent-%COMP%]{overflow:hidden}.chart-in-column[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.chart-in-column-content[_ngcontent-%COMP%]{overflow:hidden}.metrics-section-enter[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active[_ngcontent-%COMP%]{grid-template-rows:1fr}.metrics-section-content[_ngcontent-%COMP%]{overflow:hidden}.details-collapse[_ngcontent-%COMP%]{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.details-collapse-expanded[_ngcontent-%COMP%]{grid-template-rows:1fr}.details-collapse-content[_ngcontent-%COMP%]{overflow:hidden}.chevron-rotate[_ngcontent-%COMP%]{transition:transform .3s ease-out}.chevron-rotate-expanded[_ngcontent-%COMP%]{transform:rotate(180deg)}"], changeDetection: 0 }); }
57135
57219
  }
57136
57220
  (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(InitialTargetSettingComponent, [{
57137
57221
  type: Component,
@@ -57146,15 +57230,34 @@ class InitialTargetSettingComponent {
57146
57230
  ], changeDetection: ChangeDetectionStrategy.OnPush, template: `
57147
57231
  <div class="space-y-8 pb-32">
57148
57232
  <symphiq-tooltip-container />
57149
- <div [ngClass]="sectionCardClasses()" class="rounded-2xl border shadow-lg p-8">
57150
- <h2 [ngClass]="sectionTitleClasses()" class="text-2xl font-bold mb-6">
57151
- Calculate Your {{ currentYear() }} Revenue Target
57152
- </h2>
57233
+ <div [ngClass]="sectionCardClasses()" class="rounded-2xl border shadow-lg p-8"
57234
+ [class.cursor-pointer]="calculationState() === 'results'"
57235
+ (click)="onCardClick()">
57236
+ <div class="flex items-center justify-between mb-6">
57237
+ <h2 [ngClass]="sectionTitleClasses()" class="text-2xl font-bold">
57238
+ @if (calculationState() === 'results') {
57239
+ Your {{ currentYear() }} Revenue Target
57240
+ } @else {
57241
+ Calculate Your {{ currentYear() }} Revenue Target
57242
+ }
57243
+ </h2>
57244
+ @if (calculationState() === 'results') {
57245
+ <svg
57246
+ class="w-6 h-6 chevron-rotate"
57247
+ [class.chevron-rotate-expanded]="detailsExpanded()"
57248
+ [ngClass]="chevronClasses()"
57249
+ fill="none"
57250
+ stroke="currentColor"
57251
+ viewBox="0 0 24 24">
57252
+ <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
57253
+ </svg>
57254
+ }
57255
+ </div>
57153
57256
 
57154
57257
  <div class="flex flex-col gap-8">
57155
57258
  <div class="grid lg:grid-cols-2 gap-8">
57156
57259
  <div class="flex flex-col gap-4">
57157
- <div [ngClass]="formAreaClasses()" class="p-6 rounded-xl border-2">
57260
+ <div [ngClass]="formAreaClasses()" class="p-6 rounded-xl border-2" (click)="$event.stopPropagation()">
57158
57261
  <div class="flex flex-wrap gap-4 place-content-between" [class.mb-6]="calculationState() !== 'results'">
57159
57262
  <div class="flex items-center gap-2">
57160
57263
  <svg class="w-4 h-4" [ngClass]="baselineIconClasses()" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -57256,7 +57359,7 @@ class InitialTargetSettingComponent {
57256
57359
  </div>
57257
57360
  </div>
57258
57361
 
57259
- <div class="chart-in-column" [class.chart-in-column-active]="calculationState() === 'results'">
57362
+ <div class="chart-in-column" [class.chart-in-column-active]="calculationState() === 'results' && detailsExpanded()">
57260
57363
  <div class="chart-in-column-content">
57261
57364
  <div>
57262
57365
  <p [ngClass]="chartTitleClasses()" class="text-sm font-semibold mb-3">
@@ -57288,7 +57391,7 @@ class InitialTargetSettingComponent {
57288
57391
  <div class="calculated-card-content">
57289
57392
  @if (calculatedRevenue() > 0) {
57290
57393
  <div [ngClass]="calculatedValuesCardClasses()" class="p-6 rounded-xl border-2 h-full">
57291
- <div class="space-y-6">
57394
+ <div [class.space-y-6]="calculationState() !== 'results' || detailsExpanded()">
57292
57395
  <div class="flex items-center justify-between">
57293
57396
  <div>
57294
57397
  <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
@@ -57304,7 +57407,7 @@ class InitialTargetSettingComponent {
57304
57407
  </div>
57305
57408
  @if (calculationState() === 'results' && targets() === undefined) {
57306
57409
  <button
57307
- (click)="handleAdjustTarget()"
57410
+ (click)="handleAdjustTarget(); $event.stopPropagation()"
57308
57411
  [ngClass]="secondaryButtonClasses()"
57309
57412
  class="px-4 py-2 rounded-lg text-sm font-semibold transition-all whitespace-nowrap">
57310
57413
  Adjust Revenue Target
@@ -57312,76 +57415,92 @@ class InitialTargetSettingComponent {
57312
57415
  }
57313
57416
  </div>
57314
57417
 
57315
- <div class="relative pt-6 mt-6">
57316
- <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
57317
- <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57318
- <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
57319
- vs. {{ priorYear() }}
57320
- </span>
57321
- <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57322
- </div>
57323
- <div class="grid grid-cols-2 gap-4 pt-2">
57324
- <div>
57325
- <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
57326
- Increase Amount
57327
- </p>
57328
- <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57329
- {{ formatCurrency(calculatedRevenue() - priorYearRevenue()) }}
57330
- </p>
57331
- </div>
57332
- <div>
57333
- <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
57334
- % Growth
57335
- </p>
57336
- <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57337
- +{{ formatPercentage(percentageIncrease(), 1) }}
57338
- </p>
57339
- </div>
57340
- </div>
57341
- </div>
57342
-
57343
- @if (currentPaceProjection() > 0 && gapToClose().amount !== 0) {
57344
- <div class="relative pt-6 mt-6">
57345
- <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
57346
- <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57347
- <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
57348
- {{ currentYear() }} YTD Gap
57349
- </span>
57350
- <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57351
- </div>
57352
- <div class="grid grid-cols-2 gap-4 pt-2">
57353
- <div>
57354
- <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
57355
- Gap to Close
57356
- </p>
57357
- <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57358
- {{ formatCurrency(absValue(gapToClose().amount)) }}
57359
- </p>
57418
+ <div class="details-collapse" [class.details-collapse-expanded]="calculationState() !== 'results' || detailsExpanded()">
57419
+ <div class="details-collapse-content">
57420
+ <div class="relative pt-6 mt-6">
57421
+ <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
57422
+ <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57423
+ <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
57424
+ vs. {{ priorYear() }}
57425
+ </span>
57426
+ <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57360
57427
  </div>
57361
- <div>
57362
- <div class="flex items-center gap-1 mb-1">
57363
- <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider">
57364
- Additional Growth Needed
57428
+ <div class="grid grid-cols-2 gap-4 pt-2">
57429
+ <div>
57430
+ <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
57431
+ Increase Amount
57432
+ </p>
57433
+ <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57434
+ {{ formatCurrency(calculatedRevenue() - priorYearRevenue()) }}
57435
+ </p>
57436
+ </div>
57437
+ <div>
57438
+ <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
57439
+ % Growth
57440
+ </p>
57441
+ <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57442
+ +{{ formatPercentage(percentageIncrease(), 1) }}
57365
57443
  </p>
57366
- <button
57367
- type="button"
57368
- [ngClass]="infoIconClasses()"
57369
- class="flex-shrink-0 w-4 h-4 rounded-full inline-flex items-center justify-center transition-colors"
57370
- [libSymphiqTooltip]="additionalGrowthTooltip"
57371
- tooltipType="markdown"
57372
- tooltipPosition="top">
57373
- <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
57374
- <path 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" />
57375
- </svg>
57376
- </button>
57377
57444
  </div>
57378
- <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57379
- {{ gapToClose().amount > 0 ? '+' : '' }}{{ formatPercentage(gapToClose().percentage, 1) }}
57380
- </p>
57381
57445
  </div>
57382
57446
  </div>
57447
+
57448
+ @if (currentPaceProjection() > 0 && gapToClose().amount !== 0) {
57449
+ <div class="relative pt-6 mt-6">
57450
+ <div class="absolute top-0 left-0 right-0 flex items-center -translate-y-1/2">
57451
+ <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57452
+ <span [ngClass]="dividerLabelClasses()" class="px-3 py-1 rounded-full text-xs font-semibold whitespace-nowrap">
57453
+ {{ currentYear() }} YTD Gap
57454
+ </span>
57455
+ <div class="flex-1 h-px" [ngClass]="dividerBorderClasses()"></div>
57456
+ </div>
57457
+ <div class="grid grid-cols-2 gap-4 pt-2">
57458
+ <div>
57459
+ <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider mb-1">
57460
+ Gap to Close
57461
+ </p>
57462
+ <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57463
+ {{ formatCurrency(absValue(gapToClose().amount)) }}
57464
+ </p>
57465
+ </div>
57466
+ <div>
57467
+ <div class="flex items-center gap-1 mb-1">
57468
+ <p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider">
57469
+ Additional Growth Needed
57470
+ </p>
57471
+ <button
57472
+ type="button"
57473
+ [ngClass]="infoIconClasses()"
57474
+ class="flex-shrink-0 w-4 h-4 rounded-full inline-flex items-center justify-center transition-colors"
57475
+ [libSymphiqTooltip]="additionalGrowthTooltip"
57476
+ tooltipType="markdown"
57477
+ tooltipPosition="top"
57478
+ (click)="$event.stopPropagation()">
57479
+ <svg class="w-3 h-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
57480
+ <path 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" />
57481
+ </svg>
57482
+ </button>
57483
+ </div>
57484
+ <p [ngClass]="calculatedSecondaryClasses()" class="text-xl font-bold">
57485
+ {{ gapToClose().amount > 0 ? '+' : '' }}{{ formatPercentage(gapToClose().percentage, 1) }}
57486
+ </p>
57487
+ </div>
57488
+ </div>
57489
+ </div>
57490
+ }
57491
+
57492
+ @if (calculationState() === 'results' && detailsExpanded()) {
57493
+ <div class="mt-6 flex justify-center">
57494
+ <button
57495
+ (click)="toggleDetails(); $event.stopPropagation()"
57496
+ [ngClass]="learnMoreButtonClasses()"
57497
+ class="text-sm font-semibold transition-all">
57498
+ Show Less
57499
+ </button>
57500
+ </div>
57501
+ }
57383
57502
  </div>
57384
- }
57503
+ </div>
57385
57504
  </div>
57386
57505
  </div>
57387
57506
  }
@@ -57389,6 +57508,17 @@ class InitialTargetSettingComponent {
57389
57508
  </div>
57390
57509
  </div>
57391
57510
 
57511
+ @if (calculationState() === 'results' && !detailsExpanded()) {
57512
+ <div class="flex justify-center">
57513
+ <button
57514
+ (click)="toggleDetails(); $event.stopPropagation()"
57515
+ [ngClass]="learnMoreButtonClasses()"
57516
+ class="text-sm font-semibold transition-all">
57517
+ Learn More
57518
+ </button>
57519
+ </div>
57520
+ }
57521
+
57392
57522
  @if (calculationState() !== 'results') {
57393
57523
  <div class="w-full">
57394
57524
  <p [ngClass]="chartTitleClasses()" class="text-sm font-semibold mb-3">
@@ -57450,7 +57580,7 @@ class InitialTargetSettingComponent {
57450
57580
  (cancelClick)="handleCancel()"
57451
57581
  />
57452
57582
  </div>
57453
- `, styles: [".calculated-card-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active{grid-template-rows:1fr}.calculated-card-content{overflow:hidden}.form-area-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden{grid-template-rows:0fr}.form-area-content{overflow:hidden}.chart-section-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden{grid-template-rows:0fr}.chart-section-content{overflow:hidden}.chart-in-column{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active{grid-template-rows:1fr}.chart-in-column-content{overflow:hidden}.metrics-section-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active{grid-template-rows:1fr}.metrics-section-content{overflow:hidden}\n"] }]
57583
+ `, styles: [".calculated-card-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s ease-out}.calculated-card-enter-active{grid-template-rows:1fr}.calculated-card-content{overflow:hidden}.form-area-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.form-area-collapse-hidden{grid-template-rows:0fr}.form-area-content{overflow:hidden}.chart-section-collapse{display:grid;grid-template-rows:1fr;transition:grid-template-rows .4s ease-out}.chart-section-collapse-hidden{grid-template-rows:0fr}.chart-section-content{overflow:hidden}.chart-in-column{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.chart-in-column-active{grid-template-rows:1fr}.chart-in-column-content{overflow:hidden}.metrics-section-enter{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s ease-out}.metrics-section-enter-active{grid-template-rows:1fr}.metrics-section-content{overflow:hidden}.details-collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease-out}.details-collapse-expanded{grid-template-rows:1fr}.details-collapse-content{overflow:hidden}.chevron-rotate{transition:transform .3s ease-out}.chevron-rotate-expanded{transform:rotate(180deg)}\n"] }]
57454
57584
  }], () => [], { absoluteInputRef: [{
57455
57585
  type: ViewChild,
57456
57586
  args: ['absoluteInputRef']
@@ -57458,7 +57588,7 @@ class InitialTargetSettingComponent {
57458
57588
  type: ViewChild,
57459
57589
  args: ['percentageInputRef']
57460
57590
  }], 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 }] }], reverseCalculationResponse: [{ type: i0.Input, args: [{ isSignal: true, alias: "reverseCalculationResponse", required: false }] }], targets: [{ type: i0.Input, args: [{ isSignal: true, alias: "targets", required: false }] }], targetsCreated: [{ type: i0.Output, args: ["targetsCreated"] }], calculateRevenueRequest: [{ type: i0.Output, args: ["calculateRevenueRequest"] }] }); })();
57461
- (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InitialTargetSettingComponent, { className: "InitialTargetSettingComponent", filePath: "lib/components/revenue-calculator-dashboard/initial-target-setting.component.ts", lineNumber: 433 }); })();
57591
+ (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(InitialTargetSettingComponent, { className: "InitialTargetSettingComponent", filePath: "lib/components/revenue-calculator-dashboard/initial-target-setting.component.ts", lineNumber: 501 }); })();
57462
57592
 
57463
57593
  function IndeterminateSpinnerComponent_For_5_Template(rf, ctx) { if (rf & 1) {
57464
57594
  i0.ɵɵelement(0, "div", 5);