@datarailsshared/datarailsshared 1.4.72 → 1.4.74

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.
Files changed (32) hide show
  1. package/assets/styles/img/dr-icon-info.svg +3 -0
  2. package/bundles/datarailsshared-datarailsshared.umd.js +179 -6
  3. package/bundles/datarailsshared-datarailsshared.umd.js.map +1 -1
  4. package/datarailsshared-datarailsshared-1.4.74.tgz +0 -0
  5. package/datarailsshared-datarailsshared.d.ts +5 -0
  6. package/datarailsshared-datarailsshared.metadata.json +1 -1
  7. package/esm2015/datarailsshared-datarailsshared.js +6 -1
  8. package/esm2015/lib/dr-tooltip/components/tooltip-info/tooltip-info.component.js +18 -0
  9. package/esm2015/lib/dr-tooltip/components/tooltip-info-simple/tooltip-info-simple.component.js +18 -0
  10. package/esm2015/lib/dr-tooltip/components/tooltip-no-body/tooltip-no-body.component.js +20 -0
  11. package/esm2015/lib/dr-tooltip/components/tooltip-process-default/tooltip-process-default.component.js +34 -0
  12. package/esm2015/lib/dr-tooltip/dr-tooltip.module.js +16 -4
  13. package/esm2015/lib/dr-tooltip/enums/tooltip-position.enum.js +16 -0
  14. package/esm2015/lib/dr-tooltip/interfaces/tooltip-component-context.js +2 -0
  15. package/esm2015/lib/stepper/interfaces/stepper.js +2 -0
  16. package/esm2015/lib/stepper/stepper.component.js +55 -0
  17. package/esm2015/lib/stepper/stepper.module.js +17 -0
  18. package/esm2015/public-api.js +4 -1
  19. package/fesm2015/datarailsshared-datarailsshared.js +178 -1
  20. package/fesm2015/datarailsshared-datarailsshared.js.map +1 -1
  21. package/lib/dr-tooltip/components/tooltip-info/tooltip-info.component.d.ts +5 -0
  22. package/lib/dr-tooltip/components/tooltip-info-simple/tooltip-info-simple.component.d.ts +5 -0
  23. package/lib/dr-tooltip/components/tooltip-no-body/tooltip-no-body.component.d.ts +6 -0
  24. package/lib/dr-tooltip/components/tooltip-process-default/tooltip-process-default.component.d.ts +4 -0
  25. package/lib/dr-tooltip/enums/tooltip-position.enum.d.ts +14 -0
  26. package/lib/dr-tooltip/interfaces/tooltip-component-context.d.ts +6 -0
  27. package/lib/stepper/interfaces/stepper.d.ts +10 -0
  28. package/lib/stepper/stepper.component.d.ts +19 -0
  29. package/lib/stepper/stepper.module.d.ts +2 -0
  30. package/package.json +1 -1
  31. package/public-api.d.ts +4 -0
  32. package/datarailsshared-datarailsshared-1.4.72.tgz +0 -0
@@ -0,0 +1,3 @@
1
+ <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M8.00008 2.66669C5.05341 2.66669 2.66675 5.05335 2.66675 8.00002C2.66675 10.9467 5.05341 13.3334 8.00008 13.3334C10.9467 13.3334 13.3334 10.9467 13.3334 8.00002C13.3334 5.05335 10.9467 2.66669 8.00008 2.66669ZM8.53341 10.6667H7.46675V7.46669H8.53341V10.6667ZM8.53341 6.40002H7.46675V5.33335H8.53341V6.40002Z" fill="#7B61FF"/>
3
+ </svg>
@@ -3573,6 +3573,22 @@
3573
3573
  label: [{ type: i0.Input }]
3574
3574
  };
3575
3575
 
