@eui/components 18.0.0-next.28 → 18.0.0-next.29
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/docs/components/EuiPageColumnComponent.html +1 -1
- package/docs/components/EuiPageFooterComponent.html +8 -0
- package/docs/dependencies.html +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/eui-block-document/eui-block-document.component.mjs +2 -2
- package/esm2022/eui-button/eui-button.component.mjs +2 -2
- package/esm2022/eui-chip/eui-chip.component.mjs +2 -2
- package/esm2022/eui-file-upload/eui-file-upload.component.mjs +2 -2
- package/esm2022/eui-growl/eui-growl.component.mjs +2 -2
- package/esm2022/eui-icon-toggle/eui-icon-toggle.component.mjs +2 -1
- package/esm2022/eui-label/eui-label.component.mjs +2 -2
- package/esm2022/eui-menu/eui-menu-item.component.mjs +2 -2
- package/esm2022/eui-menu/eui-menu.component.mjs +2 -2
- package/esm2022/eui-page/components/eui-page-column/eui-page-column.component.mjs +3 -2
- package/esm2022/eui-page/components/eui-page-footer/eui-page-footer.component.mjs +12 -3
- package/esm2022/eui-slide-toggle/eui-slide-toggle.component.mjs +2 -2
- package/esm2022/eui-timeline/eui-timeline-item.component.mjs +2 -2
- package/esm2022/eui-timeline/eui-timeline.component.mjs +2 -2
- package/esm2022/eui-wizard/eui-wizard-step.component.mjs +2 -2
- package/esm2022/eui-wizard/eui-wizard.component.mjs +2 -2
- package/eui-icon-toggle/eui-icon-toggle.component.d.ts.map +1 -1
- package/eui-page/components/eui-page-column/eui-page-column.component.d.ts +1 -1
- package/eui-page/components/eui-page-column/eui-page-column.component.d.ts.map +1 -1
- package/eui-page/components/eui-page-footer/eui-page-footer.component.d.ts +2 -1
- package/eui-page/components/eui-page-footer/eui-page-footer.component.d.ts.map +1 -1
- package/fesm2022/eui-components-eui-block-document.mjs +2 -2
- package/fesm2022/eui-components-eui-button.mjs +2 -2
- package/fesm2022/eui-components-eui-chip.mjs +2 -2
- package/fesm2022/eui-components-eui-file-upload.mjs +2 -2
- package/fesm2022/eui-components-eui-growl.mjs +2 -2
- package/fesm2022/eui-components-eui-growl.mjs.map +1 -1
- package/fesm2022/eui-components-eui-icon-toggle.mjs.map +2 -2
- package/fesm2022/eui-components-eui-label.mjs +2 -2
- package/fesm2022/eui-components-eui-menu.mjs +4 -4
- package/fesm2022/eui-components-eui-page.mjs +14 -4
- package/fesm2022/eui-components-eui-page.mjs.map +3 -3
- package/fesm2022/eui-components-eui-slide-toggle.mjs +2 -2
- package/fesm2022/eui-components-eui-timeline.mjs +4 -4
- package/fesm2022/eui-components-eui-wizard.mjs +4 -4
- package/package.json +21 -21
|
@@ -73,12 +73,12 @@ var EuiWizardStepComponent = class _EuiWizardStepComponent {
|
|
|
73
73
|
this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: _EuiWizardStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
74
74
|
}
|
|
75
75
|
static {
|
|
76
|
-
this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiWizardStepComponent, selector: "eui-wizard-step", inputs: { id: "id", indexLabel: "indexLabel", indexIconClass: "indexIconClass", indexIconSvgName: "indexIconSvgName", label: "label", subLabel: "subLabel", index: "index", url: "url", isCompleted: "isCompleted", isActive: "isActive", isShowStepTitle: "isShowStepTitle", isInvalid: "isInvalid", isWarning: "isWarning", isDisabled: "isDisabled" }, ngImport: i0, template: '<ng-container *ngIf="isActive">\n <ng-content></ng-content>\n</ng-container>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-
|
|
76
|
+
this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiWizardStepComponent, selector: "eui-wizard-step", inputs: { id: "id", indexLabel: "indexLabel", indexIconClass: "indexIconClass", indexIconSvgName: "indexIconSvgName", label: "label", subLabel: "subLabel", index: "index", url: "url", isCompleted: "isCompleted", isActive: "isActive", isShowStepTitle: "isShowStepTitle", isInvalid: "isInvalid", isWarning: "isWarning", isDisabled: "isDisabled" }, ngImport: i0, template: '<ng-container *ngIf="isActive">\n <ng-content></ng-content>\n</ng-container>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-80)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-success-110);border-color:var(--eui-base-color-success-110);color:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-success-110)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-success-120)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-success-110)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-danger-100)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-danger-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-grey-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-warning-140)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-warning-140)}.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-label,.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-sub-label,.eui-wizard-step--disabled .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-90)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-grey-25)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-grey-80)}.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--completed .eui-wizard-step__bullet-item-icon,.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--error .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed:hover{cursor:not-allowed}.eui-wizard-step:focus .eui-wizard-step__bullet-item{border:2px solid transparent;border-color:var(--eui-base-color-accent-110);border-radius:50%}.eui-wizard-step:first-child .eui-wizard-step__indicator-wrapper{margin-left:50%;width:50%}.eui-wizard-step:last-child .eui-wizard-step__indicator-wrapper{margin-right:50%;width:50%}\n'], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
77
77
|
}
|
|
78
78
|
};
|
|
79
79
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i0, type: EuiWizardStepComponent, decorators: [{
|
|
80
80
|
type: Component,
|
|
81
|
-
args: [{ selector: "eui-wizard-step", changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: '<ng-container *ngIf="isActive">\n <ng-content></ng-content>\n</ng-container>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-
|
|
81
|
+
args: [{ selector: "eui-wizard-step", changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: '<ng-container *ngIf="isActive">\n <ng-content></ng-content>\n</ng-container>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-80)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-success-110);border-color:var(--eui-base-color-success-110);color:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-success-110)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-success-120)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-success-110)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-danger-100)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-danger-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-grey-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-warning-140)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-warning-140)}.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-label,.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-sub-label,.eui-wizard-step--disabled .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-90)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-grey-25)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-grey-80)}.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--completed .eui-wizard-step__bullet-item-icon,.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--error .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed:hover{cursor:not-allowed}.eui-wizard-step:focus .eui-wizard-step__bullet-item{border:2px solid transparent;border-color:var(--eui-base-color-accent-110);border-radius:50%}.eui-wizard-step:first-child .eui-wizard-step__indicator-wrapper{margin-left:50%;width:50%}.eui-wizard-step:last-child .eui-wizard-step__indicator-wrapper{margin-right:50%;width:50%}\n'] }]
|
|
82
82
|
}], propDecorators: { id: [{
|
|
83
83
|
type: Input
|
|
84
84
|
}], indexLabel: [{
|
|
@@ -245,12 +245,12 @@ var EuiWizardComponent = class _EuiWizardComponent {
|
|
|
245
245
|
this.ɵfac = i02.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: _EuiWizardComponent, deps: [], target: i02.ɵɵFactoryTarget.Component });
|
|
246
246
|
}
|
|
247
247
|
static {
|
|
248
|
-
this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiWizardComponent, selector: "eui-wizard", inputs: { activeStepIndex: "activeStepIndex", steps: "steps", tabindex: "tabindex", e2eAttr: "e2eAttr", isCustomContent: "isCustomContent", isShowStepTitle: "isShowStepTitle", isNavigationAllowed: "isNavigationAllowed" }, outputs: { selectStep: "selectStep" }, queries: [{ propertyName: "childrenSteps", predicate: EuiWizardStepComponent }], viewQueries: [{ propertyName: "canBeFocused", predicate: ["canBeFocused"], descendants: true }], usesOnChanges: true, ngImport: i02, template: '<div class="eui-wizard" role="tablist" aria-orientation="horizontal" aria-label="" attr.data-e2e="{{ e2eAttr }}">\n <div\n #canBeFocused\n *ngFor="let step of steps; let idx = index; trackBy: trackByFn"\n class="eui-wizard-step"\n role="tab"\n [id]="step.id"\n attr.aria-label="{{ step?.label }} {{ step?.subLabel }}"\n [attr.aria-disabled]="step?.isDisabled"\n [attr.aria-controls]="stepContentId"\n [tabindex]="step?.isDisabled || !isNavigationAllowed ? -1 : tabindex"\n [class.eui-wizard-step--completed]="step?.isCompleted"\n [class.eui-wizard-step--notallowed]="!isNavigationAllowed"\n [class.eui-wizard-step--active]="step?.isActive"\n [class.eui-wizard-step--disabled]="step?.isDisabled || !isNavigationAllowed"\n [class.eui-wizard-step--error]="step?.isInvalid"\n [class.eui-wizard-step--warning]="step?.isWarning"\n (click)="onSelectStep(step, idx + 1)"\n (keydown)="onKeyDown($event)">\n <div class="eui-wizard-step__indicator-wrapper" role="presentation"></div>\n\n <div class="eui-wizard-step__bullet-item">\n <span class="eui-wizard-step__bullet-item-icon">\n <ng-container *ngIf="!step?.indexIconClass && !step?.indexIconSvgName; else customIconContent">\n <eui-icon-svg *ngIf="step?.isCompleted && !step?.isActive" icon="eui-check"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isInvalid && !step?.isActive" icon="eui-exclamation"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isActive" icon="eui-create"></eui-icon-svg>\n </ng-container>\n\n <ng-template #customIconContent>\n <!-- v15 OK-->\n <span *ngIf="step?.indexIconClass && step?.indexIconClass !== undefined" role="presentation">\n <span class="eui-wizard-step__icon eui-icon {{ step?.indexIconClass }}"></span>\n </span>\n\n <span *ngIf="step?.indexIconSvgName && step?.indexIconSvgName !== undefined" role="presentation">\n <eui-icon-svg icon="{{ step?.indexIconSvgName }}" class="eui-wizard-step__icon"></eui-icon-svg>\n </span>\n </ng-template>\n\n <span\n *ngIf="!step?.indexIconClass && !step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid"\n role="presentation">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\n </span>\n </span>\n </div>\n <div class="eui-wizard-step__label-wrapper" role="presentation">\n <div class="eui-wizard-step__label-wrapper-label" role="presentation">\n {{ step?.label }}\n </div>\n <div class="eui-wizard-step__label-wrapper-sub-label" role="presentation">\n {{ step?.subLabel }}\n </div>\n </div>\n\n <div *ngIf="step?.isActive" class="eui-wizard-step__current-marker" role="presentation">\n <eui-icon-svg icon="eui-ecl-solid-arrow" class="eui-wizard-step__current-marker-icon"></eui-icon-svg>\n </div>\n </div>\n</div>\n<div [id]="stepContentId" class="step-content" role="tabpanel" [attr.aria-labelledby]="stepIds">\n <ng-content></ng-content>\n</div>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-
|
|
248
|
+
this.ɵcmp = i02.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.4", type: _EuiWizardComponent, selector: "eui-wizard", inputs: { activeStepIndex: "activeStepIndex", steps: "steps", tabindex: "tabindex", e2eAttr: "e2eAttr", isCustomContent: "isCustomContent", isShowStepTitle: "isShowStepTitle", isNavigationAllowed: "isNavigationAllowed" }, outputs: { selectStep: "selectStep" }, queries: [{ propertyName: "childrenSteps", predicate: EuiWizardStepComponent }], viewQueries: [{ propertyName: "canBeFocused", predicate: ["canBeFocused"], descendants: true }], usesOnChanges: true, ngImport: i02, template: '<div class="eui-wizard" role="tablist" aria-orientation="horizontal" aria-label="" attr.data-e2e="{{ e2eAttr }}">\n <div\n #canBeFocused\n *ngFor="let step of steps; let idx = index; trackBy: trackByFn"\n class="eui-wizard-step"\n role="tab"\n [id]="step.id"\n attr.aria-label="{{ step?.label }} {{ step?.subLabel }}"\n [attr.aria-disabled]="step?.isDisabled"\n [attr.aria-controls]="stepContentId"\n [tabindex]="step?.isDisabled || !isNavigationAllowed ? -1 : tabindex"\n [class.eui-wizard-step--completed]="step?.isCompleted"\n [class.eui-wizard-step--notallowed]="!isNavigationAllowed"\n [class.eui-wizard-step--active]="step?.isActive"\n [class.eui-wizard-step--disabled]="step?.isDisabled || !isNavigationAllowed"\n [class.eui-wizard-step--error]="step?.isInvalid"\n [class.eui-wizard-step--warning]="step?.isWarning"\n (click)="onSelectStep(step, idx + 1)"\n (keydown)="onKeyDown($event)">\n <div class="eui-wizard-step__indicator-wrapper" role="presentation"></div>\n\n <div class="eui-wizard-step__bullet-item">\n <span class="eui-wizard-step__bullet-item-icon">\n <ng-container *ngIf="!step?.indexIconClass && !step?.indexIconSvgName; else customIconContent">\n <eui-icon-svg *ngIf="step?.isCompleted && !step?.isActive" icon="eui-check"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isInvalid && !step?.isActive" icon="eui-exclamation"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isActive" icon="eui-create"></eui-icon-svg>\n </ng-container>\n\n <ng-template #customIconContent>\n <!-- v15 OK-->\n <span *ngIf="step?.indexIconClass && step?.indexIconClass !== undefined" role="presentation">\n <span class="eui-wizard-step__icon eui-icon {{ step?.indexIconClass }}"></span>\n </span>\n\n <span *ngIf="step?.indexIconSvgName && step?.indexIconSvgName !== undefined" role="presentation">\n <eui-icon-svg icon="{{ step?.indexIconSvgName }}" class="eui-wizard-step__icon"></eui-icon-svg>\n </span>\n </ng-template>\n\n <span\n *ngIf="!step?.indexIconClass && !step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid"\n role="presentation">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\n </span>\n </span>\n </div>\n <div class="eui-wizard-step__label-wrapper" role="presentation">\n <div class="eui-wizard-step__label-wrapper-label" role="presentation">\n {{ step?.label }}\n </div>\n <div class="eui-wizard-step__label-wrapper-sub-label" role="presentation">\n {{ step?.subLabel }}\n </div>\n </div>\n\n <div *ngIf="step?.isActive" class="eui-wizard-step__current-marker" role="presentation">\n <eui-icon-svg icon="eui-ecl-solid-arrow" class="eui-wizard-step__current-marker-icon"></eui-icon-svg>\n </div>\n </div>\n</div>\n<div [id]="stepContentId" class="step-content" role="tabpanel" [attr.aria-labelledby]="stepIds">\n <ng-content></ng-content>\n</div>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-80)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-success-110);border-color:var(--eui-base-color-success-110);color:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-success-110)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-success-120)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-success-110)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-danger-100)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-danger-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-grey-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-warning-140)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-warning-140)}.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-label,.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-sub-label,.eui-wizard-step--disabled .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-90)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-grey-25)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-grey-80)}.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--completed .eui-wizard-step__bullet-item-icon,.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--error .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed:hover{cursor:not-allowed}.eui-wizard-step:focus .eui-wizard-step__bullet-item{border:2px solid transparent;border-color:var(--eui-base-color-accent-110);border-radius:50%}.eui-wizard-step:first-child .eui-wizard-step__indicator-wrapper{margin-left:50%;width:50%}.eui-wizard-step:last-child .eui-wizard-step__indicator-wrapper{margin-right:50%;width:50%}\n'], dependencies: [{ kind: "directive", type: i12.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i12.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "size", "fillColor", "set", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }], encapsulation: i02.ViewEncapsulation.None });
|
|
249
249
|
}
|
|
250
250
|
};
|
|
251
251
|
i02.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.4", ngImport: i02, type: EuiWizardComponent, decorators: [{
|
|
252
252
|
type: Component2,
|
|
253
|
-
args: [{ selector: "eui-wizard", encapsulation: ViewEncapsulation3.None, template: '<div class="eui-wizard" role="tablist" aria-orientation="horizontal" aria-label="" attr.data-e2e="{{ e2eAttr }}">\n <div\n #canBeFocused\n *ngFor="let step of steps; let idx = index; trackBy: trackByFn"\n class="eui-wizard-step"\n role="tab"\n [id]="step.id"\n attr.aria-label="{{ step?.label }} {{ step?.subLabel }}"\n [attr.aria-disabled]="step?.isDisabled"\n [attr.aria-controls]="stepContentId"\n [tabindex]="step?.isDisabled || !isNavigationAllowed ? -1 : tabindex"\n [class.eui-wizard-step--completed]="step?.isCompleted"\n [class.eui-wizard-step--notallowed]="!isNavigationAllowed"\n [class.eui-wizard-step--active]="step?.isActive"\n [class.eui-wizard-step--disabled]="step?.isDisabled || !isNavigationAllowed"\n [class.eui-wizard-step--error]="step?.isInvalid"\n [class.eui-wizard-step--warning]="step?.isWarning"\n (click)="onSelectStep(step, idx + 1)"\n (keydown)="onKeyDown($event)">\n <div class="eui-wizard-step__indicator-wrapper" role="presentation"></div>\n\n <div class="eui-wizard-step__bullet-item">\n <span class="eui-wizard-step__bullet-item-icon">\n <ng-container *ngIf="!step?.indexIconClass && !step?.indexIconSvgName; else customIconContent">\n <eui-icon-svg *ngIf="step?.isCompleted && !step?.isActive" icon="eui-check"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isInvalid && !step?.isActive" icon="eui-exclamation"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isActive" icon="eui-create"></eui-icon-svg>\n </ng-container>\n\n <ng-template #customIconContent>\n <!-- v15 OK-->\n <span *ngIf="step?.indexIconClass && step?.indexIconClass !== undefined" role="presentation">\n <span class="eui-wizard-step__icon eui-icon {{ step?.indexIconClass }}"></span>\n </span>\n\n <span *ngIf="step?.indexIconSvgName && step?.indexIconSvgName !== undefined" role="presentation">\n <eui-icon-svg icon="{{ step?.indexIconSvgName }}" class="eui-wizard-step__icon"></eui-icon-svg>\n </span>\n </ng-template>\n\n <span\n *ngIf="!step?.indexIconClass && !step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid"\n role="presentation">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\n </span>\n </span>\n </div>\n <div class="eui-wizard-step__label-wrapper" role="presentation">\n <div class="eui-wizard-step__label-wrapper-label" role="presentation">\n {{ step?.label }}\n </div>\n <div class="eui-wizard-step__label-wrapper-sub-label" role="presentation">\n {{ step?.subLabel }}\n </div>\n </div>\n\n <div *ngIf="step?.isActive" class="eui-wizard-step__current-marker" role="presentation">\n <eui-icon-svg icon="eui-ecl-solid-arrow" class="eui-wizard-step__current-marker-icon"></eui-icon-svg>\n </div>\n </div>\n</div>\n<div [id]="stepContentId" class="step-content" role="tabpanel" [attr.aria-labelledby]="stepIds">\n <ng-content></ng-content>\n</div>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-
|
|
253
|
+
args: [{ selector: "eui-wizard", encapsulation: ViewEncapsulation3.None, template: '<div class="eui-wizard" role="tablist" aria-orientation="horizontal" aria-label="" attr.data-e2e="{{ e2eAttr }}">\n <div\n #canBeFocused\n *ngFor="let step of steps; let idx = index; trackBy: trackByFn"\n class="eui-wizard-step"\n role="tab"\n [id]="step.id"\n attr.aria-label="{{ step?.label }} {{ step?.subLabel }}"\n [attr.aria-disabled]="step?.isDisabled"\n [attr.aria-controls]="stepContentId"\n [tabindex]="step?.isDisabled || !isNavigationAllowed ? -1 : tabindex"\n [class.eui-wizard-step--completed]="step?.isCompleted"\n [class.eui-wizard-step--notallowed]="!isNavigationAllowed"\n [class.eui-wizard-step--active]="step?.isActive"\n [class.eui-wizard-step--disabled]="step?.isDisabled || !isNavigationAllowed"\n [class.eui-wizard-step--error]="step?.isInvalid"\n [class.eui-wizard-step--warning]="step?.isWarning"\n (click)="onSelectStep(step, idx + 1)"\n (keydown)="onKeyDown($event)">\n <div class="eui-wizard-step__indicator-wrapper" role="presentation"></div>\n\n <div class="eui-wizard-step__bullet-item">\n <span class="eui-wizard-step__bullet-item-icon">\n <ng-container *ngIf="!step?.indexIconClass && !step?.indexIconSvgName; else customIconContent">\n <eui-icon-svg *ngIf="step?.isCompleted && !step?.isActive" icon="eui-check"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isInvalid && !step?.isActive" icon="eui-exclamation"></eui-icon-svg>\n <eui-icon-svg *ngIf="step?.isActive" icon="eui-create"></eui-icon-svg>\n </ng-container>\n\n <ng-template #customIconContent>\n <!-- v15 OK-->\n <span *ngIf="step?.indexIconClass && step?.indexIconClass !== undefined" role="presentation">\n <span class="eui-wizard-step__icon eui-icon {{ step?.indexIconClass }}"></span>\n </span>\n\n <span *ngIf="step?.indexIconSvgName && step?.indexIconSvgName !== undefined" role="presentation">\n <eui-icon-svg icon="{{ step?.indexIconSvgName }}" class="eui-wizard-step__icon"></eui-icon-svg>\n </span>\n </ng-template>\n\n <span\n *ngIf="!step?.indexIconClass && !step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid"\n role="presentation">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\n </span>\n </span>\n </div>\n <div class="eui-wizard-step__label-wrapper" role="presentation">\n <div class="eui-wizard-step__label-wrapper-label" role="presentation">\n {{ step?.label }}\n </div>\n <div class="eui-wizard-step__label-wrapper-sub-label" role="presentation">\n {{ step?.subLabel }}\n </div>\n </div>\n\n <div *ngIf="step?.isActive" class="eui-wizard-step__current-marker" role="presentation">\n <eui-icon-svg icon="eui-ecl-solid-arrow" class="eui-wizard-step__current-marker-icon"></eui-icon-svg>\n </div>\n </div>\n</div>\n<div [id]="stepContentId" class="step-content" role="tabpanel" [attr.aria-labelledby]="stepIds">\n <ng-content></ng-content>\n</div>\n', styles: ['.eui-wizard{border-bottom:1px solid var(--eui-base-color-grey-20);display:flex;margin:var(--eui-base-spacing-xl) 0 -1px 0;padding-bottom:var(--eui-base-spacing-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-base-spacing-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__current-marker-icon>svg{color:var(--eui-base-color-grey-75);fill:var(--eui-base-color-grey-75);height:var(--eui-base-spacing-4xl);width:var(--eui-base-spacing-4xl)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-base-color-grey-25);content:"";margin-bottom:var(--eui-base-spacing-s);top:var(--eui-base-spacing-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-base-color-white);border:2px solid var(--eui-base-color-grey-80);border-radius:100%;height:var(--eui-base-spacing-3xl);margin:-40px auto 0;padding-top:var(--eui-base-spacing-xs);width:var(--eui-base-spacing-3xl)}.eui-t-compact .eui-wizard-step__bullet-item{margin-top:-30px}.eui-wizard-step__label-wrapper{margin-top:var(--eui-base-spacing-m)}.eui-wizard-step__label-wrapper-label{font:normal normal 400 1rem/1.75rem var(--eui-base-font-family);font-weight:700}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-base-spacing-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-primary-100);color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-primary-100)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-primary-80)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-success-110);border-color:var(--eui-base-color-success-110);color:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-success-110)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-base-color-success-120)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-success-110)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-danger-100);border-color:var(--eui-base-color-danger-100);color:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-danger-100)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-danger-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-base-color-warning-100);border-color:var(--eui-base-color-warning-100);color:var(--eui-base-color-grey-100)}.eui-wizard-step--warning .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-base-color-white);fill:var(--eui-base-color-white)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-warning-140)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-base-color-warning-140)}.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-label,.eui-wizard-step--disabled .eui-wizard-step__label-wrapper-sub-label,.eui-wizard-step--disabled .eui-wizard-step__bullet-item{border-color:var(--eui-base-color-grey-20);color:var(--eui-base-color-grey-90)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-base-color-grey-25)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-grey-80)}.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--completed .eui-wizard-step__bullet-item-icon,.eui-wizard-step--notallowed.eui-wizard-step--disabled.eui-wizard-step--error .eui-wizard-step__bullet-item-icon{color:var(--eui-base-color-white)}.eui-wizard-step--notallowed:hover{cursor:not-allowed}.eui-wizard-step:focus .eui-wizard-step__bullet-item{border:2px solid transparent;border-color:var(--eui-base-color-accent-110);border-radius:50%}.eui-wizard-step:first-child .eui-wizard-step__indicator-wrapper{margin-left:50%;width:50%}.eui-wizard-step:last-child .eui-wizard-step__indicator-wrapper{margin-right:50%;width:50%}\n'] }]
|
|
254
254
|
}], propDecorators: { activeStepIndex: [{
|
|
255
255
|
type: Input2
|
|
256
256
|
}], steps: [{
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@eui/components",
|
|
3
|
-
"version": "18.0.0-next.
|
|
3
|
+
"version": "18.0.0-next.29",
|
|
4
4
|
"tag": "next",
|
|
5
5
|
"description": "eUI components package",
|
|
6
6
|
"homepage": "https://eui.ecdevops.eu",
|
|
@@ -10,8 +10,8 @@
|
|
|
10
10
|
"url": "https://citnet.tech.ec.europa.eu/CITnet/stash/projects/CSDR/repos/eui"
|
|
11
11
|
},
|
|
12
12
|
"peerDependencies": {
|
|
13
|
-
"@eui/core": "18.0.0-next.
|
|
14
|
-
"@eui/base": "18.0.0-next.
|
|
13
|
+
"@eui/core": "18.0.0-next.29",
|
|
14
|
+
"@eui/base": "18.0.0-next.29",
|
|
15
15
|
"@angular/common": "^18.0.0-next.2",
|
|
16
16
|
"@angular/core": "^18.0.0-next.2",
|
|
17
17
|
"@angular/forms": "^18.0.0-next.2",
|
|
@@ -186,6 +186,24 @@
|
|
|
186
186
|
"esm": "./esm2022/eui-ecl-label/eui-components-eui-ecl-label.mjs",
|
|
187
187
|
"default": "./fesm2022/eui-components-eui-ecl-label.mjs"
|
|
188
188
|
},
|
|
189
|
+
"./eui-feedback-message": {
|
|
190
|
+
"types": "./eui-feedback-message/index.d.ts",
|
|
191
|
+
"esm2022": "./esm2022/eui-feedback-message/eui-components-eui-feedback-message.mjs",
|
|
192
|
+
"esm": "./esm2022/eui-feedback-message/eui-components-eui-feedback-message.mjs",
|
|
193
|
+
"default": "./fesm2022/eui-components-eui-feedback-message.mjs"
|
|
194
|
+
},
|
|
195
|
+
"./eui-fieldset": {
|
|
196
|
+
"types": "./eui-fieldset/index.d.ts",
|
|
197
|
+
"esm2022": "./esm2022/eui-fieldset/eui-components-eui-fieldset.mjs",
|
|
198
|
+
"esm": "./esm2022/eui-fieldset/eui-components-eui-fieldset.mjs",
|
|
199
|
+
"default": "./fesm2022/eui-components-eui-fieldset.mjs"
|
|
200
|
+
},
|
|
201
|
+
"./eui-file-upload": {
|
|
202
|
+
"types": "./eui-file-upload/index.d.ts",
|
|
203
|
+
"esm2022": "./esm2022/eui-file-upload/eui-components-eui-file-upload.mjs",
|
|
204
|
+
"esm": "./esm2022/eui-file-upload/eui-components-eui-file-upload.mjs",
|
|
205
|
+
"default": "./fesm2022/eui-components-eui-file-upload.mjs"
|
|
206
|
+
},
|
|
189
207
|
"./eui-growl": {
|
|
190
208
|
"types": "./eui-growl/index.d.ts",
|
|
191
209
|
"esm2022": "./esm2022/eui-growl/eui-components-eui-growl.mjs",
|
|
@@ -264,12 +282,6 @@
|
|
|
264
282
|
"esm": "./esm2022/eui-message-box/eui-components-eui-message-box.mjs",
|
|
265
283
|
"default": "./fesm2022/eui-components-eui-message-box.mjs"
|
|
266
284
|
},
|
|
267
|
-
"./eui-feedback-message": {
|
|
268
|
-
"types": "./eui-feedback-message/index.d.ts",
|
|
269
|
-
"esm2022": "./esm2022/eui-feedback-message/eui-components-eui-feedback-message.mjs",
|
|
270
|
-
"esm": "./esm2022/eui-feedback-message/eui-components-eui-feedback-message.mjs",
|
|
271
|
-
"default": "./fesm2022/eui-components-eui-feedback-message.mjs"
|
|
272
|
-
},
|
|
273
285
|
"./eui-overlay": {
|
|
274
286
|
"types": "./eui-overlay/index.d.ts",
|
|
275
287
|
"esm2022": "./esm2022/eui-overlay/eui-components-eui-overlay.mjs",
|
|
@@ -318,12 +330,6 @@
|
|
|
318
330
|
"esm": "./esm2022/eui-sidebar-menu/eui-components-eui-sidebar-menu.mjs",
|
|
319
331
|
"default": "./fesm2022/eui-components-eui-sidebar-menu.mjs"
|
|
320
332
|
},
|
|
321
|
-
"./eui-fieldset": {
|
|
322
|
-
"types": "./eui-fieldset/index.d.ts",
|
|
323
|
-
"esm2022": "./esm2022/eui-fieldset/eui-components-eui-fieldset.mjs",
|
|
324
|
-
"esm": "./esm2022/eui-fieldset/eui-components-eui-fieldset.mjs",
|
|
325
|
-
"default": "./fesm2022/eui-components-eui-fieldset.mjs"
|
|
326
|
-
},
|
|
327
333
|
"./eui-skeleton": {
|
|
328
334
|
"types": "./eui-skeleton/index.d.ts",
|
|
329
335
|
"esm2022": "./esm2022/eui-skeleton/eui-components-eui-skeleton.mjs",
|
|
@@ -336,12 +342,6 @@
|
|
|
336
342
|
"esm": "./esm2022/eui-slide-toggle/eui-components-eui-slide-toggle.mjs",
|
|
337
343
|
"default": "./fesm2022/eui-components-eui-slide-toggle.mjs"
|
|
338
344
|
},
|
|
339
|
-
"./eui-file-upload": {
|
|
340
|
-
"types": "./eui-file-upload/index.d.ts",
|
|
341
|
-
"esm2022": "./esm2022/eui-file-upload/eui-components-eui-file-upload.mjs",
|
|
342
|
-
"esm": "./esm2022/eui-file-upload/eui-components-eui-file-upload.mjs",
|
|
343
|
-
"default": "./fesm2022/eui-components-eui-file-upload.mjs"
|
|
344
|
-
},
|
|
345
345
|
"./eui-table": {
|
|
346
346
|
"types": "./eui-table/index.d.ts",
|
|
347
347
|
"esm2022": "./esm2022/eui-table/eui-components-eui-table.mjs",
|