@datarailsshared/datarailsshared 1.6.97 → 1.6.101

package/fesm2022/datarailsshared-datarailsshared.mjs

@@ -1111,7 +1111,7 @@ function DrInputComponent_button_7_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtextInterpolate1(" ", ctx_r5._buttonOptions.text, "\n");
 } }
 const _c3$7 = [[["", "prefixIcon", ""]], [["", "suffixIcon", ""]]];
-const _c4$4 = ["[prefixIcon]", "[suffixIcon]"];
+const _c4$5 = ["[prefixIcon]", "[suffixIcon]"];
 class DrInputComponent {
     set disabled(value) {
         this.setDisabledState(value);
@@ -1296,7 +1296,7 @@ class DrInputComponent {
                     useExisting: forwardRef((() => DrInputComponent)),
                     multi: true,
                 },
-            ])], ngContentSelectors: _c4$4, decls: 8, vars: 5, consts: [[4, "ngIf", "ngIfElse"], ["maskedInput", ""], ["class", "clear-icon", 3, "click", 4, "ngIf"], ["class", "search-icon", 3, "click", 4, "ngIf"], [3, "click", 4, "ngIf"], [3, "ngModel", "disabled", "readonly", "type", "placeholder", "name", "min", "max", "minlength", "maxlength", "step", "ngModelChange", "ngModelDebounceChange", "blur", "focus"], ["inputRef", ""], [3, "ngModel", "disabled", "readonly", "type", "placeholder", "name", "min", "max", "minlength", "maxlength", "mask", "suffix", "prefix", "step", "ngModelChange", "ngModelDebounceChange", "blur", "focus"], [1, "clear-icon", 3, "click"], [1, "search-icon", 3, "click"], [3, "click"]], template: function DrInputComponent_Template(rf, ctx) { if (rf & 1) {
+            ])], ngContentSelectors: _c4$5, decls: 8, vars: 5, consts: [[4, "ngIf", "ngIfElse"], ["maskedInput", ""], ["class", "clear-icon", 3, "click", 4, "ngIf"], ["class", "search-icon", 3, "click", 4, "ngIf"], [3, "click", 4, "ngIf"], [3, "ngModel", "disabled", "readonly", "type", "placeholder", "name", "min", "max", "minlength", "maxlength", "step", "ngModelChange", "ngModelDebounceChange", "blur", "focus"], ["inputRef", ""], [3, "ngModel", "disabled", "readonly", "type", "placeholder", "name", "min", "max", "minlength", "maxlength", "mask", "suffix", "prefix", "step", "ngModelChange", "ngModelDebounceChange", "blur", "focus"], [1, "clear-icon", 3, "click"], [1, "search-icon", 3, "click"], [3, "click"]], template: function DrInputComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵprojectionDef(_c3$7);
             i0.ɵɵprojection(0);
             i0.ɵɵtemplate(1, DrInputComponent_ng_container_1_Template, 3, 12, "ng-container", 0);
@@ -1402,14 +1402,14 @@ const _c0$H = ["labelTemplate"];
 const _c1$i = ["multiLabelTemplate"];
 const _c2$8 = ["optionTemplate"];
 const _c3$6 = ["optionHeaderTemplate"];
-const _c4$3 = ["optionFooterTemplate"];
-const _c5$1 = function (a0) { return { item: a0 }; };
+const _c4$4 = ["optionFooterTemplate"];
+const _c5$2 = function (a0) { return { item: a0 }; };
 function DrSelectComponent_2_ng_template_0_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainer(0, 6);
 } if (rf & 2) {
     const item_r12 = ctx.item;
     const ctx_r11 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r11.optionHeaderTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c5$1, item_r12));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r11.optionHeaderTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c5$2, item_r12));
 } }
 function DrSelectComponent_2_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtemplate(0, DrSelectComponent_2_ng_template_0_Template, 1, 4, "ng-template", 5);
@@ -1432,7 +1432,7 @@ function DrSelectComponent_4_ng_template_0_Template(rf, ctx) { if (rf & 1) {
 } if (rf & 2) {
     const item_r18 = ctx.item;
     const ctx_r17 = i0.ɵɵnextContext(2);
-    i0.ɵɵproperty("ngTemplateOutlet", ctx_r17.labelTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c5$1, item_r18));
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r17.labelTemplate)("ngTemplateOutletContext", i0.ɵɵpureFunction1(2, _c5$2, item_r18));
 } }
 function DrSelectComponent_4_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵtemplate(0, DrSelectComponent_4_ng_template_0_Template, 1, 4, "ng-template", 8);
@@ -1644,7 +1644,7 @@ class DrSelectComponent {
             i0.ɵɵcontentQuery(dirIndex, _c1$i, 5);
             i0.ɵɵcontentQuery(dirIndex, _c2$8, 5);
             i0.ɵɵcontentQuery(dirIndex, _c3$6, 5);
-            i0.ɵɵcontentQuery(dirIndex, _c4$3, 5);
+            i0.ɵɵcontentQuery(dirIndex, _c4$4, 5);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.labelTemplate = _t.first);
@@ -5591,181 +5591,198 @@ class TooltipInfoComponent {
             type: Input
         }] }); })();
 
-const _c0$w = ["stepper"];
+const _c0$w = ["stepTextLabel"];
+const _c1$d = ["stepper"];
 function StepperComponent_div_0_Template(rf, ctx) { if (rf & 1) {
-    const _r9 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 6);
-    i0.ɵɵlistener("click", function StepperComponent_div_0_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r9); const ctx_r8 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r8.scrollLeft()); });
-    i0.ɵɵelement(1, "i", 7);
+    const _r11 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 7);
+    i0.ɵɵlistener("click", function StepperComponent_div_0_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r11); const ctx_r10 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r10.scrollLeft()); });
+    i0.ɵɵelement(1, "i", 8);
     i0.ɵɵelementEnd();
 } }
 function StepperComponent_ng_container_3_div_1_div_3_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 20);
+    i0.ɵɵelement(0, "div", 21);
 } }
 function StepperComponent_ng_container_3_div_1_ng_template_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 21);
-    i0.ɵɵelement(1, "i", 22);
+    i0.ɵɵelementStart(0, "div", 22);
+    i0.ɵɵelement(1, "i", 23);
     i0.ɵɵelementEnd();
 } }