3576
+ exports.TooltipPosition = void 0;
3577
+ (function (TooltipPosition) {
3578
+ TooltipPosition["TOP"] = "top";
3579
+ TooltipPosition["BOTTOM"] = "bottom";
3580
+ TooltipPosition["LEFT"] = "left";
3581
+ TooltipPosition["RIGHT"] = "right";
3582
+ TooltipPosition["TOP_RIGHT"] = "top-right";
3583
+ TooltipPosition["TOP_LEFT"] = "top-left";
3584
+ TooltipPosition["BOTTOM_RIGHT"] = "bottom-right";
3585
+ TooltipPosition["BOTTOM_LEFT"] = "bottom-left";
3586
+ TooltipPosition["RIGHT_TOP"] = "right-top";
3587
+ TooltipPosition["RIGHT_BOTTOM"] = "right-bottom";
3588
+ TooltipPosition["LEFT_TOP"] = "left-top";
3589
+ TooltipPosition["LEFT_BOTTOM"] = "left-bottom";
3590
+ })(exports.TooltipPosition || (exports.TooltipPosition = {}));
3591
+
3576
3592
  var DrModelDebounceChangeDirective = /** @class */ (function () {
3577
3593
  function DrModelDebounceChangeDirective(ngModel) {
3578
3594
  this.ngModel = ngModel;
@@ -4362,6 +4378,86 @@
4362
4378
  },] }
4363
4379
  ];
4364
4380
 
