@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.
- package/fesm2022/symphiq-components.mjs +320 -190
- package/fesm2022/symphiq-components.mjs.map +1 -1
- package/package.json +1 -1
- package/styles.css +14 -0
|
@@ -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
|
|
56266
|
-
i0.ɵɵ
|
|
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(
|
|
56269
|
-
i0.ɵɵelement(
|
|
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",
|
|
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",
|
|
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
|
|
56311
|
+
function InitialTargetSettingComponent_Conditional_25_Conditional_5_Template(rf, ctx) { if (rf & 1) {
|
|
56290
56312
|
const _r3 = i0.ɵɵgetCurrentView();
|
|
56291
|
-
i0.ɵɵelementStart(0, "div",
|
|
56313
|
+
i0.ɵɵelementStart(0, "div", 40)(1, "span", 42);
|
|
56292
56314
|
i0.ɵɵtext(2, " $ ");
|
|
56293
56315
|
i0.ɵɵelementEnd();
|
|
56294
|
-
i0.ɵɵelementStart(3, "input",
|
|
56295
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
56296
|
-
i0.ɵɵlistener("ngModelChange", function
|
|
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
|
|
56328
|
+
function InitialTargetSettingComponent_Conditional_25_Conditional_6_Template(rf, ctx) { if (rf & 1) {
|
|
56307
56329
|
const _r4 = i0.ɵɵgetCurrentView();
|
|
56308
|
-
i0.ɵɵelementStart(0, "div",
|
|
56309
|
-
i0.ɵɵtwoWayListener("ngModelChange", function
|
|
56310
|
-
i0.ɵɵlistener("ngModelChange", function
|
|
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",
|
|
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
|
|
56345
|
+
function InitialTargetSettingComponent_Conditional_25_Conditional_7_Template(rf, ctx) { if (rf & 1) {
|
|
56324
56346
|
const _r5 = i0.ɵɵgetCurrentView();
|
|
56325
|
-
i0.ɵɵelementStart(0, "div",
|
|
56326
|
-
i0.ɵɵlistener("click", function
|
|
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
|
|
56356
|
+
function InitialTargetSettingComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
|
|
56335
56357
|
const _r2 = i0.ɵɵgetCurrentView();
|
|
56336
|
-
i0.ɵɵelementStart(0, "div",
|
|
56337
|
-
i0.ɵɵlistener("click", function
|
|
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",
|
|
56341
|
-
i0.ɵɵlistener("click", function
|
|
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,
|
|
56345
|
-
i0.ɵɵconditionalCreate(7,
|
|
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
|
|
56358
|
-
i0.ɵɵelement(0, "symphiq-area-chart",
|
|
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
|
|
56364
|
-
i0.ɵɵelementStart(0, "div",
|
|
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
|
|
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
|
|
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
|
|
56406
|
+
function InitialTargetSettingComponent_Conditional_36_Conditional_9_Template(rf, ctx) { if (rf & 1) {
|
|
56385
56407
|
const _r6 = i0.ɵɵgetCurrentView();
|
|
56386
|
-
i0.ɵɵelementStart(0, "button",
|
|
56387
|
-
i0.ɵɵlistener("click", function
|
|
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
|
|
56395
|
-
i0.ɵɵ
|
|
56396
|
-
i0.ɵɵ
|
|
56397
|
-
i0.ɵɵ
|
|
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",
|
|
56423
|
+
i0.ɵɵelement(5, "div", 56);
|
|
56401
56424
|
i0.ɵɵelementEnd();
|
|
56402
|
-
i0.ɵɵelementStart(6, "div",
|
|
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",
|
|
56428
|
+
i0.ɵɵelementStart(10, "p", 59);
|
|
56406
56429
|
i0.ɵɵtext(11);
|
|
56407
56430
|
i0.ɵɵelementEnd()();
|
|
56408
|
-
i0.ɵɵelementStart(12, "div")(13, "div",
|
|
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",
|
|
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",
|
|
56414
|
-
i0.ɵɵelement(18, "path",
|
|
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",
|
|
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
|
|
56446
|
-
|
|
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",
|
|
56450
|
-
i0.ɵɵconditionalCreate(7,
|
|
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,
|
|
56487
|
+
i0.ɵɵconditionalCreate(9, InitialTargetSettingComponent_Conditional_36_Conditional_9_Template, 2, 1, "button", 51);
|
|
56453
56488
|
i0.ɵɵelementEnd();
|
|
56454
|
-
i0.ɵɵelementStart(10, "div",
|
|
56455
|
-
i0.ɵɵelement(
|
|
56456
|
-
i0.ɵɵelementStart(
|
|
56457
|
-
i0.ɵɵtext(
|
|
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(
|
|
56494
|
+
i0.ɵɵelement(17, "div", 56);
|
|
56460
56495
|
i0.ɵɵelementEnd();
|
|
56461
|
-
i0.ɵɵelementStart(
|
|
56462
|
-
i0.ɵɵtext(
|
|
56496
|
+
i0.ɵɵelementStart(18, "div", 58)(19, "div")(20, "p", 49);
|
|
56497
|
+
i0.ɵɵtext(21, " Increase Amount ");
|
|
56463
56498
|
i0.ɵɵelementEnd();
|
|
56464
|
-
i0.ɵɵelementStart(
|
|
56465
|
-
i0.ɵɵtext(
|
|
56499
|
+
i0.ɵɵelementStart(22, "p", 59);
|
|
56500
|
+
i0.ɵɵtext(23);
|
|
56466
56501
|
i0.ɵɵelementEnd()();
|
|
56467
|
-
i0.ɵɵelementStart(
|
|
56468
|
-
i0.ɵɵtext(
|
|
56502
|
+
i0.ɵɵelementStart(24, "div")(25, "p", 49);
|
|
56503
|
+
i0.ɵɵtext(26, " % Growth ");
|
|
56469
56504
|
i0.ɵɵelementEnd();
|
|
56470
|
-
i0.ɵɵelementStart(
|
|
56471
|
-
i0.ɵɵtext(
|
|
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(
|
|
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(
|
|
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 ?
|
|
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
|
|
56512
|
-
i0.ɵɵ
|
|
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
|
|
56518
|
-
i0.ɵɵelementStart(0, "div",
|
|
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
|
|
56527
|
-
i0.ɵɵelementStart(0, "div",
|
|
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",
|
|
56531
|
-
i0.ɵɵconditionalCreate(4,
|
|
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
|
|
56543
|
-
i0.ɵɵelementStart(0, "div",
|
|
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",
|
|
56599
|
+
i0.ɵɵelementStart(4, "p", 47);
|
|
56547
56600
|
i0.ɵɵtext(5);
|
|
56548
56601
|
i0.ɵɵelementEnd()();
|
|
56549
|
-
i0.ɵɵelement(6, "symphiq-funnel-metrics-visualization",
|
|
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:
|
|
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)
|
|
57047
|
-
i0.ɵɵ
|
|
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(
|
|
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(
|
|
57052
|
-
i0.ɵɵelement(
|
|
57129
|
+
i0.ɵɵelementStart(14, "svg", 13);
|
|
57130
|
+
i0.ɵɵelement(15, "path", 14);
|
|
57053
57131
|
i0.ɵɵelementEnd();
|
|
57054
57132
|
i0.ɵɵnamespaceHTML();
|
|
57055
|
-
i0.ɵɵelementStart(
|
|
57056
|
-
i0.ɵɵtext(
|
|
57133
|
+
i0.ɵɵelementStart(16, "div")(17, "p", 15);
|
|
57134
|
+
i0.ɵɵtext(18);
|
|
57057
57135
|
i0.ɵɵelementEnd();
|
|
57058
|
-
i0.ɵɵelementStart(
|
|
57059
|
-
i0.ɵɵtext(
|
|
57136
|
+
i0.ɵɵelementStart(19, "p", 16);
|
|
57137
|
+
i0.ɵɵtext(20);
|
|
57060
57138
|
i0.ɵɵelementEnd()()();
|
|
57061
|
-
i0.ɵɵconditionalCreate(
|
|
57139
|
+
i0.ɵɵconditionalCreate(21, InitialTargetSettingComponent_Conditional_21_Template, 8, 4, "div", 12);
|
|
57062
57140
|
i0.ɵɵelementEnd();
|
|
57063
|
-
i0.ɵɵelementStart(
|
|
57064
|
-
i0.ɵɵconditionalCreate(
|
|
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(
|
|
57067
|
-
i0.ɵɵtext(
|
|
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(
|
|
57070
|
-
i0.ɵɵconditionalCreate(
|
|
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(
|
|
57073
|
-
i0.ɵɵconditionalCreate(
|
|
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(
|
|
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(
|
|
57078
|
-
i0.ɵɵconditionalCreate(
|
|
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(
|
|
57081
|
-
i0.ɵɵlistener("submitClick", function
|
|
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.ɵɵ
|
|
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 ?
|
|
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" ?
|
|
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() ?
|
|
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 ?
|
|
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" ?
|
|
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() ?
|
|
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
|
-
|
|
57151
|
-
|
|
57152
|
-
|
|
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
|
|
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="
|
|
57316
|
-
<div class="
|
|
57317
|
-
<div class="
|
|
57318
|
-
|
|
57319
|
-
|
|
57320
|
-
|
|
57321
|
-
|
|
57322
|
-
|
|
57323
|
-
|
|
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
|
|
57363
|
-
<p [ngClass]="calculatedLabelClasses()" class="text-xs font-medium uppercase tracking-wider">
|
|
57364
|
-
|
|
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:
|
|
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);
|