-const _c1$d = function (a0) { return { "blue with-ellipse": a0 }; };
+const _c2$7 = function (a0) { return { "blue with-ellipse": a0 }; };
 function StepperComponent_ng_container_3_div_1_ng_template_6_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 23)(1, "div", 24);
+    i0.ɵɵelementStart(0, "div", 24)(1, "div", 25);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const ctx_r22 = i0.ɵɵnextContext(2);
-    const step_r10 = ctx_r22.$implicit;
-    const index_r11 = ctx_r22.index;
-    const ctx_r18 = i0.ɵɵnextContext();
-    i0.ɵɵclassProp("gray", step_r10 !== ctx_r18.currentStep);
-    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(5, _c1$d, step_r10 === ctx_r18.currentStep));
+    const ctx_r25 = i0.ɵɵnextContext(2);
+    const step_r12 = ctx_r25.$implicit;
+    const index_r13 = ctx_r25.index;
+    const ctx_r20 = i0.ɵɵnextContext();
+    i0.ɵɵclassProp("gray", step_r12 !== ctx_r20.currentStep);
+    i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(5, _c2$7, step_r12 === ctx_r20.currentStep));
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("hidden", step_r10 === ctx_r18.currentStep || ctx_r18.hiddenIndex);
+    i0.ɵɵproperty("hidden", step_r12 === ctx_r20.currentStep || ctx_r20.hiddenIndex);
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate(index_r11 + 1);
+    i0.ɵɵtextInterpolate(index_r13 + 1);
+} }
+function StepperComponent_ng_container_3_div_1_ng_container_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0);
 } }
-const _c2$7 = function (a0, a1, a2) { return { index: a0, isLast: a1, step: a2 }; };
-function StepperComponent_ng_container_3_div_1_ng_container_10_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 25);
+const _c3$5 = function (a0, a1, a2) { return { index: a0, isLast: a1, step: a2 }; };
+function StepperComponent_ng_container_3_div_1_ng_container_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0, 26);
 } if (rf & 2) {
-    const ctx_r23 = i0.ɵɵnextContext(2);
-    const index_r11 = ctx_r23.index;
-    const isLast_r12 = ctx_r23.last;
-    const step_r10 = ctx_r23.$implicit;
+    const ctx_r26 = i0.ɵɵnextContext(2);
+    const index_r13 = ctx_r26.index;
+    const isLast_r14 = ctx_r26.last;
+    const step_r12 = ctx_r26.$implicit;
     i0.ɵɵnextContext();
     const _r6 = i0.ɵɵreference(8);
-    i0.ɵɵproperty("ngTemplateOutlet", _r6)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c2$7, index_r11, isLast_r12, step_r10));
+    i0.ɵɵproperty("ngTemplateOutlet", _r6)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c3$5, index_r13, isLast_r14, step_r12));
 } }
-function StepperComponent_ng_container_3_div_1_span_11_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "span", 26);
+function StepperComponent_ng_container_3_div_1_span_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 27);
     i0.ɵɵtext(1);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const step_r10 = i0.ɵɵnextContext(2).$implicit;
+    const step_r12 = i0.ɵɵnextContext(2).$implicit;
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate1(" ", (step_r10.requiredTasks ? step_r10.completedTasks : step_r10.requiredTasks) + "/" + step_r10.requiredTasks, " ");
+    i0.ɵɵtextInterpolate1(" ", (step_r12.requiredTasks ? step_r12.completedTasks : step_r12.requiredTasks) + "/" + step_r12.requiredTasks, " ");
 } }
-function StepperComponent_ng_container_3_div_1_ng_container_12_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementContainer(0, 25);
+function StepperComponent_ng_container_3_div_1_ng_container_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementContainer(0, 26);
 } if (rf & 2) {
-    const ctx_r25 = i0.ɵɵnextContext(2);
-    const index_r11 = ctx_r25.index;
-    const isLast_r12 = ctx_r25.last;
-    const step_r10 = ctx_r25.$implicit;
+    const ctx_r28 = i0.ɵɵnextContext(2);
+    const index_r13 = ctx_r28.index;
+    const isLast_r14 = ctx_r28.last;
+    const step_r12 = ctx_r28.$implicit;
     i0.ɵɵnextContext();
     const _r6 = i0.ɵɵreference(8);
-    i0.ɵɵproperty("ngTemplateOutlet", _r6)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c2$7, index_r11, isLast_r12, step_r10));
+    i0.ɵɵproperty("ngTemplateOutlet", _r6)("ngTemplateOutletContext", i0.ɵɵpureFunction3(2, _c3$5, index_r13, isLast_r14, step_r12));
 } }
-const _c3$5 = function (a0) { return { step: a0 }; };
+const _c4$3 = function (a0) { return { step: a0 }; };
+const _c5$1 = function (a0, a1) { return { step: a0, index: a1 }; };
 function StepperComponent_ng_container_3_div_1_Template(rf, ctx) { if (rf & 1) {
-    const _r28 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 10);
-    i0.ɵɵlistener("click", function StepperComponent_ng_container_3_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r28); const step_r10 = i0.ɵɵnextContext().$implicit; const ctx_r26 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r26.selectStep(step_r10)); });
-    i0.ɵɵelementStart(1, "div", 11)(2, "div", 12);
-    i0.ɵɵtemplate(3, StepperComponent_ng_container_3_div_1_div_3_Template, 1, 0, "div", 13);
-    i0.ɵɵelementContainerStart(4, 14);
-    i0.ɵɵtemplate(5, StepperComponent_ng_container_3_div_1_ng_template_5_Template, 2, 0, "ng-template", 15);
-    i0.ɵɵtemplate(6, StepperComponent_ng_container_3_div_1_ng_template_6_Template, 3, 7, "ng-template", 15);
+    const _r31 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 11);
+    i0.ɵɵlistener("click", function StepperComponent_ng_container_3_div_1_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r31); const step_r12 = i0.ɵɵnextContext().$implicit; const ctx_r29 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r29.selectStep(step_r12)); });
+    i0.ɵɵelementStart(1, "div", 12)(2, "div", 13);
+    i0.ɵɵtemplate(3, StepperComponent_ng_container_3_div_1_div_3_Template, 1, 0, "div", 14);
+    i0.ɵɵelementContainerStart(4, 15);
+    i0.ɵɵtemplate(5, StepperComponent_ng_container_3_div_1_ng_template_5_Template, 2, 0, "ng-template", 16);
+    i0.ɵɵtemplate(6, StepperComponent_ng_container_3_div_1_ng_template_6_Template, 3, 7, "ng-template", 16);
     i0.ɵɵelementContainerEnd();
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(7, "div", 16)(8, "span", 17);
-    i0.ɵɵtext(9);
-    i0.ɵɵelementEnd()();
-    i0.ɵɵtemplate(10, StepperComponent_ng_container_3_div_1_ng_container_10_Template, 1, 6, "ng-container", 18);
-    i0.ɵɵtemplate(11, StepperComponent_ng_container_3_div_1_span_11_Template, 2, 1, "span", 19);
+    i0.ɵɵelementStart(7, "div", 17);
+    i0.ɵɵtemplate(8, StepperComponent_ng_container_3_div_1_ng_container_8_Template, 1, 0, "ng-container", 18);
     i0.ɵɵelementEnd();