4381
+ var TooltipInfoComponent = /** @class */ (function () {
4382
+ function TooltipInfoComponent() {
4383
+ }
4384
+ return TooltipInfoComponent;
4385
+ }());
4386
+ TooltipInfoComponent.decorators = [
4387
+ { type: i0.Component, args: [{
4388
+ selector: 'dr-tooltip-info',
4389
+ template: "<div class=\"tooltip-info\">\n <i *ngIf=\"data?.icon else defaultIcon\" class=\"fa\" [class]=\"data.icon\" [style.fontSize.px]=\"14\"\n [style.margin.px]=\"12\" [style.color]=\"data?.iconColor || '#7B61FF'\"></i>\n <div class=\"tooltip-info-content-wrapper\">\n <div *ngIf=\"data?.title\" class=\"tooltip-info_header\">\n <span>{{data.title}}</span>\n </div>\n <div *ngIf=\"data?.description\" class=\"tooltip-info_description\"\n [class.tooltip-info_description-no-border]=\"!data.title\">\n <ng-container *ngIf=\"!data.title\"></ng-container>\n <span>{{data.description}}</span>\n </div>\n </div>\n</div>\n\n<ng-template #defaultIcon>\n <ng-container *ngIf=\"!data.icon\">\n <div class=\"default-icon\"></div>\n </ng-container>\n</ng-template>\n",
4390
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
4391
+ styles: [".tooltip-info{width:316px;display:flex}.tooltip-info-content-wrapper{display:flex;flex-direction:column;padding-top:10px}.tooltip-info_header{padding:0 16px 6px 0;font-weight:bold;font-size:14px;line-height:16px;letter-spacing:.25px;display:flex;justify-content:flex-start}.tooltip-info_header>i{margin-right:10px}.tooltip-info-content-wrapper{padding-top:10px}.tooltip-info_description{display:flex;align-items:flex-start;border-top:1px solid #AEB5BB;padding:12px 10px 10px 0;text-align:left;font-weight:normal;font-size:14px;line-height:22px}.tooltip-info_description-no-border{padding-top:0;border-top:none}.tooltip-info_description>i{margin-right:10px}:host.tooltip-info-medium .tooltip-info{max-width:272px}:host.tooltip-info-medium .tooltip-info-content-wrapper{padding-top:10px}:host.tooltip-info-medium .tooltip-info_header,:host.tooltip-info-medium .tooltip-info_description{min-height:unset;border-top:none;font-size:14px;line-height:22px}:host.tooltip-info-medium .tooltip-info_header{padding:10px 10px 0 0}:host.tooltip-info-medium .tooltip-info_description{padding:10px 12px 10px 0}:host.tooltip-info-medium .tooltip-info .default-icon:before{background:url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2216%22 viewBox%3D%220 0 16 16%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.00008 2.66669C5.05341 2.66669 2.66675 5.05335 2.66675 8.00002C2.66675 10.9467 5.05341 13.3334 8.00008 13.3334C10.9467 13.3334 13.3334 10.9467 13.3334 8.00002C13.3334 5.05335 10.9467 2.66669 8.00008 2.66669ZM8.53341 10.6667H7.46675V7.46669H8.53341V10.6667ZM8.53341 6.40002H7.46675V5.33335H8.53341V6.40002Z%22 fill%3D%22%237B61FF%22%2F%3E%3C%2Fsvg%3E\") no-repeat;background-size:100% 100%;display:inline-block;height:20px;width:20px;content:\"\"}:host.tooltip-info-small .tooltip-info{width:auto}:host.tooltip-info-small .tooltip-info-content-wrapper{padding-top:10px}:host.tooltip-info-small .tooltip-info_header,:host.tooltip-info-small .tooltip-info_description{min-height:unset;border-top:none;font-size:14px;line-height:22px}:host.tooltip-info-small .tooltip-info_header{padding:0 10px 0 0}:host.tooltip-info-small .tooltip-info_description{padding:0 12px 10px 0}:host.tooltip-info-small .tooltip-info .default-icon:before{background:url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2216%22 viewBox%3D%220 0 16 16%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.00008 2.66669C5.05341 2.66669 2.66675 5.05335 2.66675 8.00002C2.66675 10.9467 5.05341 13.3334 8.00008 13.3334C10.9467 13.3334 13.3334 10.9467 13.3334 8.00002C13.3334 5.05335 10.9467 2.66669 8.00008 2.66669ZM8.53341 10.6667H7.46675V7.46669H8.53341V10.6667ZM8.53341 6.40002H7.46675V5.33335H8.53341V6.40002Z%22 fill%3D%22%237B61FF%22%2F%3E%3C%2Fsvg%3E\") no-repeat;background-size:100% 100%;display:inline-block;height:20px;width:20px;content:\"\"}.default-icon{position:relative;width:18px;height:18px;margin:10px}.default-icon:before{background:url(\"data:image/svg+xml,%3Csvg width%3D%2216%22 height%3D%2216%22 viewBox%3D%220 0 16 16%22 fill%3D%22none%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath d%3D%22M8.00008 2.66669C5.05341 2.66669 2.66675 5.05335 2.66675 8.00002C2.66675 10.9467 5.05341 13.3334 8.00008 13.3334C10.9467 13.3334 13.3334 10.9467 13.3334 8.00002C13.3334 5.05335 10.9467 2.66669 8.00008 2.66669ZM8.53341 10.6667H7.46675V7.46669H8.53341V10.6667ZM8.53341 6.40002H7.46675V5.33335H8.53341V6.40002Z%22 fill%3D%22%237B61FF%22%2F%3E%3C%2Fsvg%3E\") no-repeat;background-size:100% 100%;display:inline-block;height:18px;width:18px;content:\"\"}\n"]
4392
+ },] }
4393
+ ];
4394
+ TooltipInfoComponent.ctorParameters = function () { return []; };
4395
+ TooltipInfoComponent.propDecorators = {
4396
+ data: [{ type: i0.Input }]
4397
+ };
4398
+
4399
+ var TooltipInfoSimpleComponent = /** @class */ (function () {
4400
+ function TooltipInfoSimpleComponent() {
4401
+ }
4402
+ return TooltipInfoSimpleComponent;
4403
+ }());
4404
+ TooltipInfoSimpleComponent.decorators = [
4405
+ { type: i0.Component, args: [{
4406
+ selector: 'dr-tooltip-info-simple',
4407
+ template: "<div class=\"tooltip-info-simple\">\n <div *ngIf=\"context?.title\" class=\"tooltip-info-simple__title\">{{context?.title}}</div>\n <div *ngIf=\"context?.description\" class=\"tooltip-info-simple__description\">{{context?.description}}</div>\n</div>\n",
4408
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
4409
+ styles: [".tooltip-info-simple{max-width:250px;font-size:14px;line-height:22px;padding:10px 12px;color:#0c142b}.tooltip-info-simple__title{font-weight:600;overflow:hidden;text-overflow:ellipsis}\n"]
4410
+ },] }
4411
+ ];
4412
+ TooltipInfoSimpleComponent.ctorParameters = function () { return []; };
4413
+ TooltipInfoSimpleComponent.propDecorators = {
4414
+ context: [{ type: i0.Input }]
4415
+ };
4416
+
4417
+ var TooltipNoBodyComponent = /** @class */ (function () {
4418
+ function TooltipNoBodyComponent() {
4419
+ }
4420
+ TooltipNoBodyComponent.prototype.ngOnInit = function () {
4421
+ };
4422
+ return TooltipNoBodyComponent;
4423
+ }());
4424
+ TooltipNoBodyComponent.decorators = [
4425
+ { type: i0.Component, args: [{
4426
+ selector: 'dr-tooltip-no-body',
4427
+ template: "<div class=\"tooltip-bold\" [ngClass]=\"{'tooltip-bold--icon': context?.icon}\">\n <div class=\"tooltip-bold__title\">\n <i *ngIf=\"context?.icon\" [class]=\"context?.icon\" [style.color]=\"context?.iconColor || 'black'\"></i>\n {{ context.title }}\n </div>\n <div class=\"tooltip-bold-text\">\n {{ context.text }}\n </div>\n</div>",
4428
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
4429
+ styles: [".tooltip-bold{position:relative;box-shadow:0 4px 8px 1px #00000040;border:1px solid #C3C4CE;border-radius:8px;font-size:14px;line-height:22px;padding:10px 12px;background-color:#fff}.tooltip-bold--icon{padding-left:44px}.tooltip-bold__title{font-weight:bold}.tooltip-bold__title>i{position:absolute;width:16px;height:16px;left:10px}\n"]
4430
+ },] }
4431
+ ];
4432
+ TooltipNoBodyComponent.ctorParameters = function () { return []; };
4433
+ TooltipNoBodyComponent.propDecorators = {
4434
+ context: [{ type: i0.Input }]
4435
+ };
4436
+
4437
+ var TooltipProcessDefaultComponent = /** @class */ (function () {
4438
+ function TooltipProcessDefaultComponent() {
4439
+ }
4440
+ return TooltipProcessDefaultComponent;
4441
+ }());
4442
+ TooltipProcessDefaultComponent.decorators = [
4443
+ { type: i0.Component, args: [{
4444
+ selector: 'dr-tooltip-process-default',
4445
+ template: "\n <div class=\"container\" [innerHTML]=\"text\"></div>\n ",
4446
+ changeDetection: i0.ChangeDetectionStrategy.OnPush,
4447
+ styles: ["\n .container {\n width: auto;\n max-width: 388px;\n text-align: start;\n font-size: 14px;\n line-height: 22px;\n padding: 10px 12px;\n color: #151B3F;\n background-color: #FFF;\n border-radius: 8px;\n box-shadow: 0px 4px 8px 1px rgba(0, 0, 0, 0.25);\n border: 1px solid #C3C4CE;\n }\n "]
4448
+ },] }
4449
+ ];
4450
+ TooltipProcessDefaultComponent.ctorParameters = function () { return []; };
4451
+ TooltipProcessDefaultComponent.propDecorators = {
4452
+ text: [{ type: i0.Input }]
4453
+ };
4454
+
4455
+ var TOOLTIP_COMPONENTS = [
4456
+ TooltipInfoComponent,
4457
+ TooltipInfoSimpleComponent,
4458
+ TooltipNoBodyComponent,
4459
+ TooltipProcessDefaultComponent
4460
+ ];
4365
4461
  var DrTooltipModule = /** @class */ (function () {
4366
4462
  function DrTooltipModule() {
4367
4463
  }
@@ -4372,15 +4468,15 @@
4372
4468
  imports: [
4373
4469
  common.CommonModule
4374
4470
  ],
4375
- exports: [
4471
+ exports: __spreadArray([
4376
4472
  TooltipComponent,
4377
- DrTooltipDirective,
4378
- ],
4473
+ DrTooltipDirective
4474
+ ], __read(TOOLTIP_COMPONENTS)),
4379
4475
  providers: [],
4380
- declarations: [
4476
+ declarations: __spreadArray([
4381
4477
  TooltipComponent,
4382
- DrTooltipDirective,
4383
- ],
4478
+ DrTooltipDirective
4479
+ ], __read(TOOLTIP_COMPONENTS)),
4384
4480
  },] }
