@ascentgl/ads-ui 21.75.0 → 21.76.0
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.
|
@@ -9771,11 +9771,11 @@ class AdsHorizontalStepperComponent {
|
|
|
9771
9771
|
this.registry.register([adsIconStatusNew, adsIconCheckCircleFilled]);
|
|
9772
9772
|
}
|
|
9773
9773
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsHorizontalStepperComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9774
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsHorizontalStepperComponent, isStandalone: false, selector: "ads-horizontal-stepper", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"horizontal-stepper-container\" [id]=\"id()\">\n @for (step of steps(); track i; let i = $index; let last = $last) {\n <div class=\"step-item\">\n <div class=\"step-content\">\n @switch (step.status) {\n @case (HorizontalStepStatus.Planned) {\n <ads-icon name=\"status_new\" theme=\"light\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.InProgress) {\n <ads-icon name=\"status_new\" theme=\"secondary\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.Completed) {\n <ads-icon name=\"check_circle_filled\" size=\"xxs\" />\n }\n }\n <span class=\"step-title\">{{ step.title }}</span>\n </div>\n @if (!last) {\n <div class=\"step-line\" [ngClass]=\"step.status\"></div>\n }\n </div>\n }\n</div>\n\n", styles: [".horizontal-stepper-container{display:flex;flex-direction:row;align-items:center;width:100%;gap:
|
|
9774
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.6", type: AdsHorizontalStepperComponent, isStandalone: false, selector: "ads-horizontal-stepper", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"horizontal-stepper-container\" [id]=\"id()\">\n @for (step of steps(); track i; let i = $index; let last = $last) {\n <div class=\"step-item\">\n <div class=\"step-content\">\n @switch (step.status) {\n @case (HorizontalStepStatus.Planned) {\n <ads-icon name=\"status_new\" theme=\"light\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.InProgress) {\n <ads-icon name=\"status_new\" theme=\"secondary\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.Completed) {\n <ads-icon name=\"check_circle_filled\" size=\"xxs\" />\n }\n }\n <span class=\"step-title\">{{ step.title }}</span>\n </div>\n @if (!last) {\n <div class=\"step-line\" [ngClass]=\"step.status\"></div>\n }\n </div>\n }\n</div>\n\n", styles: [".horizontal-stepper-container{display:flex;flex-direction:row;align-items:center;width:100%;gap:12px}.horizontal-stepper-container .step-item{display:flex;flex-direction:row;align-items:center;flex:1;min-width:0}.horizontal-stepper-container .step-item:last-child{flex:0 0 auto}.horizontal-stepper-container .step-item .step-content{display:flex;flex-direction:row;align-items:center;gap:4px}.horizontal-stepper-container .step-item .step-content ::ng-deep ads-icon{flex-shrink:0;width:16px!important;height:16px!important;display:block!important}.horizontal-stepper-container .step-item .step-content ::ng-deep ads-icon svg{width:16px!important;height:16px!important}.horizontal-stepper-container .step-item .step-content .step-title{color:var(--color-medium);font-size:14px;line-height:18px;min-width:51px;overflow-wrap:break-word;text-align:center}.horizontal-stepper-container .step-item .step-line{flex:1 1 0;height:2px;background-color:var(--color-light);border-radius:0 1px 1px 0;margin-left:4px;min-width:16px}@media(min-width:430px){.horizontal-stepper-container .step-item .step-line{min-width:55px;margin-left:12px}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
|
|
9775
9775
|
}
|
|
9776
9776
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.6", ngImport: i0, type: AdsHorizontalStepperComponent, decorators: [{
|
|
9777
9777
|
type: Component,
|
|
9778
|
-
args: [{ selector: 'ads-horizontal-stepper', standalone: false, template: "<div class=\"horizontal-stepper-container\" [id]=\"id()\">\n @for (step of steps(); track i; let i = $index; let last = $last) {\n <div class=\"step-item\">\n <div class=\"step-content\">\n @switch (step.status) {\n @case (HorizontalStepStatus.Planned) {\n <ads-icon name=\"status_new\" theme=\"light\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.InProgress) {\n <ads-icon name=\"status_new\" theme=\"secondary\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.Completed) {\n <ads-icon name=\"check_circle_filled\" size=\"xxs\" />\n }\n }\n <span class=\"step-title\">{{ step.title }}</span>\n </div>\n @if (!last) {\n <div class=\"step-line\" [ngClass]=\"step.status\"></div>\n }\n </div>\n }\n</div>\n\n", styles: [".horizontal-stepper-container{display:flex;flex-direction:row;align-items:center;width:100%;gap:
|
|
9778
|
+
args: [{ selector: 'ads-horizontal-stepper', standalone: false, template: "<div class=\"horizontal-stepper-container\" [id]=\"id()\">\n @for (step of steps(); track i; let i = $index; let last = $last) {\n <div class=\"step-item\">\n <div class=\"step-content\">\n @switch (step.status) {\n @case (HorizontalStepStatus.Planned) {\n <ads-icon name=\"status_new\" theme=\"light\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.InProgress) {\n <ads-icon name=\"status_new\" theme=\"secondary\" size=\"xxs\" />\n }\n @case (HorizontalStepStatus.Completed) {\n <ads-icon name=\"check_circle_filled\" size=\"xxs\" />\n }\n }\n <span class=\"step-title\">{{ step.title }}</span>\n </div>\n @if (!last) {\n <div class=\"step-line\" [ngClass]=\"step.status\"></div>\n }\n </div>\n }\n</div>\n\n", styles: [".horizontal-stepper-container{display:flex;flex-direction:row;align-items:center;width:100%;gap:12px}.horizontal-stepper-container .step-item{display:flex;flex-direction:row;align-items:center;flex:1;min-width:0}.horizontal-stepper-container .step-item:last-child{flex:0 0 auto}.horizontal-stepper-container .step-item .step-content{display:flex;flex-direction:row;align-items:center;gap:4px}.horizontal-stepper-container .step-item .step-content ::ng-deep ads-icon{flex-shrink:0;width:16px!important;height:16px!important;display:block!important}.horizontal-stepper-container .step-item .step-content ::ng-deep ads-icon svg{width:16px!important;height:16px!important}.horizontal-stepper-container .step-item .step-content .step-title{color:var(--color-medium);font-size:14px;line-height:18px;min-width:51px;overflow-wrap:break-word;text-align:center}.horizontal-stepper-container .step-item .step-line{flex:1 1 0;height:2px;background-color:var(--color-light);border-radius:0 1px 1px 0;margin-left:4px;min-width:16px}@media(min-width:430px){.horizontal-stepper-container .step-item .step-line{min-width:55px;margin-left:12px}}\n"] }]
|
|
9779
9779
|
}], ctorParameters: () => [{ type: i1.AdsIconRegistry }], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: true }] }] } });
|
|
9780
9780
|
|
|
9781
9781
|
class AdsHorizontalStepperModule {
|