@eui/components 18.0.0-next.43 → 18.0.0-next.44
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/EuiFieldsetComponent.html +37 -1
- package/docs/components/EuiPopoverComponent.html +1 -1
- package/docs/dependencies.html +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/esm2022/directives/eui-tooltip/container/eui-tooltip-container.component.mjs +3 -3
- package/esm2022/eui-alert/eui-alert.component.mjs +2 -2
- package/esm2022/eui-autocomplete/eui-autocomplete.component.mjs +3 -3
- package/esm2022/eui-avatar/eui-avatar.component.mjs +2 -2
- package/esm2022/eui-block-content/eui-block-content.component.mjs +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-button-v2/eui-button-v2.component.mjs +2 -2
- package/esm2022/eui-card/eui-card.component.mjs +2 -2
- package/esm2022/eui-chip/eui-chip.component.mjs +2 -2
- package/esm2022/eui-dashboard-button/eui-dashboard-button.component.mjs +2 -2
- package/esm2022/eui-dashboard-card/eui-dashboard-card.component.mjs +2 -2
- package/esm2022/eui-date-range-selector/eui-date-range-selector.component.mjs +2 -2
- package/esm2022/eui-datepicker/eui-datepicker.component.mjs +2 -2
- package/esm2022/eui-dialog/container/eui-dialog-container.component.mjs +2 -2
- package/esm2022/eui-dialog/eui-dialog.component.mjs +2 -2
- package/esm2022/eui-discussion-thread/eui-discussion-thread.component.mjs +2 -2
- package/esm2022/eui-dropdown/dropdown-item/eui-dropdown-item.component.mjs +2 -2
- package/esm2022/eui-dropdown/eui-dropdown.component.mjs +3 -3
- package/esm2022/eui-fieldset/eui-fieldset.component.mjs +14 -4
- package/esm2022/eui-file-upload/eui-file-upload.component.mjs +2 -2
- package/esm2022/eui-icon/eui-icon-button-expander/eui-icon-button-expander.component.mjs +2 -2
- package/esm2022/eui-icon/eui-icon-svg.component.mjs +3 -3
- package/esm2022/eui-input-group/eui-input-group.component.mjs +2 -2
- package/esm2022/eui-input-number/eui-input-number.component.mjs +2 -2
- package/esm2022/eui-input-radio/eui-input-radio.component.mjs +2 -2
- package/esm2022/eui-input-text/eui-input-text.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/eui-page.component.mjs +2 -2
- package/esm2022/eui-popover/eui-popover.component.mjs +3 -3
- package/esm2022/eui-progress-circle/eui-progress-circle.component.mjs +2 -2
- package/esm2022/eui-select/eui-select.component.mjs +2 -2
- package/esm2022/eui-skeleton/eui-skeleton.component.mjs +2 -2
- package/esm2022/eui-slide-toggle/eui-slide-toggle.component.mjs +3 -3
- package/esm2022/eui-table/eui-table.component.mjs +2 -2
- package/esm2022/eui-textarea/eui-textarea.component.mjs +2 -2
- package/esm2022/eui-timebar/eui-timebar.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/esm2022/externals/eui-editor/eui-editor.component.mjs +3 -3
- package/eui-fieldset/eui-fieldset.component.d.ts +7 -3
- package/eui-fieldset/eui-fieldset.component.d.ts.map +1 -1
- package/fesm2022/eui-components-directives.mjs +2 -2
- package/fesm2022/eui-components-directives.mjs.map +1 -1
- package/fesm2022/eui-components-eui-alert.mjs +2 -2
- package/fesm2022/eui-components-eui-alert.mjs.map +1 -1
- package/fesm2022/eui-components-eui-autocomplete.mjs +2 -2
- package/fesm2022/eui-components-eui-autocomplete.mjs.map +1 -1
- package/fesm2022/eui-components-eui-avatar.mjs +2 -2
- package/fesm2022/eui-components-eui-avatar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-block-content.mjs +2 -2
- package/fesm2022/eui-components-eui-block-content.mjs.map +1 -1
- package/fesm2022/eui-components-eui-block-document.mjs +2 -2
- package/fesm2022/eui-components-eui-block-document.mjs.map +1 -1
- package/fesm2022/eui-components-eui-button-v2.mjs +2 -2
- package/fesm2022/eui-components-eui-button-v2.mjs.map +1 -1
- package/fesm2022/eui-components-eui-button.mjs +2 -2
- package/fesm2022/eui-components-eui-button.mjs.map +1 -1
- package/fesm2022/eui-components-eui-card.mjs +2 -2
- package/fesm2022/eui-components-eui-card.mjs.map +1 -1
- package/fesm2022/eui-components-eui-chip.mjs +2 -2
- package/fesm2022/eui-components-eui-chip.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dashboard-button.mjs +2 -2
- package/fesm2022/eui-components-eui-dashboard-button.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dashboard-card.mjs +2 -2
- package/fesm2022/eui-components-eui-dashboard-card.mjs.map +1 -1
- package/fesm2022/eui-components-eui-date-range-selector.mjs +2 -2
- package/fesm2022/eui-components-eui-date-range-selector.mjs.map +1 -1
- package/fesm2022/eui-components-eui-datepicker.mjs +2 -2
- package/fesm2022/eui-components-eui-datepicker.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dialog.mjs +4 -4
- package/fesm2022/eui-components-eui-dialog.mjs.map +1 -1
- package/fesm2022/eui-components-eui-discussion-thread.mjs +2 -2
- package/fesm2022/eui-components-eui-discussion-thread.mjs.map +1 -1
- package/fesm2022/eui-components-eui-dropdown.mjs +4 -4
- package/fesm2022/eui-components-eui-dropdown.mjs.map +1 -1
- package/fesm2022/eui-components-eui-fieldset.mjs +13 -3
- package/fesm2022/eui-components-eui-fieldset.mjs.map +2 -2
- package/fesm2022/eui-components-eui-file-upload.mjs +2 -2
- package/fesm2022/eui-components-eui-file-upload.mjs.map +1 -1
- package/fesm2022/eui-components-eui-icon.mjs +4 -4
- package/fesm2022/eui-components-eui-icon.mjs.map +1 -1
- package/fesm2022/eui-components-eui-input-group.mjs +2 -2
- package/fesm2022/eui-components-eui-input-group.mjs.map +1 -1
- package/fesm2022/eui-components-eui-input-number.mjs +2 -2
- package/fesm2022/eui-components-eui-input-number.mjs.map +1 -1
- package/fesm2022/eui-components-eui-input-radio.mjs +2 -2
- package/fesm2022/eui-components-eui-input-radio.mjs.map +1 -1
- package/fesm2022/eui-components-eui-input-text.mjs +2 -2
- package/fesm2022/eui-components-eui-input-text.mjs.map +1 -1
- package/fesm2022/eui-components-eui-menu.mjs +4 -4
- package/fesm2022/eui-components-eui-menu.mjs.map +1 -1
- package/fesm2022/eui-components-eui-page.mjs +2 -2
- package/fesm2022/eui-components-eui-page.mjs.map +1 -1
- package/fesm2022/eui-components-eui-popover.mjs +2 -2
- package/fesm2022/eui-components-eui-popover.mjs.map +2 -2
- package/fesm2022/eui-components-eui-progress-circle.mjs +2 -2
- package/fesm2022/eui-components-eui-progress-circle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-select.mjs +2 -2
- package/fesm2022/eui-components-eui-select.mjs.map +1 -1
- package/fesm2022/eui-components-eui-skeleton.mjs +2 -2
- package/fesm2022/eui-components-eui-skeleton.mjs.map +1 -1
- package/fesm2022/eui-components-eui-slide-toggle.mjs +2 -2
- package/fesm2022/eui-components-eui-slide-toggle.mjs.map +1 -1
- package/fesm2022/eui-components-eui-table.mjs +2 -2
- package/fesm2022/eui-components-eui-table.mjs.map +1 -1
- package/fesm2022/eui-components-eui-textarea.mjs +2 -2
- package/fesm2022/eui-components-eui-textarea.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timebar.mjs +2 -2
- package/fesm2022/eui-components-eui-timebar.mjs.map +1 -1
- package/fesm2022/eui-components-eui-timeline.mjs +4 -4
- package/fesm2022/eui-components-eui-timeline.mjs.map +1 -1
- package/fesm2022/eui-components-eui-wizard.mjs +4 -4
- package/fesm2022/eui-components-eui-wizard.mjs.map +1 -1
- package/fesm2022/eui-components-externals-eui-editor.mjs +2 -2
- package/fesm2022/eui-components-externals-eui-editor.mjs.map +1 -1
- package/package.json +3 -3
@@ -25,11 +25,11 @@ export class EuiTimelineComponent {
|
|
25
25
|
return ['eui-timeline', this.isLeftAligned ? 'eui-timeline--left-aligned' : ''].join(' ').trim();
|
26
26
|
}
|
27
27
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0, type: EuiTimelineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
28
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: EuiTimelineComponent, selector: "eui-timeline", inputs: { e2eAttr: "e2eAttr", isLeftAligned: ["isLeftAligned", "isLeftAligned", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "timelineItems", predicate: EuiTimelineItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-timeline{display:flex;flex-direction:column;margin:0;padding:0;position:relative;width:100%}.eui-timeline .eui-timeline-item{display:flex;flex-direction:row;list-style:none;margin-bottom:var(--eui-s-m);position:relative;width:100%}.eui-timeline .eui-timeline-item .eui-timeline-item__left-content{display:list-item;min-width:calc(11 * var(--eui-s-m));position:relative;text-align:center;word-break:break-all}.eui-timeline .eui-timeline-item .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){align-items:center;background-color:var(--eui-c-white);border-color:var(--eui-c-accent);border-radius:
|
28
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "18.0.0-next.5", type: EuiTimelineComponent, selector: "eui-timeline", inputs: { e2eAttr: "e2eAttr", isLeftAligned: ["isLeftAligned", "isLeftAligned", booleanAttribute] }, host: { properties: { "class": "this.cssClasses", "attr.data-e2e": "this.e2eAttr" } }, queries: [{ propertyName: "timelineItems", predicate: EuiTimelineItemComponent }], usesOnChanges: true, ngImport: i0, template: "<ng-content></ng-content>\n", styles: [".eui-timeline{display:flex;flex-direction:column;margin:0;padding:0;position:relative;width:100%}.eui-timeline .eui-timeline-item{display:flex;flex-direction:row;list-style:none;margin-bottom:var(--eui-s-m);position:relative;width:100%}.eui-timeline .eui-timeline-item .eui-timeline-item__left-content{display:list-item;min-width:calc(11 * var(--eui-s-m));position:relative;text-align:center;word-break:break-all}.eui-timeline .eui-timeline-item .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){align-items:center;background-color:var(--eui-c-white);border-color:var(--eui-c-accent);border-radius:var(--eui-br-max);border-style:solid;border-width:2px;display:flex;flex-direction:column;max-height:calc(var(--eui-s-m) + var(--eui-s-2xs));margin:0 var(--eui-s-m);min-width:calc(var(--eui-s-m) + var(--eui-s-2xs));z-index:2}.eui-timeline .eui-timeline-item .eui-timeline-item__icon:not(.eui-timeline-item__icon--group):after{background-color:var(--eui-c-neutral-lighter);content:\"\";height:calc(100% - var(--eui-s-2xs));position:absolute;top:calc(var(--eui-s-m) + var(--eui-s-2xs));width:2px;z-index:1}.eui-timeline .eui-timeline-item .eui-timeline-item__icon.eui-timeline-item__icon--group{align-items:center;border:1px dashed var(--eui-c-neutral-lighter);display:flex;flex-direction:column;height:auto;margin:0 calc(var(--eui-s-l) + 1px)}.eui-timeline .eui-timeline-item .eui-timeline-item__content{position:relative;top:calc(-1 * var(--eui-s-2xs));width:100%}.eui-timeline .eui-timeline-item .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-neutral);font:var(--eui-f-l-bold)}.eui-timeline .eui-timeline-item .eui-timeline-item__content .eui-timeline-item__subtitle{color:var(--eui-c-neutral-light)}.eui-timeline .eui-timeline-item .eui-timeline-item__date{color:var(--eui-c-neutral);font:var(--eui-f-m-bold)}.eui-timeline .eui-timeline-item .eui-timeline-item__time{color:var(--eui-c-neutral-light)}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__icon:after{left:calc(1 * var(--eui-s-m) + 10px)!important}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__icon.eui-timeline-item__icon--group{align-items:center;border:1px dashed var(--eui-c-neutral-lighter);display:flex;flex-direction:column;height:auto;margin:0 calc(var(--eui-s-l) + 2px)}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__content{padding-bottom:var(--eui-s-s)}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__content .eui-timeline-item__date{color:var(--eui-c-neutral);margin-top:var(--eui-s-xs);position:relative;font:var(--eui-f-m-bold)}.eui-timeline-item.eui-timeline-item--primary .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-primary)}.eui-timeline-item.eui-timeline-item--primary .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--primary .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-primary-dark)}.eui-timeline-item.eui-timeline-item--secondary .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-neutral-lightest)}.eui-timeline-item.eui-timeline-item--secondary .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--secondary .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-neutral-light)}.eui-timeline-item.eui-timeline-item--info .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-info)}.eui-timeline-item.eui-timeline-item--info .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--info .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-info-dark)}.eui-timeline-item.eui-timeline-item--warning .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-warning)}.eui-timeline-item.eui-timeline-item--warning .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--warning .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-warning-dark)}.eui-timeline-item.eui-timeline-item--success .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-success)}.eui-timeline-item.eui-timeline-item--success .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--success .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-success-dark)}.eui-timeline-item.eui-timeline-item--danger .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-danger)}.eui-timeline-item.eui-timeline-item--danger .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--danger .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-danger-dark)}.eui-timeline-item.eui-timeline-item--accent .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-accent)}.eui-timeline-item.eui-timeline-item--accent .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--accent .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-accent-dark)}.eui-timeline-item.eui-timeline-item--more{margin-bottom:0}.eui-timeline-item.eui-timeline-item--more .eui-timeline-item__content{padding-bottom:var(--eui-s-m)}\n"] }); }
|
29
29
|
}
|
30
30
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0, type: EuiTimelineComponent, decorators: [{
|
31
31
|
type: Component,
|
32
|
-
args: [{ selector: 'eui-timeline', template: "<ng-content></ng-content>\n", styles: [".eui-timeline{display:flex;flex-direction:column;margin:0;padding:0;position:relative;width:100%}.eui-timeline .eui-timeline-item{display:flex;flex-direction:row;list-style:none;margin-bottom:var(--eui-s-m);position:relative;width:100%}.eui-timeline .eui-timeline-item .eui-timeline-item__left-content{display:list-item;min-width:calc(11 * var(--eui-s-m));position:relative;text-align:center;word-break:break-all}.eui-timeline .eui-timeline-item .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){align-items:center;background-color:var(--eui-c-white);border-color:var(--eui-c-accent);border-radius:
|
32
|
+
args: [{ selector: 'eui-timeline', template: "<ng-content></ng-content>\n", styles: [".eui-timeline{display:flex;flex-direction:column;margin:0;padding:0;position:relative;width:100%}.eui-timeline .eui-timeline-item{display:flex;flex-direction:row;list-style:none;margin-bottom:var(--eui-s-m);position:relative;width:100%}.eui-timeline .eui-timeline-item .eui-timeline-item__left-content{display:list-item;min-width:calc(11 * var(--eui-s-m));position:relative;text-align:center;word-break:break-all}.eui-timeline .eui-timeline-item .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){align-items:center;background-color:var(--eui-c-white);border-color:var(--eui-c-accent);border-radius:var(--eui-br-max);border-style:solid;border-width:2px;display:flex;flex-direction:column;max-height:calc(var(--eui-s-m) + var(--eui-s-2xs));margin:0 var(--eui-s-m);min-width:calc(var(--eui-s-m) + var(--eui-s-2xs));z-index:2}.eui-timeline .eui-timeline-item .eui-timeline-item__icon:not(.eui-timeline-item__icon--group):after{background-color:var(--eui-c-neutral-lighter);content:\"\";height:calc(100% - var(--eui-s-2xs));position:absolute;top:calc(var(--eui-s-m) + var(--eui-s-2xs));width:2px;z-index:1}.eui-timeline .eui-timeline-item .eui-timeline-item__icon.eui-timeline-item__icon--group{align-items:center;border:1px dashed var(--eui-c-neutral-lighter);display:flex;flex-direction:column;height:auto;margin:0 calc(var(--eui-s-l) + 1px)}.eui-timeline .eui-timeline-item .eui-timeline-item__content{position:relative;top:calc(-1 * var(--eui-s-2xs));width:100%}.eui-timeline .eui-timeline-item .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-neutral);font:var(--eui-f-l-bold)}.eui-timeline .eui-timeline-item .eui-timeline-item__content .eui-timeline-item__subtitle{color:var(--eui-c-neutral-light)}.eui-timeline .eui-timeline-item .eui-timeline-item__date{color:var(--eui-c-neutral);font:var(--eui-f-m-bold)}.eui-timeline .eui-timeline-item .eui-timeline-item__time{color:var(--eui-c-neutral-light)}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__icon:after{left:calc(1 * var(--eui-s-m) + 10px)!important}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__icon.eui-timeline-item__icon--group{align-items:center;border:1px dashed var(--eui-c-neutral-lighter);display:flex;flex-direction:column;height:auto;margin:0 calc(var(--eui-s-l) + 2px)}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__content{padding-bottom:var(--eui-s-s)}.eui-timeline.eui-timeline--left-aligned .eui-timeline-item .eui-timeline-item__content .eui-timeline-item__date{color:var(--eui-c-neutral);margin-top:var(--eui-s-xs);position:relative;font:var(--eui-f-m-bold)}.eui-timeline-item.eui-timeline-item--primary .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-primary)}.eui-timeline-item.eui-timeline-item--primary .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--primary .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-primary-dark)}.eui-timeline-item.eui-timeline-item--secondary .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-neutral-lightest)}.eui-timeline-item.eui-timeline-item--secondary .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--secondary .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-neutral-light)}.eui-timeline-item.eui-timeline-item--info .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-info)}.eui-timeline-item.eui-timeline-item--info .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--info .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-info-dark)}.eui-timeline-item.eui-timeline-item--warning .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-warning)}.eui-timeline-item.eui-timeline-item--warning .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--warning .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-warning-dark)}.eui-timeline-item.eui-timeline-item--success .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-success)}.eui-timeline-item.eui-timeline-item--success .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--success .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-success-dark)}.eui-timeline-item.eui-timeline-item--danger .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-danger)}.eui-timeline-item.eui-timeline-item--danger .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--danger .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-danger-dark)}.eui-timeline-item.eui-timeline-item--accent .eui-timeline-item__icon:not(.eui-timeline-item__icon--group){border-color:var(--eui-c-accent)}.eui-timeline-item.eui-timeline-item--accent .eui-timeline-item__content,.eui-timeline-item.eui-timeline-item--accent .eui-timeline-item__content .eui-timeline-item__title{color:var(--eui-c-accent-dark)}.eui-timeline-item.eui-timeline-item--more{margin-bottom:0}.eui-timeline-item.eui-timeline-item--more .eui-timeline-item__content{padding-bottom:var(--eui-s-m)}\n"] }]
|
33
33
|
}], propDecorators: { cssClasses: [{
|
34
34
|
type: HostBinding,
|
35
35
|
args: ['class']
|
@@ -68,11 +68,11 @@ export class EuiWizardStepComponent {
|
|
68
68
|
};
|
69
69
|
}
|
70
70
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0, type: EuiWizardStepComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
71
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: EuiWizardStepComponent, selector: "eui-wizard-step", inputs: { id: "id", indexLabel: "indexLabel", 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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:
|
71
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", type: EuiWizardStepComponent, selector: "eui-wizard-step", inputs: { id: "id", indexLabel: "indexLabel", 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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:var(--eui-br-max);height:var(--eui-s-3xl);margin:0 auto;margin-top:-2rem;padding-top:var(--eui-s-xs);width:var(--eui-s-3xl)}.eui-wizard-step__bullet-item-text{margin-top:-.5rem;font:var(--eui-f-l-bold)}.eui-wizard-step__label-wrapper{margin-top:var(--eui-s-m)}.eui-wizard-step__label-wrapper-label{font:var(--eui-f-m-bold)}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-s-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-c-primary-darl)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-info)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-c-success);border-color:var(--eui-c-success);color:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-success)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-c-success-dark)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-success)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-c-danger);border-color:var(--eui-c-danger);color:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-danger)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-danger)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-c-warning);border-color:var(--eui-c-warning)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-warning-dark)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-warning-dark)}.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-c-neutral-lightest);color:var(--eui-c-neutral)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-neutral-lightest)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-c-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-c-neutral-light)}.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-c-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-c-accent-dark);border-radius:var(--eui-br-max)}.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 }); }
|
72
72
|
}
|
73
73
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0, type: EuiWizardStepComponent, decorators: [{
|
74
74
|
type: Component,
|
75
|
-
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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:
|
75
|
+
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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:var(--eui-br-max);height:var(--eui-s-3xl);margin:0 auto;margin-top:-2rem;padding-top:var(--eui-s-xs);width:var(--eui-s-3xl)}.eui-wizard-step__bullet-item-text{margin-top:-.5rem;font:var(--eui-f-l-bold)}.eui-wizard-step__label-wrapper{margin-top:var(--eui-s-m)}.eui-wizard-step__label-wrapper-label{font:var(--eui-f-m-bold)}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-s-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-c-primary-darl)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-info)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-c-success);border-color:var(--eui-c-success);color:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-success)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-c-success-dark)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-success)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-c-danger);border-color:var(--eui-c-danger);color:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-danger)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-danger)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-c-warning);border-color:var(--eui-c-warning)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-warning-dark)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-warning-dark)}.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-c-neutral-lightest);color:var(--eui-c-neutral)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-neutral-lightest)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-c-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-c-neutral-light)}.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-c-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-c-accent-dark);border-radius:var(--eui-br-max)}.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"] }]
|
76
76
|
}], propDecorators: { id: [{
|
77
77
|
type: Input
|
78
78
|
}], indexLabel: [{
|
@@ -136,11 +136,11 @@ export class EuiWizardComponent {
|
|
136
136
|
return null;
|
137
137
|
}
|
138
138
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0, type: EuiWizardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
139
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", 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: i0, 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--danger]=\"step?.isInvalid\"\n [class.eui-wizard-step--warning]=\"step?.isWarning\"\n [class.eui--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?.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 <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 </span>\n <span class=\"eui-wizard-step__bullet-item-text\"\n *ngIf=\"!step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid\"\n role=\"presentation\">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\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\" size=\"xl\"></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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:
|
139
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.0.0-next.5", 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: i0, 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--danger]=\"step?.isInvalid\"\n [class.eui-wizard-step--warning]=\"step?.isWarning\"\n [class.eui--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?.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 <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 </span>\n <span class=\"eui-wizard-step__bullet-item-text\"\n *ngIf=\"!step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid\"\n role=\"presentation\">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\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\" size=\"xl\"></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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:var(--eui-br-max);height:var(--eui-s-3xl);margin:0 auto;margin-top:-2rem;padding-top:var(--eui-s-xs);width:var(--eui-s-3xl)}.eui-wizard-step__bullet-item-text{margin-top:-.5rem;font:var(--eui-f-l-bold)}.eui-wizard-step__label-wrapper{margin-top:var(--eui-s-m)}.eui-wizard-step__label-wrapper-label{font:var(--eui-f-m-bold)}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-s-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-c-primary-darl)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-info)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-c-success);border-color:var(--eui-c-success);color:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-success)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-c-success-dark)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-success)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-c-danger);border-color:var(--eui-c-danger);color:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-danger)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-danger)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-c-warning);border-color:var(--eui-c-warning)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-warning-dark)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-warning-dark)}.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-c-neutral-lightest);color:var(--eui-c-neutral)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-neutral-lightest)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-c-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-c-neutral-light)}.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-c-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-c-accent-dark);border-radius:var(--eui-br-max)}.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.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.EuiIconSvgComponent, selector: "eui-icon-svg, span[euiIconSvg], i[euiIconSvg]", inputs: ["icon", "fillColor", "set", "size", "ariaLabelledby", "role", "style", "iconUrl", "transform", "aria-label", "ariaHidden", "focusable", "isLoading", "isInputIcon", "euiStart", "euiEnd"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
140
140
|
}
|
141
141
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.0.0-next.5", ngImport: i0, type: EuiWizardComponent, decorators: [{
|
142
142
|
type: Component,
|
143
|
-
args: [{ selector: 'eui-wizard', encapsulation: ViewEncapsulation.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--danger]=\"step?.isInvalid\"\n [class.eui-wizard-step--warning]=\"step?.isWarning\"\n [class.eui--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?.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 <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 </span>\n <span class=\"eui-wizard-step__bullet-item-text\"\n *ngIf=\"!step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid\"\n role=\"presentation\">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\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\" size=\"xl\"></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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:
|
143
|
+
args: [{ selector: 'eui-wizard', encapsulation: ViewEncapsulation.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--danger]=\"step?.isInvalid\"\n [class.eui-wizard-step--warning]=\"step?.isWarning\"\n [class.eui--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?.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 <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 </span>\n <span class=\"eui-wizard-step__bullet-item-text\"\n *ngIf=\"!step?.indexIconSvgName && !step?.isActive && !step?.isCompleted && !step?.isInvalid\"\n role=\"presentation\">\n {{ step?.indexLabel !== undefined ? step?.indexLabel : idx + 1 }}\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\" size=\"xl\"></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-c-neutral-lightest);display:flex;margin:var(--eui-s-xl) 0 -1px 0;padding-bottom:var(--eui-s-l)}.eui-wizard-step{cursor:pointer;flex:1;position:relative;text-align:center}.eui-wizard-step__content{margin:var(--eui-s-m) 0}.eui-wizard-step__current-marker{bottom:0;left:50%;position:absolute;transform:translate(-50%,75%)}.eui-wizard-step__indicator-wrapper{border-bottom:3px solid var(--eui-c-neutral-lightest);content:\"\";margin-bottom:var(--eui-s-s);top:var(--eui-s-s);width:100%}.eui-wizard-step__bullet-item{display:flex;align-items:center;justify-content:center;background-color:var(--eui-c-white);border:2px solid var(--eui-c-neutral-light);border-radius:var(--eui-br-max);height:var(--eui-s-3xl);margin:0 auto;margin-top:-2rem;padding-top:var(--eui-s-xs);width:var(--eui-s-3xl)}.eui-wizard-step__bullet-item-text{margin-top:-.5rem;font:var(--eui-f-l-bold)}.eui-wizard-step__label-wrapper{margin-top:var(--eui-s-m)}.eui-wizard-step__label-wrapper-label{font:var(--eui-f-m-bold)}.eui-wizard-step__label-wrapper-sub-label{font-size:95%;margin-top:var(--eui-s-2xs)}.eui-wizard-step--active .eui-wizard-step__bullet-item{border-color:var(--eui-c-primary);color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-primary)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-label{color:var(--eui-c-primary-darl)}.eui-wizard-step--active .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-info)}.eui-wizard-step--completed .eui-wizard-step__bullet-item{background-color:var(--eui-c-success);border-color:var(--eui-c-success);color:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--completed .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-success)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-label{color:var(--eui-c-success-dark)}.eui-wizard-step--completed .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-success)}.eui-wizard-step--error .eui-wizard-step__bullet-item{background-color:var(--eui-c-danger);border-color:var(--eui-c-danger);color:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__bullet-item .eui-icon-svg>svg{color:var(--eui-c-white);fill:var(--eui-c-white)}.eui-wizard-step--error .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-danger)}.eui-wizard-step--error .eui-wizard-step__label-wrapper-label,.eui-wizard-step--error .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-danger)}.eui-wizard-step--warning .eui-wizard-step__bullet-item{background-color:var(--eui-c-warning);border-color:var(--eui-c-warning)}.eui-wizard-step--warning .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-warning-dark)}.eui-wizard-step--warning .eui-wizard-step__label-wrapper-label,.eui-wizard-step--warning .eui-wizard-step__label-wrapper-sub-label{color:var(--eui-c-warning-dark)}.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-c-neutral-lightest);color:var(--eui-c-neutral)}.eui-wizard-step--disabled .eui-wizard-step__indicator-wrapper{border-bottom-color:var(--eui-c-neutral-lightest)}.eui-wizard-step--disabled:hover{cursor:not-allowed}.eui-wizard-step--notallowed .eui-wizard-step__bullet-item-icon{color:var(--eui-c-white)}.eui-wizard-step--notallowed.eui-wizard-step--disabled .eui-wizard-step__bullet-item-icon{color:var(--eui-c-neutral-light)}.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-c-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-c-accent-dark);border-radius:var(--eui-br-max)}.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"] }]
|
144
144
|
}], propDecorators: { activeStepIndex: [{
|
145
145
|
type: Input
|
146
146
|
}], steps: [{
|