4385
4481
  ];
4386
4482
 
@@ -4559,6 +4655,77 @@
4559
4655
  },] }
4560
4656
  ];
4561
4657
 
4658
+ var StepperComponent = /** @class */ (function () {
4659
+ function StepperComponent() {
4660
+ this.withoutConnectors = false;
4661
+ this.hiddenNames = false;
4662
+ this.inlineLabels = false;
4663
+ this.disabled = false;
4664
+ this.hiddenIndex = false;
4665
+ this.stepChange = new i0.EventEmitter();
4666
+ }
4667
+ StepperComponent.prototype.selectStep = function (step) {
4668
+ if (step !== this.currentStep && !this.disabled) {
4669
+ this.stepChange.emit(step);
4670
+ }
4671
+ };
4672
+ StepperComponent.prototype.getWidth = function (step) {
4673
+ if (this.withoutConnectors)
4674
+ return '0%';
4675
+ if (step.completed)
4676
+ return '100%';
4677
+ if (step.index === 0 || this.steps[step.index - 1].completed)
4678
+ return (((step === null || step === void 0 ? void 0 : step.completedTasks) / (step === null || step === void 0 ? void 0 : step.requiredTasks) * 100) || 0) + "%";
4679
+ return '0%';
4680
+ };
4681
+ StepperComponent.prototype.scrollLeft = function () {
4682
+ this.stepper.nativeElement.scrollLeft -= 80;
4683
+ };
4684
+ StepperComponent.prototype.scrollRight = function () {
4685
+ this.stepper.nativeElement.scrollLeft += 80;
4686
+ };
4687
+ StepperComponent.prototype.roundWidth = function (width) {
4688
+ return Math.round(width);
4689
+ };
4690
+ return StepperComponent;
4691
+ }());
4692
+ StepperComponent.decorators = [
4693
+ { type: i0.Component, args: [{
4694
+ selector: 'dr-stepper',
4695
+ 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\" [ngClass]=\"{'stepper--disabled': disabled}\">\n <ng-container *ngFor=\"let step of steps; let index = index; last as isLast; first as isFirst\">\n <div *ngIf=\"!step.hide\" class=\"step\" (click)=\"selectStep(step)\"\n [class.step-setup]=\"inlineLabels\">\n <div class=\"step-wrapper\" [drTooltip]=\"step.description && tooltip\"\n [drTooltipContext]=\"{ step: step }\"\n [drTooltipPosition]=\"'bottom'\">\n <div data-test=\"step_point\" class=\"step-point\">\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 class=\"pointer\" [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 data-test=\"step_label_name\" class=\"step-label\" [class.active]=\"currentStep === step\"\n [ngClass]=\"step.completed ? 'completed' : 'uncompleted'\">\n <span [hidden]=\"hiddenNames\">{{step.name}}</span>\n </div>\n <ng-container *ngIf=\"inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n <span *ngIf=\"step.showProgress\"\n data-test=\"step_progress\"\n class=\"step-progress\">\n {{(step.requiredTasks ? step.completedTasks : step.requiredTasks) + '/' + step.requiredTasks}}\n </span>\n </div>\n <ng-container *ngIf=\"!inlineLabels\" [ngTemplateOutlet]=\"connector\"\n [ngTemplateOutletContext]=\"{ index, isLast, step }\">\n </ng-container>\n </div>\n </ng-container>\n</div>\n<div (click)=\"scrollRight()\" class=\"scroll-section\"\n *ngIf=\"stepper?.scrollWidth > stepper?.clientWidth && roundWidth(stepper?.scrollLeft + stepper?.clientWidth) < stepper?.scrollWidth\">\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 class=\"step-connector\" [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",
4696
+ changeDetection: i0.ChangeDetectionStrategy.Default,
4697
+ 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,#FFFFFF 36.08%,rgba(255,255,255,0) 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,#FFFFFF 36.08%,rgba(255,255,255,0) 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 .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:38px;position:relative;align-items:center}:host .step-point .ellipse{width:38px;height:38px;position:absolute;border-radius:50px;border-color:#579bf2;border-style:solid;border-width:2px;background:white;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:bold;font-size:16px;line-height:1.4;color:#51566f}:host .step-point .pointer i{color:#fff;font-size:22px}:host .step-point .pointer.blue{background:#579BF2}:host .step-point .pointer.completed{background-color:#151b3f}:host .step-point .pointer.uncompleted{background-color:#e5e5e5}:host .step-point .pointer.active-uncompleted{background-color:#2969b0}:host .step-point .pointer.gray{background:#E5E6EA}:host .step-label{font-weight:normal;font-size:14px;line-height:1.5;color:#51566f;display:flex;justify-content:center;overflow:hidden;margin-top:3px;width:95%}:host .step-label span{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host .step-label.active{font-weight:600}:host .step-label:last-child{margin-bottom:23px}:host .step-progress{margin-top:3px;font-style:normal;font-weight:normal;font-size:12px;line-height:1.4;display:flex;justify-content:center}:host .step-connector{background-color:#e5e5e5;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:#579bf2;height:2px;width:0}:host .step-connector--absolute{position:absolute;top:18px;width:100%;left:calc(100% / 2 + 12px)}:host .step-connector--inline{width:23px;margin-left:19px;margin-right:calc(19px - (38px - 24px) / 2)}: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 5px;font-size:16px}:host .step-setup .step-point{width:38px;height:38px}:host .step-setup .step-point .ellipse{width:24px;height:24px}:host .step-setup .step-point .pointer{width:24px;height:24px}:host .step-setup .step-point .pointer.with-ellipse{width:14px;height:14px}: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"]
4698
+ },] }
4699
+ ];
4700
+ StepperComponent.ctorParameters = function () { return []; };
4701
+ StepperComponent.propDecorators = {
4702
+ steps: [{ type: i0.Input }],
4703
+ currentStep: [{ type: i0.Input }],
4704
+ withoutConnectors: [{ type: i0.Input }],
4705
+ hiddenNames: [{ type: i0.Input }],
4706
+ inlineLabels: [{ type: i0.Input }],
4707
+ disabled: [{ type: i0.Input }],
4708
+ hiddenIndex: [{ type: i0.Input }],
4709
+ stepChange: [{ type: i0.Output }],
4710
+ stepper: [{ type: i0.ViewChild, args: ['stepper', { read: i0.ElementRef },] }]
4711
+ };
4712
+
4713
+ var StepperModule = /** @class */ (function () {
4714
+ function StepperModule() {
4715
+ }
4716
+ return StepperModule;
4717
+ }());
4718
+ StepperModule.decorators = [
4719
+ { type: i0.NgModule, args: [{
4720
+ declarations: [StepperComponent],
4721
+ imports: [
4722
+ common.CommonModule,
4723
+ DrTooltipModule
4724
+ ],
4725
+ exports: [StepperComponent]
4726
+ },] }
4727
+ ];
4728
+
4562
4729
  /* components */