-    i0.ɵɵtemplate(12, StepperComponent_ng_container_3_div_1_ng_container_12_Template, 1, 6, "ng-container", 18);
+    i0.ɵɵtemplate(9, StepperComponent_ng_container_3_div_1_ng_container_9_Template, 1, 6, "ng-container", 19);
+    i0.ɵɵtemplate(10, StepperComponent_ng_container_3_div_1_span_10_Template, 2, 1, "span", 20);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(11, StepperComponent_ng_container_3_div_1_ng_container_11_Template, 1, 6, "ng-container", 19);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const step_r10 = i0.ɵɵnextContext().$implicit;
-    const ctx_r14 = i0.ɵɵnextContext();
+    const ctx_r32 = i0.ɵɵnextContext();
+    const step_r12 = ctx_r32.$implicit;
+    const index_r13 = ctx_r32.index;
+    const ctx_r16 = i0.ɵɵnextContext();
     const _r4 = i0.ɵɵreference(6);
-    i0.ɵɵclassProp("step-setup", ctx_r14.inlineLabels);
-    i0.ɵɵattribute("data-analytics", ctx_r14.getDataAnalyticsTag(step_r10));
+    const _r8 = i0.ɵɵreference(10);
+    i0.ɵɵclassProp("step-setup", ctx_r16.inlineLabels);
+    i0.ɵɵattribute("data-analytics", ctx_r16.getDataAnalyticsTag(step_r12));
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("drTooltip", step_r10.description && _r4)("drTooltipContext", i0.ɵɵpureFunction1(22, _c3$5, step_r10))("drTooltipPosition", "bottom");
+    i0.ɵɵproperty("drTooltip", step_r12.description && _r4)("drTooltipContext", i0.ɵɵpureFunction1(22, _c4$3, step_r12))("drTooltipPosition", "bottom");
     i0.ɵɵadvance(1);
-    i0.ɵɵclassProp("active", ctx_r14.currentStep === step_r10)("completed", step_r10.completed);
+    i0.ɵɵclassProp("active", ctx_r16.currentStep === step_r12)("completed", step_r12.completed);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", step_r10 === ctx_r14.currentStep);
+    i0.ɵɵproperty("ngIf", step_r12 === ctx_r16.currentStep);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngSwitch", step_r10.completed);
+    i0.ɵɵproperty("ngSwitch", step_r12.completed);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngSwitchCase", true);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngSwitchCase", false);
     i0.ɵɵadvance(1);
-    i0.ɵɵclassProp("active", ctx_r14.currentStep === step_r10);
-    i0.ɵɵproperty("ngClass", step_r10.completed ? "completed" : "uncompleted");
-    i0.ɵɵadvance(1);
-    i0.ɵɵproperty("hidden", ctx_r14.hiddenNames);
+    i0.ɵɵclassProp("active", ctx_r16.currentStep === step_r12);
+    i0.ɵɵproperty("ngClass", step_r12.completed ? "completed" : "uncompleted");
     i0.ɵɵadvance(1);
-    i0.ɵɵtextInterpolate(step_r10.name);
+    i0.ɵɵproperty("ngTemplateOutlet", ctx_r16.stepTextLabelTemplate || _r8)("ngTemplateOutletContext", i0.ɵɵpureFunction2(24, _c5$1, step_r12, index_r13));
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", ctx_r14.inlineLabels);
+    i0.ɵɵproperty("ngIf", ctx_r16.inlineLabels);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", step_r10.showProgress);
+    i0.ɵɵproperty("ngIf", step_r12.showProgress);
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", !ctx_r14.inlineLabels);
+    i0.ɵɵproperty("ngIf", !ctx_r16.inlineLabels);
 } }
 function StepperComponent_ng_container_3_div_2_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelement(0, "div", 27);
+    i0.ɵɵelement(0, "div", 28);
 } }
 function StepperComponent_ng_container_3_Template(rf, ctx) { if (rf & 1) {
     i0.ɵɵelementContainerStart(0);
-    i0.ɵɵtemplate(1, StepperComponent_ng_container_3_div_1_Template, 13, 24, "div", 8);
-    i0.ɵɵtemplate(2, StepperComponent_ng_container_3_div_2_Template, 1, 0, "div", 9);
+    i0.ɵɵtemplate(1, StepperComponent_ng_container_3_div_1_Template, 12, 27, "div", 9);
+    i0.ɵɵtemplate(2, StepperComponent_ng_container_3_div_2_Template, 1, 0, "div", 10);
     i0.ɵɵelementContainerEnd();
 } if (rf & 2) {
-    const step_r10 = ctx.$implicit;
+    const step_r12 = ctx.$implicit;
     const ctx_r2 = i0.ɵɵnextContext();
     i0.ɵɵadvance(1);
-    i0.ɵɵproperty("ngIf", !step_r10.hide);
+    i0.ɵɵproperty("ngIf", !step_r12.hide);
     i0.ɵɵadvance(1);
     i0.ɵɵproperty("ngIf", ctx_r2.mini);
 } }
 function StepperComponent_div_4_Template(rf, ctx) { if (rf & 1) {
-    const _r31 = i0.ɵɵgetCurrentView();
-    i0.ɵɵelementStart(0, "div", 6);
-    i0.ɵɵlistener("click", function StepperComponent_div_4_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r31); const ctx_r30 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r30.scrollRight()); });
-    i0.ɵɵelement(1, "i", 7);
+    const _r34 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 7);
+    i0.ɵɵlistener("click", function StepperComponent_div_4_Template_div_click_0_listener() { i0.ɵɵrestoreView(_r34); const ctx_r33 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r33.scrollRight()); });
+    i0.ɵɵelement(1, "i", 8);
     i0.ɵɵelementEnd();
 } }
 function StepperComponent_ng_template_5_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 28)(1, "div", 29);