4563
4730
 
4564
4731
  /**
@@ -4621,6 +4788,7 @@
4621
4788
  exports.QuarterTagComponent = QuarterTagComponent;
4622
4789
  exports.RadioButtonComponent = RadioButtonComponent;
4623
4790
  exports.RadioGroupComponent = RadioGroupComponent;
4791
+ exports.StepperModule = StepperModule;
4624
4792
  exports.TooltipComponent = TooltipComponent;
4625
4793
  exports.WeekTagComponent = WeekTagComponent;
4626
4794
  exports.YearTagComponent = YearTagComponent;
@@ -4632,6 +4800,11 @@
4632
4800
  exports["ɵf"] = DrDatePickerFormatDirective;
4633
4801
  exports["ɵg"] = DrDatePickerCustomHeaderComponent;
4634
4802
  exports["ɵh"] = DrShowTimeframePipe;
4803
+ exports["ɵi"] = TooltipInfoComponent;
4804
+ exports["ɵj"] = TooltipInfoSimpleComponent;
4805
+ exports["ɵk"] = TooltipNoBodyComponent;
4806
+ exports["ɵl"] = TooltipProcessDefaultComponent;
4807
+ exports["ɵm"] = StepperComponent;
4635
4808
 
4636
4809
  Object.defineProperty(exports, '__esModule', { value: true });
4637
4810