+    i0.ɵɵelementStart(0, "div", 29)(1, "div", 30);
     i0.ɵɵtext(2);
     i0.ɵɵelementEnd();
-    i0.ɵɵelementStart(3, "div", 30);
+    i0.ɵɵelementStart(3, "div", 31);
     i0.ɵɵtext(4);
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
-    const step_r32 = ctx.step;
+    const step_r35 = ctx.step;
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(step_r32.name);
+    i0.ɵɵtextInterpolate(step_r35.name);
     i0.ɵɵadvance(2);
-    i0.ɵɵtextInterpolate(step_r32.description);
+    i0.ɵɵtextInterpolate(step_r35.description);
 } }
 function StepperComponent_ng_template_7_div_0_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵelementStart(0, "div", 32);
-    i0.ɵɵelement(1, "div", 33);
+    i0.ɵɵelementStart(0, "div", 33);
+    i0.ɵɵelement(1, "div", 34);
     i0.ɵɵelementEnd();
 } if (rf & 2) {
-    const ctx_r37 = i0.ɵɵnextContext();
-    const step_r33 = ctx_r37.step;
-    const index_r35 = ctx_r37.index;
-    const ctx_r36 = i0.ɵɵnextContext();
-    i0.ɵɵclassMap("step-connector--" + (!ctx_r36.inlineLabels ? "absolute" : "inline"));
-    i0.ɵɵstyleProp("visibility", ctx_r36.withoutConnectors || (ctx_r36.steps[step_r33.index + 1] == null ? null : ctx_r36.steps[step_r33.index + 1].hide) ? "hidden" : "unset");
-    i0.ɵɵclassProp("only-one-step", ctx_r36.steps.length === 1)("connector-grand", !ctx_r36.inlineLabels && (index_r35 === 0 || index_r35 === ctx_r36.steps.length - 2));
+    const ctx_r40 = i0.ɵɵnextContext();
+    const step_r36 = ctx_r40.step;
+    const index_r38 = ctx_r40.index;
+    const ctx_r39 = i0.ɵɵnextContext();
+    i0.ɵɵclassMap("step-connector--" + (!ctx_r39.inlineLabels ? "absolute" : "inline"));
+    i0.ɵɵstyleProp("visibility", ctx_r39.withoutConnectors || (ctx_r39.steps[step_r36.index + 1] == null ? null : ctx_r39.steps[step_r36.index + 1].hide) ? "hidden" : "unset");
+    i0.ɵɵclassProp("only-one-step", ctx_r39.steps.length === 1)("connector-grand", !ctx_r39.inlineLabels && (index_r38 === 0 || index_r38 === ctx_r39.steps.length - 2));
     i0.ɵɵadvance(1);
-    i0.ɵɵstyleProp("width", ctx_r36.getWidth(step_r33));
+    i0.ɵɵstyleProp("width", ctx_r39.getWidth(step_r36));
 } }
 function StepperComponent_ng_template_7_Template(rf, ctx) { if (rf & 1) {
-    i0.ɵɵtemplate(0, StepperComponent_ng_template_7_div_0_Template, 2, 10, "div", 31);
+    i0.ɵɵtemplate(0, StepperComponent_ng_template_7_div_0_Template, 2, 10, "div", 32);
 } if (rf & 2) {
-    const isLast_r34 = ctx.isLast;
+    const isLast_r37 = ctx.isLast;
     const ctx_r7 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("ngIf", ctx_r7.steps.length === 1 || !isLast_r34);
+    i0.ɵɵproperty("ngIf", ctx_r7.steps.length === 1 || !isLast_r37);
+} }
+function StepperComponent_ng_template_9_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 35);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const step_r41 = ctx.step;
+    const ctx_r9 = i0.ɵɵnextContext();
+    i0.ɵɵproperty("hidden", ctx_r9.hiddenNames);
+    i0.ɵɵadvance(1);
+    i0.ɵɵtextInterpolate(step_r41.name);
 } }
 class StepperComponent {
     constructor() {
@@ -5804,12 +5821,17 @@ class StepperComponent {
         return this.dataAnalytics ? this.dataAnalytics + '_' + step.name?.toLowerCase().replace(/ /g, '-') : null;
     }
     /** @nocollapse */ static { this.ɵfac = function StepperComponent_Factory(t) { return new (t || StepperComponent)(); }; }
-    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: StepperComponent, selectors: [["dr-stepper"]], viewQuery: function StepperComponent_Query(rf, ctx) { if (rf & 1) {
-            i0.ɵɵviewQuery(_c0$w, 5, ElementRef);
+    /** @nocollapse */ static { this.ɵcmp = /** @pureOrBreakMyCode */ i0.ɵɵdefineComponent({ type: StepperComponent, selectors: [["dr-stepper"]], contentQueries: function StepperComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
+            i0.ɵɵcontentQuery(dirIndex, _c0$w, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.stepTextLabelTemplate = _t.first);
+        } }, viewQuery: function StepperComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c1$d, 5, ElementRef);
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.stepper = _t.first);
-        } }, inputs: { steps: "steps", currentStep: "currentStep", withoutConnectors: "withoutConnectors", hiddenNames: "hiddenNames", inlineLabels: "inlineLabels", disabled: "disabled", hiddenIndex: "hiddenIndex", mini: "mini", dataAnalytics: ["data-analytics", "dataAnalytics"] }, outputs: { stepChange: "stepChange" }, decls: 9, vars: 7, consts: [["class", "scroll-section", 3, "click", 4, "ngIf"], [1, "stepper"], ["stepper", ""], [4, "ngFor", "ngForOf"], ["tooltip", ""], ["connector", ""], [1, "scroll-section", 3, "click"], [1, "dr-icon-arrow-right"], ["class", "step", 3, "step-setup", "click", 4, "ngIf"], ["class", "stepper--mini-connector", 4, "ngIf"], [1, "step", 3, "click"], [1, "step-wrapper", 3, "drTooltip", "drTooltipContext", "drTooltipPosition"], ["data-test", "step_point", 1, "step-point"], ["class", "ellipse", 4, "ngIf"], [3, "ngSwitch"], [3, "ngSwitchCase"], ["data-test", "step_label_name", 1, "step-label", 3, "ngClass"], [3, "hidden"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngIf"], ["data-test", "step_progress", "class", "step-progress", 4, "ngIf"], [1, "ellipse"], [1, "pointer", "blue"], [1, "dr-icon-approve"], [1, "pointer", 3, "ngClass"], [1, "text", 3, "hidden"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["data-test", "step_progress", 1, "step-progress"], [1, "stepper--mini-connector"], [1, "step-tooltip"], [1, "step-tooltip_name"], [1, "step-tooltip_description"], ["class", "step-connector", 3, "only-one-step", "class", "visibility", "connector-grand", 4, "ngIf"], [1, "step-connector"], [1, "progress"]], template: function StepperComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { steps: "steps", currentStep: "currentStep", withoutConnectors: "withoutConnectors", hiddenNames: "hiddenNames", inlineLabels: "inlineLabels", disabled: "disabled", hiddenIndex: "hiddenIndex", mini: "mini", dataAnalytics: ["data-analytics", "dataAnalytics"] }, outputs: { stepChange: "stepChange" }, decls: 11, vars: 7, consts: [["class", "scroll-section", 3, "click", 4, "ngIf"], [1, "stepper"], ["stepper", ""], [4, "ngFor", "ngForOf"], ["tooltip", ""], ["connector", ""], ["defaultStepTextLabel", ""], [1, "scroll-section", 3, "click"], [1, "dr-icon-arrow-right"], ["class", "step", 3, "step-setup", "click", 4, "ngIf"], ["class", "stepper--mini-connector", 4, "ngIf"], [1, "step", 3, "click"], [1, "step-wrapper", 3, "drTooltip", "drTooltipContext", "drTooltipPosition"], ["data-test", "step_point", 1, "step-point"], ["class", "ellipse", 4, "ngIf"], [3, "ngSwitch"], [3, "ngSwitchCase"], ["data-test", "step_label_name", 1, "step-label", 3, "ngClass"], [4, "ngTemplateOutlet", "ngTemplateOutletContext"], [3, "ngTemplateOutlet", "ngTemplateOutletContext", 4, "ngIf"], ["data-test", "step_progress", "class", "step-progress", 4, "ngIf"], [1, "ellipse"], [1, "pointer", "blue"], [1, "dr-icon-approve"], [1, "pointer", 3, "ngClass"], [1, "text", 3, "hidden"], [3, "ngTemplateOutlet", "ngTemplateOutletContext"], ["data-test", "step_progress", 1, "step-progress"], [1, "stepper--mini-connector"], [1, "step-tooltip"], [1, "step-tooltip_name"], [1, "step-tooltip_description"], ["class", "step-connector", 3, "only-one-step", "class", "visibility", "connector-grand", 4, "ngIf"], [1, "step-connector"], [1, "progress"], [3, "hidden"]], template: function StepperComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵtemplate(0, StepperComponent_div_0_Template, 2, 0, "div", 0);
             i0.ɵɵelementStart(1, "div", 1, 2);
             i0.ɵɵtemplate(3, StepperComponent_ng_container_3_Template, 3, 2, "ng-container", 3);
@@ -5817,6 +5839,7 @@ class StepperComponent {
             i0.ɵɵtemplate(4, StepperComponent_div_4_Template, 2, 0, "div", 0);
             i0.ɵɵtemplate(5, StepperComponent_ng_template_5_Template, 5, 2, "ng-template", null, 4, i0.ɵɵtemplateRefExtractor);
             i0.ɵɵtemplate(7, StepperComponent_ng_template_7_Template, 1, 1, "ng-template", null, 5, i0.ɵɵtemplateRefExtractor);
+            i0.ɵɵtemplate(9, StepperComponent_ng_template_9_Template, 2, 2, "ng-template", null, 6, i0.ɵɵtemplateRefExtractor);
         } if (rf & 2) {
             const _r1 = i0.ɵɵreference(2);
             i0.ɵɵproperty("ngIf", (_r1 == null ? null : _r1.scrollLeft) !== 0);
@@ -5830,7 +5853,7 @@ class StepperComponent {
 }
 (function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(StepperComponent, [{
         type: Component,
-        args: [{ selector: 'dr-stepper', changeDetection: ChangeDetectionStrategy.Default, template: "<div class=\"scroll-section\" *ngIf=\"stepper?.scrollLeft !== 0\" (click)=\"scrollLeft()\">\n    <i class=\"dr-icon-arrow-right\"></i>\n</div>\n<div #stepper class=\"stepper\" [class.stepper--disabled]=\"disabled\" [class.stepper--mini]=\"mini\">\n    <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n        <div\n            *ngIf=\"!step.hide\"\n            class=\"step\"\n            (click)=\"selectStep(step)\"\n            [class.step-setup]=\"inlineLabels\"\n            [attr.data-analytics]=\"getDataAnalyticsTag(step)\">\n            <div\n                class=\"step-wrapper\"\n                [drTooltip]=\"step.description && tooltip\"\n                [drTooltipContext]=\"{ step: step }\"\n                [drTooltipPosition]=\"'bottom'\">\n                <div\n                    data-test=\"step_point\"\n                    class=\"step-point\"\n                    [class.active]=\"currentStep === step\"\n                    [class.completed]=\"step.completed\">\n                    <div *ngIf=\"step === currentStep\" class=\"ellipse\"></div>\n                    <ng-container [ngSwitch]=\"step.completed\">\n                        <ng-template [ngSwitchCase]=\"true\">\n                            <div class=\"pointer blue\">\n                                <i class=\"dr-icon-approve\"></i>\n                            </div>\n                        </ng-template>\n                        <ng-template [ngSwitchCase]=\"false\">\n                            <div\n                                class=\"pointer\"\n                                [class.gray]=\"step !== currentStep\"\n                                [ngClass]=\"{ 'blue with-ellipse': step === currentStep }\">\n                                <div [hidden]=\"step === currentStep || hiddenIndex\" class=\"text\">{{ index + 1 }}</div>\n                            </div>\n                        </ng-template>\n                    </ng-container>\n                </div>\n                <div\n                    data-test=\"step_label_name\"\n                    class=\"step-label\"\n                    [class.active]=\"currentStep === step\"\n                    [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n                    <span [hidden]=\"hiddenNames\">{{ step.name }}</span>\n                </div>\n                <ng-container\n                    *ngIf=\"inlineLabels\"\n                    [ngTemplateOutlet]=\"connector\"\n                    [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n                </ng-container>\n                <span *ngIf=\"step.showProgress\" data-test=\"step_progress\" class=\"step-progress\">\n                    {{ (step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks }}\n                </span>\n            </div>\n            <ng-container\n                *ngIf=\"!inlineLabels\"\n                [ngTemplateOutlet]=\"connector\"\n                [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n            </ng-container>\n        </div>\n        <div *ngIf=\"mini\" class=\"stepper--mini-connector\"></div>\n    </ng-container>\n</div>\n<div\n    (click)=\"scrollRight()\"\n    class=\"scroll-section\"\n    *ngIf=\"\n        stepper?.scrollWidth > stepper?.clientWidth &&\n        roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\n    \">\n    <i class=\"dr-icon-arrow-right\"></i>\n</div>\n\n<ng-template #tooltip let-step=\"step\">\n    <div class=\"step-tooltip\">\n        <div class=\"step-tooltip_name\">{{ step.name }}</div>\n        <div class=\"step-tooltip_description\">{{ step.description }}</div>\n    </div>\n</ng-template>\n\n<ng-template #connector let-step=\"step\" let-isLast=\"isLast\" let-index=\"index\">\n    <div\n        class=\"step-connector\"\n        [class.only-one-step]=\"steps.length === 1\"\n        [class]=\"'step-connector--' + (!inlineLabels ? 'absolute' : 'inline')\"\n        *ngIf=\"steps.length === 1 || !isLast\"\n        [style.visibility]=\"withoutConnectors || steps[step.index + 1]?.hide ? 'hidden' : 'unset'\"\n        [class.connector-grand]=\"!inlineLabels && (index === 0 || index === steps.length - 2)\">\n        <div class=\"progress\" [style.width]=\"getWidth(step)\"></div>\n    </div>\n</ng-template>\n", styles: [":host{font-family:Poppins,sans-serif;display:flex;justify-content:center;height:100%;position:relative}:host .scroll-section{position:absolute;top:0;height:100%;width:108px;display:flex;align-items:center;z-index:10}:host .scroll-section i{font-size:24px;color:#2969b0;background:#f3f7ff;border-radius:24px}:host .scroll-section i:hover{background:#cde1fb;cursor:pointer}:host .scroll-section:first-child{left:0;padding-left:16px;background:linear-gradient(90deg,#fff 36.08%,#fff0 87.17%)}:host .scroll-section:first-child i{transform:rotate(180deg)}:host .scroll-section:last-child{right:0;padding-right:16px;background:linear-gradient(270deg,#fff 36.08%,#fff0 87.17%);justify-content:flex-end}:host .stepper{display:flex;align-items:center;height:100%;width:100%;overflow:auto;scroll-behavior:smooth}:host .stepper::-webkit-scrollbar{display:none}:host .stepper--disabled .step:hover{cursor:default}:host .stepper--disabled .step-point .ellipse{border-color:#bcbcbc}:host .stepper--disabled .step-point .pointer{color:#fff;background-color:#bcbcbc;cursor:default}:host .stepper--disabled .step-label{color:#bcbcbc}:host .stepper--disabled .step-connector{background-color:#bcbcbc}:host .stepper--disabled .step-connector .progress{background-color:#bcbcbc}:host .stepper--mini .step-connector{display:none}:host .stepper--mini-connector{flex-grow:1;display:flex;margin:0 8px;background-color:#dfe0e3;height:2px}:host .stepper--mini-connector:last-child{display:none}:host .stepper--mini .step-setup{flex-grow:unset}:host .stepper--mini .step-point{width:18px!important;height:18px!important}:host .stepper--mini .step-point.active .pointer{width:12px;height:12px}:host .stepper--mini .step-point.active .pointer i{display:none}:host .stepper--mini .step-point.active .ellipse{width:18px;height:18px}:host .stepper--mini .step-point .pointer{width:16px;height:16px}:host .stepper--mini .step-point .pointer .text{font-size:12px!important;font-weight:500;line-height:20px}:host .stepper--mini .step-point .pointer i{font-size:12px!important}:host .stepper--mini .step-label{margin-left:8px}:host .stepper--mini .step-label span{font-size:12px;font-weight:400;line-height:20px}:host .stepper--mini .step-label.active span{font-weight:600}:host .step{position:relative;display:flex;flex-direction:column;width:120px;align-items:center;flex-shrink:0;flex-grow:1}:host .step:hover{cursor:pointer}:host .step:not(.step-setup) .step-wrapper{width:100%}:host .step:not(.step-setup):first-child .step-wrapper,:host .step:not(.step-setup):first-child .step-point,:host .step:not(.step-setup):first-child .step-label,:host .step:not(.step-setup):first-child .step-progress{margin-left:8px}:host .step:not(.step-setup):first-child .only-one-step{left:0!important;margin-left:25px}:host .step-point{display:flex;justify-content:center;width:100%;height:28px;position:relative;align-items:center}:host .step-point .ellipse{width:28px;height:28px;position:absolute;border-radius:50px;border-color:#4646ce;border-style:solid;border-width:2px;background:#fff;display:flex;justify-content:center;align-items:center;z-index:2}:host .step-point .pointer{width:24px;height:24px;position:absolute;z-index:4;border-radius:20px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;line-height:1.4;color:#6d6e6f;transition:box-shadow .2s ease-in-out}:host .step-point .pointer i{color:#fff;font-size:22px}:host .step-point .pointer.blue{background:#4646ce}:host .step-point .pointer.gray{background:#dfe0e3}:host .step-point .pointer.gray:hover{box-shadow:0 0 4px 2px #00000026}:host .step-point.completed :host .step-point.active{background:#4646ce}:host .step-point.active .ellipse{width:28px;height:28px}:host .step-point.active .pointer{width:20px;height:20px}:host .step-label{font-weight:400;font-size:14px;line-height:22px;line-height:1.5;color:#6d6e6f;display:flex;justify-content:center;overflow:hidden;margin-top:8px}:host .step-label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .step-label.active{font-weight:600;color:#333}:host .step-label:last-child{margin-bottom:23px}:host .step-progress{margin-top:3px;font-style:normal;font-weight:400;font-size:12px;line-height:1.4;display:flex;justify-content:center}:host .step-connector{background-color:#dfe0e3;height:2px}:host .step-connector.connector-grand{width:calc(100% - 25px)}:host .step-connector.connector-grand.only-one-step{width:calc(100% - 50px)}:host .step-connector .progress{background-color:#4646ce;height:2px;width:0}:host .step-connector--absolute{position:absolute;top:14px;width:100%;left:calc(50% + 12px)}:host .step-connector--inline{width:50px;margin-left:32px;margin-right:32px}:host .step-setup{width:auto}:host .step-setup .step-wrapper{display:flex;flex-direction:row;align-items:center;width:auto}:host .step-setup+.step-setup{margin-left:0}:host .step-setup .step-progress{display:none}:host .step-setup .step-label{position:relative;transform:none;align-items:center;justify-content:start;margin:0 0 0 8px;font-size:16px}:host .step-setup .step-point{width:28px;height:28px}:host .step-setup .step-point .pointer i{font-size:22px}:host .step-setup .step-point .pointer .text{font-size:16px}::ng-deep .step-tooltip{max-width:250px;font-size:14px;line-height:22px;padding:10px 12px}::ng-deep .step-tooltip_name{font-weight:700;overflow:hidden;text-overflow:ellipsis}@media screen and (min-width: 1367px){.stepper .step-label{font-size:14px}}\n"] }]
+        args: [{ selector: 'dr-stepper', changeDetection: ChangeDetectionStrategy.Default, template: "<div class=\"scroll-section\" *ngIf=\"stepper?.scrollLeft !== 0\" (click)=\"scrollLeft()\">\n    <i class=\"dr-icon-arrow-right\"></i>\n</div>\n<div #stepper class=\"stepper\" [class.stepper--disabled]=\"disabled\" [class.stepper--mini]=\"mini\">\n    <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n        <div\n            *ngIf=\"!step.hide\"\n            class=\"step\"\n            (click)=\"selectStep(step)\"\n            [class.step-setup]=\"inlineLabels\"\n            [attr.data-analytics]=\"getDataAnalyticsTag(step)\">\n            <div\n                class=\"step-wrapper\"\n                [drTooltip]=\"step.description && tooltip\"\n                [drTooltipContext]=\"{ step: step }\"\n                [drTooltipPosition]=\"'bottom'\">\n                <div\n                    data-test=\"step_point\"\n                    class=\"step-point\"\n                    [class.active]=\"currentStep === step\"\n                    [class.completed]=\"step.completed\">\n                    <div *ngIf=\"step === currentStep\" class=\"ellipse\"></div>\n                    <ng-container [ngSwitch]=\"step.completed\">\n                        <ng-template [ngSwitchCase]=\"true\">\n                            <div class=\"pointer blue\">\n                                <i class=\"dr-icon-approve\"></i>\n                            </div>\n                        </ng-template>\n                        <ng-template [ngSwitchCase]=\"false\">\n                            <div\n                                class=\"pointer\"\n                                [class.gray]=\"step !== currentStep\"\n                                [ngClass]=\"{ 'blue with-ellipse': step === currentStep }\">\n                                <div [hidden]=\"step === currentStep || hiddenIndex\" class=\"text\">{{ index + 1 }}</div>\n                            </div>\n                        </ng-template>\n                    </ng-container>\n                </div>\n                <div\n                    data-test=\"step_label_name\"\n                    class=\"step-label\"\n                    [class.active]=\"currentStep === step\"\n                    [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n                    <ng-container\n                        *ngTemplateOutlet=\"\n                            stepTextLabelTemplate || defaultStepTextLabel;\n                            context: { step: step, index: index }\n                        \"></ng-container>\n                </div>\n                <ng-container\n                    *ngIf=\"inlineLabels\"\n                    [ngTemplateOutlet]=\"connector\"\n                    [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n                </ng-container>\n                <span *ngIf=\"step.showProgress\" data-test=\"step_progress\" class=\"step-progress\">\n                    {{ (step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks }}\n                </span>\n            </div>\n            <ng-container\n                *ngIf=\"!inlineLabels\"\n                [ngTemplateOutlet]=\"connector\"\n                [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n            </ng-container>\n        </div>\n        <div *ngIf=\"mini\" class=\"stepper--mini-connector\"></div>\n    </ng-container>\n</div>\n<div\n    (click)=\"scrollRight()\"\n    class=\"scroll-section\"\n    *ngIf=\"\n        stepper?.scrollWidth > stepper?.clientWidth &&\n        roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\n    \">\n    <i class=\"dr-icon-arrow-right\"></i>\n</div>\n\n<ng-template #tooltip let-step=\"step\">\n    <div class=\"step-tooltip\">\n        <div class=\"step-tooltip_name\">{{ step.name }}</div>\n        <div class=\"step-tooltip_description\">{{ step.description }}</div>\n    </div>\n</ng-template>\n\n<ng-template #connector let-step=\"step\" let-isLast=\"isLast\" let-index=\"index\">\n    <div\n        class=\"step-connector\"\n        [class.only-one-step]=\"steps.length === 1\"\n        [class]=\"'step-connector--' + (!inlineLabels ? 'absolute' : 'inline')\"\n        *ngIf=\"steps.length === 1 || !isLast\"\n        [style.visibility]=\"withoutConnectors || steps[step.index + 1]?.hide ? 'hidden' : 'unset'\"\n        [class.connector-grand]=\"!inlineLabels && (index === 0 || index === steps.length - 2)\">\n        <div class=\"progress\" [style.width]=\"getWidth(step)\"></div>\n    </div>\n</ng-template>\n\n<ng-template #defaultStepTextLabel let-step=\"step\" let-index=\"index\">\n    <span [hidden]=\"hiddenNames\">{{ step.name }}</span>\n</ng-template>\n", styles: [":host{font-family:Poppins,sans-serif;display:flex;justify-content:center;height:100%;position:relative}:host .scroll-section{position:absolute;top:0;height:100%;width:108px;display:flex;align-items:center;z-index:10}:host .scroll-section i{font-size:24px;color:#2969b0;background:#f3f7ff;border-radius:24px}:host .scroll-section i:hover{background:#cde1fb;cursor:pointer}:host .scroll-section:first-child{left:0;padding-left:16px;background:linear-gradient(90deg,#fff 36.08%,#fff0 87.17%)}:host .scroll-section:first-child i{transform:rotate(180deg)}:host .scroll-section:last-child{right:0;padding-right:16px;background:linear-gradient(270deg,#fff 36.08%,#fff0 87.17%);justify-content:flex-end}:host .stepper{display:flex;align-items:center;height:100%;width:100%;overflow:auto;scroll-behavior:smooth}:host .stepper::-webkit-scrollbar{display:none}:host .stepper--disabled .step:hover{cursor:default}:host .stepper--disabled .step-point .ellipse{border-color:#bcbcbc}:host .stepper--disabled .step-point .pointer{color:#fff;background-color:#bcbcbc;cursor:default}:host .stepper--disabled .step-label{color:#bcbcbc}:host .stepper--disabled .step-connector{background-color:#bcbcbc}:host .stepper--disabled .step-connector .progress{background-color:#bcbcbc}:host .stepper--mini .step-connector{display:none}:host .stepper--mini-connector{flex-grow:1;display:flex;margin:0 8px;background-color:#dfe0e3;height:2px}:host .stepper--mini-connector:last-child{display:none}:host .stepper--mini .step-setup{flex-grow:unset}:host .stepper--mini .step-point{width:18px!important;height:18px!important}:host .stepper--mini .step-point.active .pointer{width:12px;height:12px}:host .stepper--mini .step-point.active .pointer i{display:none}:host .stepper--mini .step-point.active .ellipse{width:18px;height:18px}:host .stepper--mini .step-point .pointer{width:16px;height:16px}:host .stepper--mini .step-point .pointer .text{font-size:12px!important;font-weight:500;line-height:20px}:host .stepper--mini .step-point .pointer i{font-size:12px!important}:host .stepper--mini .step-label{margin-left:8px}:host .stepper--mini .step-label span{font-size:12px;font-weight:400;line-height:20px}:host .stepper--mini .step-label.active span{font-weight:600}:host .step{position:relative;display:flex;flex-direction:column;width:120px;align-items:center;flex-shrink:0;flex-grow:1}:host .step:hover{cursor:pointer}:host .step:not(.step-setup) .step-wrapper{width:100%}:host .step:not(.step-setup):first-child .step-wrapper,:host .step:not(.step-setup):first-child .step-point,:host .step:not(.step-setup):first-child .step-label,:host .step:not(.step-setup):first-child .step-progress{margin-left:8px}:host .step:not(.step-setup):first-child .only-one-step{left:0!important;margin-left:25px}:host .step-point{display:flex;justify-content:center;width:100%;height:28px;position:relative;align-items:center}:host .step-point .ellipse{width:28px;height:28px;position:absolute;border-radius:50px;border-color:#4646ce;border-style:solid;border-width:2px;background:#fff;display:flex;justify-content:center;align-items:center;z-index:2}:host .step-point .pointer{width:24px;height:24px;position:absolute;z-index:4;border-radius:20px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;line-height:1.4;color:#6d6e6f;transition:box-shadow .2s ease-in-out}:host .step-point .pointer i{color:#fff;font-size:22px}:host .step-point .pointer.blue{background:#4646ce}:host .step-point .pointer.gray{background:#dfe0e3}:host .step-point .pointer.gray:hover{box-shadow:0 0 4px 2px #00000026}:host .step-point.completed :host .step-point.active{background:#4646ce}:host .step-point.active .ellipse{width:28px;height:28px}:host .step-point.active .pointer{width:20px;height:20px}:host .step-label{font-weight:400;font-size:14px;line-height:22px;line-height:1.5;color:#6d6e6f;display:flex;justify-content:center;overflow:hidden;margin-top:8px}:host .step-label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .step-label.active{font-weight:600;color:#333}:host .step-label:last-child{margin-bottom:23px}:host .step-progress{margin-top:3px;font-style:normal;font-weight:400;font-size:12px;line-height:1.4;display:flex;justify-content:center}:host .step-connector{background-color:#dfe0e3;height:2px}:host .step-connector.connector-grand{width:calc(100% - 25px)}:host .step-connector.connector-grand.only-one-step{width:calc(100% - 50px)}:host .step-connector .progress{background-color:#4646ce;height:2px;width:0}:host .step-connector--absolute{position:absolute;top:14px;width:100%;left:calc(50% + 12px)}:host .step-connector--inline{width:50px;margin-left:32px;margin-right:32px}:host .step-setup{width:auto}:host .step-setup .step-wrapper{display:flex;flex-direction:row;align-items:center;width:auto}:host .step-setup+.step-setup{margin-left:0}:host .step-setup .step-progress{display:none}:host .step-setup .step-label{position:relative;transform:none;align-items:center;justify-content:start;margin:0 0 0 8px;font-size:16px}:host .step-setup .step-point{width:28px;height:28px}:host .step-setup .step-point .pointer i{font-size:22px}:host .step-setup .step-point .pointer .text{font-size:16px}::ng-deep .step-tooltip{max-width:250px;font-size:14px;line-height:22px;padding:10px 12px}::ng-deep .step-tooltip_name{font-weight:700;overflow:hidden;text-overflow:ellipsis}@media screen and (min-width: 1367px){.stepper .step-label{font-size:14px}}\n"] }]
     }], null, { steps: [{
             type: Input
         }], currentStep: [{
@@ -5855,6 +5878,9 @@ class StepperComponent {
         }], stepper: [{
             type: ViewChild,
             args: ['stepper', { read: ElementRef }]
+        }], stepTextLabelTemplate: [{
+            type: ContentChild,
+            args: ['stepTextLabel']
         }] }); })();
 
 const IMAGE_TYPES = ['image/png', 'image/jpeg', 'image/gif'];