ngx-wapp-components 1.8.1 → 1.8.2
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/esm2020/lib/layout/w-panel/w-panel.component.mjs +14 -6
- package/esm2020/lib/misc/w-timeline/w-timeline.component.mjs +1 -1
- package/esm2020/lib/misc/w-wizard/w-wizard.component.mjs +1 -1
- package/esm2020/lib/shared/skeletons/w-skeleton-edit/w-skeleton-edit.component.mjs +1 -1
- package/esm2020/lib/shared/skeletons/w-skeleton-edit-product/w-skeleton-edit-product.component.mjs +1 -1
- package/esm2020/lib/shared/skeletons/w-skeleton-list/w-skeleton-list.component.mjs +1 -1
- package/esm2020/lib/shared/skeletons/w-skeleton-timeline/w-skeleton-timeline.component.mjs +1 -1
- package/esm2020/lib/tables/w-table/w-table.component.mjs +19 -3
- package/esm2020/lib/tables/w-table-lazy/w-table-lazy.component.mjs +19 -3
- package/fesm2015/ngx-wapp-components.mjs +57 -15
- package/fesm2015/ngx-wapp-components.mjs.map +1 -1
- package/fesm2020/ngx-wapp-components.mjs +55 -15
- package/fesm2020/ngx-wapp-components.mjs.map +1 -1
- package/lib/layout/w-panel/w-panel.component.d.ts +7 -2
- package/lib/tables/w-table/w-table.component.d.ts +2 -0
- package/lib/tables/w-table-lazy/w-table-lazy.component.d.ts +2 -0
- package/package.json +1 -1
|
@@ -6,13 +6,18 @@ import * as i3 from "primeng/tieredmenu";
|
|
|
6
6
|
import * as i4 from "../w-panel-title/w-panel-title.component";
|
|
7
7
|
import * as i5 from "../w-panel-subtitle/w-panel-subtitle.component";
|
|
8
8
|
export class WPanelComponent {
|
|
9
|
-
constructor() {
|
|
9
|
+
constructor(elementRef) {
|
|
10
|
+
this.elementRef = elementRef;
|
|
10
11
|
this.activeGrid = true;
|
|
11
12
|
this.reduced = false;
|
|
12
13
|
this.justifyContent = '';
|
|
13
14
|
this.activeOverflow = false;
|
|
15
|
+
this.backgroundColor = '#fff';
|
|
14
16
|
this.activeMenu = false;
|
|
15
17
|
}
|
|
18
|
+
ngOnInit() {
|
|
19
|
+
this.elementRef.nativeElement.style.setProperty("--bgcolor", this.backgroundColor);
|
|
20
|
+
}
|
|
16
21
|
getCombinedClasses() {
|
|
17
22
|
let classes = [];
|
|
18
23
|
if (this.activeGrid) {
|
|
@@ -27,12 +32,12 @@ export class WPanelComponent {
|
|
|
27
32
|
return classes.join(' ');
|
|
28
33
|
}
|
|
29
34
|
}
|
|
30
|
-
WPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WPanelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
31
|
-
WPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WPanelComponent, selector: "w-panel", inputs: { width: "width", title: "title", subtitle: "subtitle", activeGrid: "activeGrid", reduced: "reduced", justifyContent: "justifyContent", activeOverflow: "activeOverflow", heightOverflow: "heightOverflow", maxHeightOverflow: "maxHeightOverflow", activeMenu: "activeMenu", menuOptions: "menuOptions" }, ngImport: i0, template: "<div [ngClass]=\"{ 'w-panel': !reduced, 'w-reduced-panel': reduced}\" class=\"w-full h-full\">\r\n <div *ngIf=\"activeMenu == true\" class=\"flex flex-wrap\" [ngClass]=\"{'justify-content-between': title, 'justify-content-end': !title}\">\r\n <w-panel-title *ngIf=\"title\" class=\"flex\" [title]=\"title\"></w-panel-title>\r\n <div class=\"flex\">\r\n <p-button icon=\"pi pi-ellipsis-v\" styleClass=\"w-menu-button-x-small p-button-text\" (onClick)=\"menu.toggle($event)\"></p-button>\r\n <p-tieredMenu styleClass=\"w-panel-menu\" #menu [model]=\"menuOptions\" [popup]=\"true\"></p-tieredMenu>\r\n </div>\r\n </div>\r\n <w-panel-title *ngIf=\"title && activeMenu == false\" [title]=\"title\"></w-panel-title>\r\n <w-panel-subtitle *ngIf=\"subtitle\" [subtitle]=\"subtitle\"></w-panel-subtitle>\r\n <div class=\"w-panel-content\" [ngClass]=\"getCombinedClasses()\" [style.height]=\"heightOverflow\" [style.max-height]=\"maxHeightOverflow\">\r\n <ng-content></ng-content>\r\n </div>\r\n</div>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus,:host ::ng-deep .w-menu-button-x-small.p-button:focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text{color:#2e3134}.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active,:host ::ng-deep .w-panel-menu.p-tieredmenu{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem-link .p-menuitem-icon{color:#2e3134}.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-panel{padding:16px;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a}.w-reduced-panel{padding:12px;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a}.w-panel-justify-gap{gap:8px}:host ::ng-deep .w-panel-content .col-1{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-2{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-3{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-4{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-5{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-6{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-7{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-8{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-9{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-10{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-11{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-12{padding:4px 20px!important}:host ::ng-deep .w-panel-content.grid{display:flex;flex-wrap:wrap;margin:-4px -20px!important}.w-panel-overflow{overflow:auto;box-sizing:border-box}.w-panel-overflow.w-panel-content.grid{margin-top:0!important;margin-bottom:0!important;margin-right:0!important}:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{height:20px;width:20px;padding:4px;border:none}:host ::ng-deep .w-menu-button-x-small.p-button:enabled:hover{color:#00b2eb;background:none;border:none}:host ::ng-deep .w-menu-button-x-small.p-button:focus{background:none;border:none;outline:1px solid #d6f2ff}:host ::ng-deep .w-panel-menu.p-tieredmenu{color:#2e3134}:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active{color:#2e3134}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i3.TieredMenu, selector: "p-tieredMenu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "autoDisplay", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i4.WPanelTitleComponent, selector: "w-panel-title", inputs: ["title", "activePaddingBottom"] }, { kind: "component", type: i5.WPanelSubtitleComponent, selector: "w-panel-subtitle", inputs: ["subtitle", "activePaddingBottom"] }] });
|
|
35
|
+
WPanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WPanelComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
36
|
+
WPanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WPanelComponent, selector: "w-panel", inputs: { width: "width", title: "title", subtitle: "subtitle", activeGrid: "activeGrid", reduced: "reduced", justifyContent: "justifyContent", activeOverflow: "activeOverflow", heightOverflow: "heightOverflow", maxHeightOverflow: "maxHeightOverflow", backgroundColor: "backgroundColor", activeMenu: "activeMenu", menuOptions: "menuOptions" }, ngImport: i0, template: "<div [ngClass]=\"{ 'w-panel': !reduced, 'w-reduced-panel': reduced}\" class=\"w-full h-full\">\r\n <div *ngIf=\"activeMenu == true\" class=\"flex flex-wrap\" [ngClass]=\"{'justify-content-between': title, 'justify-content-end': !title}\">\r\n <w-panel-title *ngIf=\"title\" class=\"flex\" [title]=\"title\"></w-panel-title>\r\n <div class=\"flex\">\r\n <p-button icon=\"pi pi-ellipsis-v\" styleClass=\"w-menu-button-x-small p-button-text\" (onClick)=\"menu.toggle($event)\"></p-button>\r\n <p-tieredMenu styleClass=\"w-panel-menu\" #menu [model]=\"menuOptions\" [popup]=\"true\"></p-tieredMenu>\r\n </div>\r\n </div>\r\n <w-panel-title *ngIf=\"title && activeMenu == false\" [title]=\"title\"></w-panel-title>\r\n <w-panel-subtitle *ngIf=\"subtitle\" [subtitle]=\"subtitle\"></w-panel-subtitle>\r\n <div class=\"w-panel-content\" [ngClass]=\"getCombinedClasses()\" [style.height]=\"heightOverflow\" [style.max-height]=\"maxHeightOverflow\">\r\n <ng-content></ng-content>\r\n </div>\r\n</div>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus,:host ::ng-deep .w-menu-button-x-small.p-button:focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text{color:#2e3134}.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active,:host ::ng-deep .w-panel-menu.p-tieredmenu{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem-link .p-menuitem-icon{color:#2e3134}.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-panel{padding:16px;background-color:var(--bgcolor);border-radius:8px;box-shadow:0 4px 8px #0000001a}.w-reduced-panel{padding:12px;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a}.w-panel-justify-gap{gap:8px}:host ::ng-deep .w-panel-content .col-1{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-2{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-3{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-4{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-5{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-6{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-7{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-8{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-9{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-10{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-11{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-12{padding:4px 20px!important}:host ::ng-deep .w-panel-content.grid{display:flex;flex-wrap:wrap;margin:-4px -20px!important}.w-panel-overflow{overflow:auto;box-sizing:border-box}.w-panel-overflow.w-panel-content.grid{margin-top:0!important;margin-bottom:0!important;margin-right:0!important}:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{height:20px;width:20px;padding:4px;border:none}:host ::ng-deep .w-menu-button-x-small.p-button:enabled:hover{color:#00b2eb;background:none;border:none}:host ::ng-deep .w-menu-button-x-small.p-button:focus{background:none;border:none;outline:1px solid #d6f2ff}:host ::ng-deep .w-panel-menu.p-tieredmenu{color:#2e3134}:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active{color:#2e3134}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.Button, selector: "p-button", inputs: ["type", "iconPos", "icon", "badge", "label", "disabled", "loading", "loadingIcon", "style", "styleClass", "badgeClass", "ariaLabel"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "component", type: i3.TieredMenu, selector: "p-tieredMenu", inputs: ["model", "popup", "style", "styleClass", "appendTo", "autoZIndex", "baseZIndex", "autoDisplay", "showTransitionOptions", "hideTransitionOptions"], outputs: ["onShow", "onHide"] }, { kind: "component", type: i4.WPanelTitleComponent, selector: "w-panel-title", inputs: ["title", "activePaddingBottom"] }, { kind: "component", type: i5.WPanelSubtitleComponent, selector: "w-panel-subtitle", inputs: ["subtitle", "activePaddingBottom"] }] });
|
|
32
37
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WPanelComponent, decorators: [{
|
|
33
38
|
type: Component,
|
|
34
|
-
args: [{ selector: 'w-panel', template: "<div [ngClass]=\"{ 'w-panel': !reduced, 'w-reduced-panel': reduced}\" class=\"w-full h-full\">\r\n <div *ngIf=\"activeMenu == true\" class=\"flex flex-wrap\" [ngClass]=\"{'justify-content-between': title, 'justify-content-end': !title}\">\r\n <w-panel-title *ngIf=\"title\" class=\"flex\" [title]=\"title\"></w-panel-title>\r\n <div class=\"flex\">\r\n <p-button icon=\"pi pi-ellipsis-v\" styleClass=\"w-menu-button-x-small p-button-text\" (onClick)=\"menu.toggle($event)\"></p-button>\r\n <p-tieredMenu styleClass=\"w-panel-menu\" #menu [model]=\"menuOptions\" [popup]=\"true\"></p-tieredMenu>\r\n </div>\r\n </div>\r\n <w-panel-title *ngIf=\"title && activeMenu == false\" [title]=\"title\"></w-panel-title>\r\n <w-panel-subtitle *ngIf=\"subtitle\" [subtitle]=\"subtitle\"></w-panel-subtitle>\r\n <div class=\"w-panel-content\" [ngClass]=\"getCombinedClasses()\" [style.height]=\"heightOverflow\" [style.max-height]=\"maxHeightOverflow\">\r\n <ng-content></ng-content>\r\n </div>\r\n</div>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus,:host ::ng-deep .w-menu-button-x-small.p-button:focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text{color:#2e3134}.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active,:host ::ng-deep .w-panel-menu.p-tieredmenu{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem-link .p-menuitem-icon{color:#2e3134}.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-panel{padding:16px;background-color
|
|
35
|
-
}], propDecorators: { width: [{
|
|
39
|
+
args: [{ selector: 'w-panel', template: "<div [ngClass]=\"{ 'w-panel': !reduced, 'w-reduced-panel': reduced}\" class=\"w-full h-full\">\r\n <div *ngIf=\"activeMenu == true\" class=\"flex flex-wrap\" [ngClass]=\"{'justify-content-between': title, 'justify-content-end': !title}\">\r\n <w-panel-title *ngIf=\"title\" class=\"flex\" [title]=\"title\"></w-panel-title>\r\n <div class=\"flex\">\r\n <p-button icon=\"pi pi-ellipsis-v\" styleClass=\"w-menu-button-x-small p-button-text\" (onClick)=\"menu.toggle($event)\"></p-button>\r\n <p-tieredMenu styleClass=\"w-panel-menu\" #menu [model]=\"menuOptions\" [popup]=\"true\"></p-tieredMenu>\r\n </div>\r\n </div>\r\n <w-panel-title *ngIf=\"title && activeMenu == false\" [title]=\"title\"></w-panel-title>\r\n <w-panel-subtitle *ngIf=\"subtitle\" [subtitle]=\"subtitle\"></w-panel-subtitle>\r\n <div class=\"w-panel-content\" [ngClass]=\"getCombinedClasses()\" [style.height]=\"heightOverflow\" [style.max-height]=\"maxHeightOverflow\">\r\n <ng-content></ng-content>\r\n </div>\r\n</div>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus,:host ::ng-deep .w-menu-button-x-small.p-button:focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text{color:#2e3134}.w-button-small-text-label-text,:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active,:host ::ng-deep .w-panel-menu.p-tieredmenu{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem-link .p-menuitem-icon{color:#2e3134}.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-panel{padding:16px;background-color:var(--bgcolor);border-radius:8px;box-shadow:0 4px 8px #0000001a}.w-reduced-panel{padding:12px;background-color:#fff;border-radius:8px;box-shadow:0 4px 8px #0000001a}.w-panel-justify-gap{gap:8px}:host ::ng-deep .w-panel-content .col-1{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-2{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-3{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-4{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-5{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-6{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-7{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-8{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-9{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-10{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-11{padding:4px 20px!important}:host ::ng-deep .w-panel-content .col-12{padding:4px 20px!important}:host ::ng-deep .w-panel-content.grid{display:flex;flex-wrap:wrap;margin:-4px -20px!important}.w-panel-overflow{overflow:auto;box-sizing:border-box}.w-panel-overflow.w-panel-content.grid{margin-top:0!important;margin-bottom:0!important;margin-right:0!important}:host ::ng-deep .w-menu-button-x-small.p-button.p-button-icon-only{height:20px;width:20px;padding:4px;border:none}:host ::ng-deep .w-menu-button-x-small.p-button:enabled:hover{color:#00b2eb;background:none;border:none}:host ::ng-deep .w-menu-button-x-small.p-button:focus{background:none;border:none;outline:1px solid #d6f2ff}:host ::ng-deep .w-panel-menu.p-tieredmenu{color:#2e3134}:host ::ng-deep .w-panel-menu.p-tieredmenu .p-menuitem.p-menuitem-active{color:#2e3134}\n"] }]
|
|
40
|
+
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { width: [{
|
|
36
41
|
type: Input,
|
|
37
42
|
args: ['width']
|
|
38
43
|
}], title: [{
|
|
@@ -59,6 +64,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
59
64
|
}], maxHeightOverflow: [{
|
|
60
65
|
type: Input,
|
|
61
66
|
args: ['maxHeightOverflow']
|
|
67
|
+
}], backgroundColor: [{
|
|
68
|
+
type: Input,
|
|
69
|
+
args: ['backgroundColor']
|
|
62
70
|
}], activeMenu: [{
|
|
63
71
|
type: Input,
|
|
64
72
|
args: ['activeMenu']
|
|
@@ -66,4 +74,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImpor
|
|
|
66
74
|
type: Input,
|
|
67
75
|
args: ['menuOptions']
|
|
68
76
|
}] } });
|
|
69
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
77
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidy1wYW5lbC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy93YXBwLWNvbXBvbmVudHMvc3JjL2xpYi9sYXlvdXQvdy1wYW5lbC93LXBhbmVsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3dhcHAtY29tcG9uZW50cy9zcmMvbGliL2xheW91dC93LXBhbmVsL3ctcGFuZWwuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBYyxLQUFLLEVBQVUsTUFBTSxlQUFlLENBQUM7Ozs7Ozs7QUFRckUsTUFBTSxPQUFPLGVBQWU7SUFlMUIsWUFBb0IsVUFBc0I7UUFBdEIsZUFBVSxHQUFWLFVBQVUsQ0FBWTtRQVhyQixlQUFVLEdBQVksSUFBSSxDQUFDO1FBQzlCLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFDbEIsbUJBQWMsR0FBVyxFQUFFLENBQUM7UUFDNUIsbUJBQWMsR0FBWSxLQUFLLENBQUM7UUFHL0Isb0JBQWUsR0FBVyxNQUFNLENBQUM7UUFFdEMsZUFBVSxHQUFZLEtBQUssQ0FBQztJQUdKLENBQUM7SUFFOUMsUUFBUTtRQUNOLElBQUksQ0FBQyxVQUFVLENBQUMsYUFBYSxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsV0FBVyxFQUFFLElBQUksQ0FBQyxlQUFlLENBQUMsQ0FBQztJQUNyRixDQUFDO0lBRUQsa0JBQWtCO1FBQ2hCLElBQUksT0FBTyxHQUFHLEVBQUUsQ0FBQztRQUVqQixJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUU7WUFDbkIsT0FBTyxDQUFDLElBQUksQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDO1NBQ3RDO1FBRUQsSUFBSSxJQUFJLENBQUMsY0FBYyxDQUFDLE1BQU0sR0FBRyxDQUFDLEVBQUU7WUFDbEMsT0FBTyxDQUFDLElBQUksQ0FBQyxpQkFBaUIsR0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUM7U0FDckQ7UUFFRCxJQUFHLElBQUksQ0FBQyxjQUFjLEVBQUM7WUFDckIsT0FBTyxDQUFDLElBQUksQ0FBQyxrQkFBa0IsQ0FBQyxDQUFDO1NBQ2xDO1FBRUQsT0FBTyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQzNCLENBQUM7OzRHQXJDVSxlQUFlO2dHQUFmLGVBQWUsdVlDUjVCLG9pQ0FhTTsyRkRMTyxlQUFlO2tCQUwzQixTQUFTOytCQUNFLFNBQVM7aUdBS0gsS0FBSztzQkFBcEIsS0FBSzt1QkFBQyxPQUFPO2dCQUNFLEtBQUs7c0JBQXBCLEtBQUs7dUJBQUMsT0FBTztnQkFDSyxRQUFRO3NCQUExQixLQUFLO3VCQUFDLFVBQVU7Z0JBQ0ksVUFBVTtzQkFBOUIsS0FBSzt1QkFBQyxZQUFZO2dCQUNELE9BQU87c0JBQXhCLEtBQUs7dUJBQUMsU0FBUztnQkFDUyxjQUFjO3NCQUF0QyxLQUFLO3VCQUFDLGdCQUFnQjtnQkFDRSxjQUFjO3NCQUF0QyxLQUFLO3VCQUFDLGdCQUFnQjtnQkFDRSxjQUFjO3NCQUF0QyxLQUFLO3VCQUFDLGdCQUFnQjtnQkFDSyxpQkFBaUI7c0JBQTVDLEtBQUs7dUJBQUMsbUJBQW1CO2dCQUNBLGVBQWU7c0JBQXhDLEtBQUs7dUJBQUMsaUJBQWlCO2dCQUVILFVBQVU7c0JBQTlCLEtBQUs7dUJBQUMsWUFBWTtnQkFDRyxXQUFXO3NCQUFoQyxLQUFLO3VCQUFDLGFBQWEiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgTWVudUl0ZW0gfSBmcm9tICdwcmltZW5nL2FwaSc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ3ctcGFuZWwnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi93LXBhbmVsLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi93LXBhbmVsLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFdQYW5lbENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcbiAgQElucHV0KCd3aWR0aCcpIHdpZHRoOiBhbnk7XHJcbiAgQElucHV0KCd0aXRsZScpIHRpdGxlITogc3RyaW5nO1xyXG4gIEBJbnB1dCgnc3VidGl0bGUnKSBzdWJ0aXRsZSE6IHN0cmluZztcclxuICBASW5wdXQoJ2FjdGl2ZUdyaWQnKSBhY3RpdmVHcmlkOiBib29sZWFuID0gdHJ1ZTtcclxuICBASW5wdXQoJ3JlZHVjZWQnKSByZWR1Y2VkOiBib29sZWFuID0gZmFsc2U7XHJcbiAgQElucHV0KCdqdXN0aWZ5Q29udGVudCcpIGp1c3RpZnlDb250ZW50OiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoJ2FjdGl2ZU92ZXJmbG93JykgYWN0aXZlT3ZlcmZsb3c6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoJ2hlaWdodE92ZXJmbG93JykgaGVpZ2h0T3ZlcmZsb3chOiBzdHJpbmc7XHJcbiAgQElucHV0KCdtYXhIZWlnaHRPdmVyZmxvdycpIG1heEhlaWdodE92ZXJmbG93ITogc3RyaW5nO1xyXG4gIEBJbnB1dCgnYmFja2dyb3VuZENvbG9yJykgYmFja2dyb3VuZENvbG9yOiBzdHJpbmcgPSAnI2ZmZic7XHJcblxyXG4gIEBJbnB1dCgnYWN0aXZlTWVudScpIGFjdGl2ZU1lbnU6IGJvb2xlYW4gPSBmYWxzZTtcclxuICBASW5wdXQoJ21lbnVPcHRpb25zJykgbWVudU9wdGlvbnMhOiBNZW51SXRlbVtdO1xyXG4gIFxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZikge31cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5zdHlsZS5zZXRQcm9wZXJ0eShcIi0tYmdjb2xvclwiLCB0aGlzLmJhY2tncm91bmRDb2xvcik7XHJcbiAgfVxyXG4gIFxyXG4gIGdldENvbWJpbmVkQ2xhc3NlcygpIHtcclxuICAgIGxldCBjbGFzc2VzID0gW107XHJcbiAgXHJcbiAgICBpZiAodGhpcy5hY3RpdmVHcmlkKSB7XHJcbiAgICAgIGNsYXNzZXMucHVzaCgndy1wYW5lbC1jb250ZW50IGdyaWQnKTtcclxuICAgIH1cclxuICBcclxuICAgIGlmICh0aGlzLmp1c3RpZnlDb250ZW50Lmxlbmd0aCA+IDApIHtcclxuICAgICAgY2xhc3Nlcy5wdXNoKCdmbGV4IGZsZXgtd3JhcCAnK3RoaXMuanVzdGlmeUNvbnRlbnQpO1xyXG4gICAgfVxyXG5cclxuICAgIGlmKHRoaXMuYWN0aXZlT3ZlcmZsb3cpe1xyXG4gICAgICBjbGFzc2VzLnB1c2goJ3ctcGFuZWwtb3ZlcmZsb3cnKTtcclxuICAgIH1cclxuICBcclxuICAgIHJldHVybiBjbGFzc2VzLmpvaW4oJyAnKTtcclxuICB9XHJcbn1cclxuIiwiPGRpdiBbbmdDbGFzc109XCJ7ICd3LXBhbmVsJzogIXJlZHVjZWQsICd3LXJlZHVjZWQtcGFuZWwnOiByZWR1Y2VkfVwiIGNsYXNzPVwidy1mdWxsIGgtZnVsbFwiPlxyXG4gICAgPGRpdiAqbmdJZj1cImFjdGl2ZU1lbnUgPT0gdHJ1ZVwiIGNsYXNzPVwiZmxleCBmbGV4LXdyYXBcIiBbbmdDbGFzc109XCJ7J2p1c3RpZnktY29udGVudC1iZXR3ZWVuJzogdGl0bGUsICdqdXN0aWZ5LWNvbnRlbnQtZW5kJzogIXRpdGxlfVwiPlxyXG4gICAgICAgIDx3LXBhbmVsLXRpdGxlICpuZ0lmPVwidGl0bGVcIiBjbGFzcz1cImZsZXhcIiBbdGl0bGVdPVwidGl0bGVcIj48L3ctcGFuZWwtdGl0bGU+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cImZsZXhcIj5cclxuICAgICAgICAgICA8cC1idXR0b24gaWNvbj1cInBpIHBpLWVsbGlwc2lzLXZcIiBzdHlsZUNsYXNzPVwidy1tZW51LWJ1dHRvbi14LXNtYWxsIHAtYnV0dG9uLXRleHRcIiAob25DbGljayk9XCJtZW51LnRvZ2dsZSgkZXZlbnQpXCI+PC9wLWJ1dHRvbj5cclxuICAgICAgICAgICAgPHAtdGllcmVkTWVudSBzdHlsZUNsYXNzPVwidy1wYW5lbC1tZW51XCIgI21lbnUgW21vZGVsXT1cIm1lbnVPcHRpb25zXCIgW3BvcHVwXT1cInRydWVcIj48L3AtdGllcmVkTWVudT5cclxuICAgICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gICAgPHctcGFuZWwtdGl0bGUgKm5nSWY9XCJ0aXRsZSAmJiBhY3RpdmVNZW51ID09IGZhbHNlXCIgW3RpdGxlXT1cInRpdGxlXCI+PC93LXBhbmVsLXRpdGxlPlxyXG4gICAgPHctcGFuZWwtc3VidGl0bGUgKm5nSWY9XCJzdWJ0aXRsZVwiIFtzdWJ0aXRsZV09XCJzdWJ0aXRsZVwiPjwvdy1wYW5lbC1zdWJ0aXRsZT5cclxuICAgIDxkaXYgY2xhc3M9XCJ3LXBhbmVsLWNvbnRlbnRcIiBbbmdDbGFzc109XCJnZXRDb21iaW5lZENsYXNzZXMoKVwiIFtzdHlsZS5oZWlnaHRdPVwiaGVpZ2h0T3ZlcmZsb3dcIiBbc3R5bGUubWF4LWhlaWdodF09XCJtYXhIZWlnaHRPdmVyZmxvd1wiPlxyXG4gICAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cclxuICAgIDwvZGl2PlxyXG48L2Rpdj4iXX0=
|
|
@@ -19,7 +19,7 @@ export class WTimelineComponent {
|
|
|
19
19
|
}
|
|
20
20
|
}
|
|
21
21
|
WTimelineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WTimelineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
22
|
-
WTimelineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WTimelineComponent, selector: "w-timeline", inputs: { events: "events", header: "header", panel: "panel", align: "align", reducedPanelMargin: "reducedPanelMargin", reducedEventPanelMargin: "reducedEventPanelMargin" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<div *ngIf=\"panel; else timeline\">\r\n <w-panel [title]=\"header\" [reduced]=\"reducedPanelMargin\">\r\n <div class=\"col-12\">\r\n <ng-container *ngTemplateOutlet=\"timeline\"></ng-container>\r\n </div>\r\n </w-panel>\r\n</div>\r\n\r\n<ng-template #timeline>\r\n <p-timeline [value]=\"events\" [align]=\"align\" styleClass=\"customized-timeline\" \r\n [class.w-timeline-non-alternate]=\"align != 'alternate'\">\r\n <ng-template pTemplate=\"marker\" let-event>\r\n <span *ngIf=\"event.color.includes('#'); else wappingColors\"\r\n class=\"flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1 shadow-1 shadow-2\"\r\n [style.backgroundColor]=\"event.color\">\r\n <i [ngClass]=\"'pi '+event.icon\"></i>\r\n </span>\r\n <ng-template #wappingColors>\r\n <span\r\n class=\"flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1 shadow-1 shadow-2\"\r\n [class]=\"'w-timeline-event color-'+event.color\">\r\n <i [ngClass]=\"'pi '+event.icon\" [class]=\"'w-timeline-event color-'+event.color\"></i>\r\n </span>\r\n </ng-template>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-event>\r\n <w-panel [title]=\"event.status\" [subtitle]=\"event.date\" [reduced]=\"reducedEventPanelMargin\">\r\n <div class=\"col-12\">\r\n <img *ngIf=\"event.image\"\r\n [src]=\"event.image\"\r\n [alt]=\"event.name\" width=\"200\" class=\"shadow-2\" />\r\n <p> {{event.content}} </p>\r\n <div class=\"flex w-timeline-button\" [ngClass]=\"{'w-timeline-button-end':align == 'left', 'w-timeline-button-start':align == 'right'}\">\r\n <w-button *ngIf=\"event.button\" type=\"text\" \r\n [label]=\"event.button.label\" \r\n [icon]=\"event.button.icon!\"\r\n (onClick)=\"onButtonClick(event)\">\r\n </w-button>\r\n </div>\r\n </div>\r\n </w-panel>\r\n </ng-template>\r\n </p-timeline>\r\n</ng-template>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text,.w-button-small-text-label-text{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-opposite{text-align:right;padding:0}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-content{text-align:left;padding:0 0 0 16px}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-content .w-timeline-button{justify-content:end}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n) .p-timeline-event-content{text-align:right;padding:0 16px 0 0}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n) .p-timeline-event-content .w-timeline-button{justify-content:start}::ng-deep .w-timeline-non-alternate .p-timeline-event-content{padding:0 1rem;margin-bottom:16px!important}.w-timeline-button-end{justify-content:end}.w-timeline-button-start{justify-content:start}.w-timeline-event.color-success{background-color:#46ff9b;color:#00db5d}.w-timeline-event.color-warn{background-color:#ffcd46;color:#eeae00}.w-timeline-event.color-info{background-color:#62c3ff;color:#009dfd}.w-timeline-event.color-error{background-color:#f55;color:#e50000}.w-timeline-event-icon-white{color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Timeline, selector: "p-timeline", inputs: ["value", "style", "styleClass", "align", "layout"] }, { kind: "component", type: i4.WButtonComponent, selector: "w-button", inputs: ["type", "label", "size", "icon", "tooltipPosition", "tooltip", "disabled", "loading"], outputs: ["onClick"] }, { kind: "component", type: i5.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "activeMenu", "menuOptions"] }] });
|
|
22
|
+
WTimelineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WTimelineComponent, selector: "w-timeline", inputs: { events: "events", header: "header", panel: "panel", align: "align", reducedPanelMargin: "reducedPanelMargin", reducedEventPanelMargin: "reducedEventPanelMargin" }, outputs: { buttonClick: "buttonClick" }, ngImport: i0, template: "<div *ngIf=\"panel; else timeline\">\r\n <w-panel [title]=\"header\" [reduced]=\"reducedPanelMargin\">\r\n <div class=\"col-12\">\r\n <ng-container *ngTemplateOutlet=\"timeline\"></ng-container>\r\n </div>\r\n </w-panel>\r\n</div>\r\n\r\n<ng-template #timeline>\r\n <p-timeline [value]=\"events\" [align]=\"align\" styleClass=\"customized-timeline\" \r\n [class.w-timeline-non-alternate]=\"align != 'alternate'\">\r\n <ng-template pTemplate=\"marker\" let-event>\r\n <span *ngIf=\"event.color.includes('#'); else wappingColors\"\r\n class=\"flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1 shadow-1 shadow-2\"\r\n [style.backgroundColor]=\"event.color\">\r\n <i [ngClass]=\"'pi '+event.icon\"></i>\r\n </span>\r\n <ng-template #wappingColors>\r\n <span\r\n class=\"flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1 shadow-1 shadow-2\"\r\n [class]=\"'w-timeline-event color-'+event.color\">\r\n <i [ngClass]=\"'pi '+event.icon\" [class]=\"'w-timeline-event color-'+event.color\"></i>\r\n </span>\r\n </ng-template>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-event>\r\n <w-panel [title]=\"event.status\" [subtitle]=\"event.date\" [reduced]=\"reducedEventPanelMargin\">\r\n <div class=\"col-12\">\r\n <img *ngIf=\"event.image\"\r\n [src]=\"event.image\"\r\n [alt]=\"event.name\" width=\"200\" class=\"shadow-2\" />\r\n <p> {{event.content}} </p>\r\n <div class=\"flex w-timeline-button\" [ngClass]=\"{'w-timeline-button-end':align == 'left', 'w-timeline-button-start':align == 'right'}\">\r\n <w-button *ngIf=\"event.button\" type=\"text\" \r\n [label]=\"event.button.label\" \r\n [icon]=\"event.button.icon!\"\r\n (onClick)=\"onButtonClick(event)\">\r\n </w-button>\r\n </div>\r\n </div>\r\n </w-panel>\r\n </ng-template>\r\n </p-timeline>\r\n</ng-template>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text,.w-button-small-text-label-text{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-opposite{text-align:right;padding:0}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-content{text-align:left;padding:0 0 0 16px}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-content .w-timeline-button{justify-content:end}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n) .p-timeline-event-content{text-align:right;padding:0 16px 0 0}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n) .p-timeline-event-content .w-timeline-button{justify-content:start}::ng-deep .w-timeline-non-alternate .p-timeline-event-content{padding:0 1rem;margin-bottom:16px!important}.w-timeline-button-end{justify-content:end}.w-timeline-button-start{justify-content:start}.w-timeline-event.color-success{background-color:#46ff9b;color:#00db5d}.w-timeline-event.color-warn{background-color:#ffcd46;color:#eeae00}.w-timeline-event.color-info{background-color:#62c3ff;color:#009dfd}.w-timeline-event.color-error{background-color:#f55;color:#e50000}.w-timeline-event-icon-white{color:#fff}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i3.Timeline, selector: "p-timeline", inputs: ["value", "style", "styleClass", "align", "layout"] }, { kind: "component", type: i4.WButtonComponent, selector: "w-button", inputs: ["type", "label", "size", "icon", "tooltipPosition", "tooltip", "disabled", "loading"], outputs: ["onClick"] }, { kind: "component", type: i5.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "backgroundColor", "activeMenu", "menuOptions"] }] });
|
|
23
23
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WTimelineComponent, decorators: [{
|
|
24
24
|
type: Component,
|
|
25
25
|
args: [{ selector: 'w-timeline', template: "<div *ngIf=\"panel; else timeline\">\r\n <w-panel [title]=\"header\" [reduced]=\"reducedPanelMargin\">\r\n <div class=\"col-12\">\r\n <ng-container *ngTemplateOutlet=\"timeline\"></ng-container>\r\n </div>\r\n </w-panel>\r\n</div>\r\n\r\n<ng-template #timeline>\r\n <p-timeline [value]=\"events\" [align]=\"align\" styleClass=\"customized-timeline\" \r\n [class.w-timeline-non-alternate]=\"align != 'alternate'\">\r\n <ng-template pTemplate=\"marker\" let-event>\r\n <span *ngIf=\"event.color.includes('#'); else wappingColors\"\r\n class=\"flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1 shadow-1 shadow-2\"\r\n [style.backgroundColor]=\"event.color\">\r\n <i [ngClass]=\"'pi '+event.icon\"></i>\r\n </span>\r\n <ng-template #wappingColors>\r\n <span\r\n class=\"flex w-2rem h-2rem align-items-center justify-content-center text-white border-circle z-1 shadow-1 shadow-2\"\r\n [class]=\"'w-timeline-event color-'+event.color\">\r\n <i [ngClass]=\"'pi '+event.icon\" [class]=\"'w-timeline-event color-'+event.color\"></i>\r\n </span>\r\n </ng-template>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-event>\r\n <w-panel [title]=\"event.status\" [subtitle]=\"event.date\" [reduced]=\"reducedEventPanelMargin\">\r\n <div class=\"col-12\">\r\n <img *ngIf=\"event.image\"\r\n [src]=\"event.image\"\r\n [alt]=\"event.name\" width=\"200\" class=\"shadow-2\" />\r\n <p> {{event.content}} </p>\r\n <div class=\"flex w-timeline-button\" [ngClass]=\"{'w-timeline-button-end':align == 'left', 'w-timeline-button-start':align == 'right'}\">\r\n <w-button *ngIf=\"event.button\" type=\"text\" \r\n [label]=\"event.button.label\" \r\n [icon]=\"event.button.icon!\"\r\n (onClick)=\"onButtonClick(event)\">\r\n </w-button>\r\n </div>\r\n </div>\r\n </w-panel>\r\n </ng-template>\r\n </p-timeline>\r\n</ng-template>", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text,.w-button-small-text-label-text{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-opposite{text-align:right;padding:0}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-content{text-align:left;padding:0 0 0 16px}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n+1) .p-timeline-event-content .w-timeline-button{justify-content:end}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n) .p-timeline-event-content{text-align:right;padding:0 16px 0 0}::ng-deep .p-timeline-vertical.p-timeline-alternate .p-timeline-event:nth-child(2n) .p-timeline-event-content .w-timeline-button{justify-content:start}::ng-deep .w-timeline-non-alternate .p-timeline-event-content{padding:0 1rem;margin-bottom:16px!important}.w-timeline-button-end{justify-content:end}.w-timeline-button-start{justify-content:start}.w-timeline-event.color-success{background-color:#46ff9b;color:#00db5d}.w-timeline-event.color-warn{background-color:#ffcd46;color:#eeae00}.w-timeline-event.color-info{background-color:#62c3ff;color:#009dfd}.w-timeline-event.color-error{background-color:#f55;color:#e50000}.w-timeline-event-icon-white{color:#fff}\n"] }]
|
|
@@ -37,7 +37,7 @@ export class WWizardComponent {
|
|
|
37
37
|
}
|
|
38
38
|
}
|
|
39
39
|
WWizardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WWizardComponent, deps: [{ token: i1.MessageService }], target: i0.ɵɵFactoryTarget.Component });
|
|
40
|
-
WWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WWizardComponent, selector: "w-wizard", inputs: { stepsItems: "stepsItems", stepsHeadings: "stepsHeadings", stepsSubheadings: "stepsSubheadings", nextBtnLabel: "nextBtnLabel", previousBtnLabel: "previousBtnLabel", confirmButtonLabel: "confirmButtonLabel", confirmButtonIcon: "confirmButtonIcon", secondaryConfirmButtonLabel: "secondaryConfirmButtonLabel", secondaryConfirmButtonIcon: "secondaryConfirmButtonIcon", isReadOnly: "isReadOnly", formGroup: "formGroup" }, outputs: { confirmButtonActivated: "confirmButtonActivated", secondaryConfirmButtonActivated: "secondaryConfirmButtonActivated", activeIndexParent: "activeIndexParent" }, providers: [MessageService], ngImport: i0, template: "<w-panel class=\"col-12\" [activeGrid]=\"false\">\r\n <p-steps [model]=\"stepsItems\" [activeIndex]=\"activeIndex\" (activeIndexChange)=\"onActiveIndexChange($event)\" [readonly]=\"isReadOnly\"></p-steps>\r\n</w-panel>\r\n\r\n<w-panel class=\"col-12\" [activeGrid]=\"false\">\r\n \r\n <div class=\"flex flex-column align-items-center sm:align-items-start w-wizard-headings\">\r\n <span *ngIf=\"stepsHeadings && stepsHeadings[activeIndex]\" class=\"w-wizard-heading\">\r\n {{stepsHeadings[activeIndex]}}\r\n </span>\r\n <span *ngIf=\"stepsSubheadings && stepsSubheadings[activeIndex]\" class=\"w-wizard-subheading\">\r\n {{stepsSubheadings[activeIndex]}}\r\n </span>\r\n </div>\r\n\r\n <ng-content *ngIf=\"activeIndex == 0\" select=\".step-1\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 1\" select=\".step-2\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 2\" select=\".step-3\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 3\" select=\".step-4\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 4\" select=\".step-5\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 5\" select=\".step-6\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 6\" select=\".step-7\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 7\" select=\".step-8\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 8\" select=\".step-9\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 9\" select=\".step-10\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 10\" select=\".step-11\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 11\" select=\".step-12\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 12\" select=\".step-13\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 13\" select=\".step-14\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 14\" select=\".step-15\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 15\" select=\".step-16\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 16\" select=\".step-17\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 17\" select=\".step-18\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 18\" select=\".step-19\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 19\" select=\".step-20\" class=\"w-wizard-body\"></ng-content>\r\n\r\n <div class=\"flex justify-content-between flex-wrap m-auto\">\r\n <div class=\"flex align-items-center justify-content-center\">\r\n <w-button *ngIf=\"activeIndex != 0\" \r\n [icon]=\"'pi-arrow-left'\" \r\n type=\"secondary\" \r\n [label]=\"previousBtnLabel\" \r\n (onClick)=\"previousPage()\">\r\n </w-button>\r\n </div>\r\n <div *ngIf=\"!(stepsItems.length -1 == activeIndex); else confirmButtons\" class=\"flex align-items-center justify-content-center\">\r\n <w-button type=\"primary\"\r\n [icon]=\"'pi-arrow-right'\" \r\n [label]=\"nextBtnLabel\" \r\n (onClick)=\"nextPage()\">\r\n </w-button>\r\n </div>\r\n <ng-template #confirmButtons >\r\n <div class=\"flex align-items-center justify-content-center\">\r\n <w-button *ngIf=\"secondaryConfirmButtonLabel\"\r\n type=\"secondary\"\r\n class=\"w-wizard-button-gap\"\r\n [icon]=\"'pi '+secondaryConfirmButtonIcon\"\r\n [label]=\"secondaryConfirmButtonLabel\" \r\n [disabled]=\"formGroup && !formGroup.valid\" \r\n (onClick)=\"secondaryConfirm()\">\r\n </w-button>\r\n <w-button type=\"primary\"\r\n [icon]=\"'pi '+confirmButtonIcon\"\r\n [label]=\"confirmButtonLabel\" \r\n [disabled]=\"formGroup && !formGroup.valid\" \r\n (onClick)=\"confirm()\">\r\n </w-button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n</w-panel>\r\n", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4,.w-wizard-heading{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-wizard-subheading,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title,.w-wizard-body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text,.w-button-small-text-label-text{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-wizard-button-gap{margin-right:16px}.w-wizard-subheading{margin-top:16px}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{background:#e0f5fc;color:#003345}.w-wizard-headings{margin-bottom:16px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass"], outputs: ["activeIndexChange"] }, { kind: "component", type: i4.WButtonComponent, selector: "w-button", inputs: ["type", "label", "size", "icon", "tooltipPosition", "tooltip", "disabled", "loading"], outputs: ["onClick"] }, { kind: "component", type: i5.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "activeMenu", "menuOptions"] }] });
|
|
40
|
+
WWizardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WWizardComponent, selector: "w-wizard", inputs: { stepsItems: "stepsItems", stepsHeadings: "stepsHeadings", stepsSubheadings: "stepsSubheadings", nextBtnLabel: "nextBtnLabel", previousBtnLabel: "previousBtnLabel", confirmButtonLabel: "confirmButtonLabel", confirmButtonIcon: "confirmButtonIcon", secondaryConfirmButtonLabel: "secondaryConfirmButtonLabel", secondaryConfirmButtonIcon: "secondaryConfirmButtonIcon", isReadOnly: "isReadOnly", formGroup: "formGroup" }, outputs: { confirmButtonActivated: "confirmButtonActivated", secondaryConfirmButtonActivated: "secondaryConfirmButtonActivated", activeIndexParent: "activeIndexParent" }, providers: [MessageService], ngImport: i0, template: "<w-panel class=\"col-12\" [activeGrid]=\"false\">\r\n <p-steps [model]=\"stepsItems\" [activeIndex]=\"activeIndex\" (activeIndexChange)=\"onActiveIndexChange($event)\" [readonly]=\"isReadOnly\"></p-steps>\r\n</w-panel>\r\n\r\n<w-panel class=\"col-12\" [activeGrid]=\"false\">\r\n \r\n <div class=\"flex flex-column align-items-center sm:align-items-start w-wizard-headings\">\r\n <span *ngIf=\"stepsHeadings && stepsHeadings[activeIndex]\" class=\"w-wizard-heading\">\r\n {{stepsHeadings[activeIndex]}}\r\n </span>\r\n <span *ngIf=\"stepsSubheadings && stepsSubheadings[activeIndex]\" class=\"w-wizard-subheading\">\r\n {{stepsSubheadings[activeIndex]}}\r\n </span>\r\n </div>\r\n\r\n <ng-content *ngIf=\"activeIndex == 0\" select=\".step-1\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 1\" select=\".step-2\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 2\" select=\".step-3\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 3\" select=\".step-4\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 4\" select=\".step-5\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 5\" select=\".step-6\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 6\" select=\".step-7\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 7\" select=\".step-8\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 8\" select=\".step-9\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 9\" select=\".step-10\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 10\" select=\".step-11\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 11\" select=\".step-12\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 12\" select=\".step-13\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 13\" select=\".step-14\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 14\" select=\".step-15\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 15\" select=\".step-16\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 16\" select=\".step-17\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 17\" select=\".step-18\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 18\" select=\".step-19\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 19\" select=\".step-20\" class=\"w-wizard-body\"></ng-content>\r\n\r\n <div class=\"flex justify-content-between flex-wrap m-auto\">\r\n <div class=\"flex align-items-center justify-content-center\">\r\n <w-button *ngIf=\"activeIndex != 0\" \r\n [icon]=\"'pi-arrow-left'\" \r\n type=\"secondary\" \r\n [label]=\"previousBtnLabel\" \r\n (onClick)=\"previousPage()\">\r\n </w-button>\r\n </div>\r\n <div *ngIf=\"!(stepsItems.length -1 == activeIndex); else confirmButtons\" class=\"flex align-items-center justify-content-center\">\r\n <w-button type=\"primary\"\r\n [icon]=\"'pi-arrow-right'\" \r\n [label]=\"nextBtnLabel\" \r\n (onClick)=\"nextPage()\">\r\n </w-button>\r\n </div>\r\n <ng-template #confirmButtons >\r\n <div class=\"flex align-items-center justify-content-center\">\r\n <w-button *ngIf=\"secondaryConfirmButtonLabel\"\r\n type=\"secondary\"\r\n class=\"w-wizard-button-gap\"\r\n [icon]=\"'pi '+secondaryConfirmButtonIcon\"\r\n [label]=\"secondaryConfirmButtonLabel\" \r\n [disabled]=\"formGroup && !formGroup.valid\" \r\n (onClick)=\"secondaryConfirm()\">\r\n </w-button>\r\n <w-button type=\"primary\"\r\n [icon]=\"'pi '+confirmButtonIcon\"\r\n [label]=\"confirmButtonLabel\" \r\n [disabled]=\"formGroup && !formGroup.valid\" \r\n (onClick)=\"confirm()\">\r\n </w-button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n</w-panel>\r\n", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4,.w-wizard-heading{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-wizard-subheading,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title,.w-wizard-body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text,.w-button-small-text-label-text{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-wizard-button-gap{margin-right:16px}.w-wizard-subheading{margin-top:16px}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{background:#e0f5fc;color:#003345}.w-wizard-headings{margin-bottom:16px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.Steps, selector: "p-steps", inputs: ["activeIndex", "model", "readonly", "style", "styleClass"], outputs: ["activeIndexChange"] }, { kind: "component", type: i4.WButtonComponent, selector: "w-button", inputs: ["type", "label", "size", "icon", "tooltipPosition", "tooltip", "disabled", "loading"], outputs: ["onClick"] }, { kind: "component", type: i5.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "backgroundColor", "activeMenu", "menuOptions"] }] });
|
|
41
41
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WWizardComponent, decorators: [{
|
|
42
42
|
type: Component,
|
|
43
43
|
args: [{ selector: 'w-wizard', providers: [MessageService], template: "<w-panel class=\"col-12\" [activeGrid]=\"false\">\r\n <p-steps [model]=\"stepsItems\" [activeIndex]=\"activeIndex\" (activeIndexChange)=\"onActiveIndexChange($event)\" [readonly]=\"isReadOnly\"></p-steps>\r\n</w-panel>\r\n\r\n<w-panel class=\"col-12\" [activeGrid]=\"false\">\r\n \r\n <div class=\"flex flex-column align-items-center sm:align-items-start w-wizard-headings\">\r\n <span *ngIf=\"stepsHeadings && stepsHeadings[activeIndex]\" class=\"w-wizard-heading\">\r\n {{stepsHeadings[activeIndex]}}\r\n </span>\r\n <span *ngIf=\"stepsSubheadings && stepsSubheadings[activeIndex]\" class=\"w-wizard-subheading\">\r\n {{stepsSubheadings[activeIndex]}}\r\n </span>\r\n </div>\r\n\r\n <ng-content *ngIf=\"activeIndex == 0\" select=\".step-1\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 1\" select=\".step-2\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 2\" select=\".step-3\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 3\" select=\".step-4\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 4\" select=\".step-5\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 5\" select=\".step-6\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 6\" select=\".step-7\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 7\" select=\".step-8\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 8\" select=\".step-9\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 9\" select=\".step-10\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 10\" select=\".step-11\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 11\" select=\".step-12\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 12\" select=\".step-13\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 13\" select=\".step-14\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 14\" select=\".step-15\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 15\" select=\".step-16\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 16\" select=\".step-17\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 17\" select=\".step-18\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 18\" select=\".step-19\" class=\"w-wizard-body\"></ng-content>\r\n <ng-content *ngIf=\"activeIndex == 19\" select=\".step-20\" class=\"w-wizard-body\"></ng-content>\r\n\r\n <div class=\"flex justify-content-between flex-wrap m-auto\">\r\n <div class=\"flex align-items-center justify-content-center\">\r\n <w-button *ngIf=\"activeIndex != 0\" \r\n [icon]=\"'pi-arrow-left'\" \r\n type=\"secondary\" \r\n [label]=\"previousBtnLabel\" \r\n (onClick)=\"previousPage()\">\r\n </w-button>\r\n </div>\r\n <div *ngIf=\"!(stepsItems.length -1 == activeIndex); else confirmButtons\" class=\"flex align-items-center justify-content-center\">\r\n <w-button type=\"primary\"\r\n [icon]=\"'pi-arrow-right'\" \r\n [label]=\"nextBtnLabel\" \r\n (onClick)=\"nextPage()\">\r\n </w-button>\r\n </div>\r\n <ng-template #confirmButtons >\r\n <div class=\"flex align-items-center justify-content-center\">\r\n <w-button *ngIf=\"secondaryConfirmButtonLabel\"\r\n type=\"secondary\"\r\n class=\"w-wizard-button-gap\"\r\n [icon]=\"'pi '+secondaryConfirmButtonIcon\"\r\n [label]=\"secondaryConfirmButtonLabel\" \r\n [disabled]=\"formGroup && !formGroup.valid\" \r\n (onClick)=\"secondaryConfirm()\">\r\n </w-button>\r\n <w-button type=\"primary\"\r\n [icon]=\"'pi '+confirmButtonIcon\"\r\n [label]=\"confirmButtonLabel\" \r\n [disabled]=\"formGroup && !formGroup.valid\" \r\n (onClick)=\"confirm()\">\r\n </w-button>\r\n </div>\r\n </ng-template>\r\n </div>\r\n</w-panel>\r\n", styles: [".heading1{font-size:2.6666666667rem;line-height:3rem;font-weight:700}.heading2{font-size:2.3333333333rem;line-height:2.6666666667rem;font-weight:700}.heading3{font-size:2rem;line-height:2.3333333333rem;font-weight:700}.heading4,.w-wizard-heading{font-size:1.6666666667rem;line-height:2rem;font-weight:400}.heading5{font-size:1.5rem;line-height:1.8333333333rem;font-weight:600}.heading6{font-size:1.3333333333rem;line-height:1.6666666667rem;font-weight:400}.subtitle1,.w-tab-text,.w-panel-title-text,.w-sidebar-title-text{font-size:1.1666666667rem;line-height:1.3333333333rem;font-weight:600}.subtitle2,.w-wizard-subheading,.w-table-th-text,.w-panel-subtitle-text,.w-input-small-label-text-typography,.w-input-small-label-text,.w-input-small-label-disabled,.w-view-small-label-text-typography,.w-view-small-label-text,.w-button-small-text-label-text-typography,.w-button-small-text-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:600}.body,::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-title,.w-wizard-body,.w-table-td-text,.w-chip-text,.w-panel-content,.w-input-small-select-options-text,.w-input-small-placeholder-text-typography,.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text,.w-view-small-value-text-typography,.w-view-small-value-text,.w-button-small-label-text-typography,.w-button-small-tertiary-label-text{font-size:1rem;line-height:1.3333333333rem;font-weight:400}.caption,.w-input-error-alert-text,.w-input-warning-alert-text,.w-input-success-alert-text{font-size:.6666666667rem;line-height:1rem;font-weight:400}.text846{color:#2e3134}.text700{color:#5f6368}.text500{color:#9aa0a6}.textWhite{color:#fff}.spacingXXS{padding:4px}.spacingXSM{padding:6px}.spacingXS{padding:8px}.spacingS{padding:12px}.spacingM{padding:16px}.spacingL{padding:20px}.spacingXL{padding:24px}.spacingXXL{padding:28px}.spacingXXXL{padding:32px}.focus{box-shadow:0 0 8px #00a6e980}.hover{border-radius:8px;border:1px solid #00b2eb}.input-generic-valid{border-radius:8px;border:1px solid #B3FFD3}.input-generic-valid-focus{border-radius:8px;border:1px solid #B3FFD3!important;box-shadow:0 0 8px #46ff9b80!important;padding-left:16px}.input-generic-warning{border-radius:8px;border:1px solid #FFECB8!important}.input-generic-warning-focus{border-radius:8px;border:1px solid #FFECB8!important;box-shadow:0 0 8px #ffcd4680!important;padding-left:16px}.input-generic-error-focus{border-radius:8px;border:1px solid #FFBDBD!important;box-shadow:0 0 8px #ff555580!important;padding-left:16px}.input-generic-error{border-radius:8px;border:1px solid #FFBDBD}.toggle-small-typography{font-size:12px;line-height:16px;font-weight:600}.w-button-small-tertiary-label-text,.w-button-small-text-label-text{color:#2e3134}.w-button-small-icon-text{font-size:12px}.w-control-button-small-label-text{font-size:12px;font-weight:600;line-height:16px}.w-control-button-x-small-icon-text{font-size:10px;font-weight:700}.w-control-button-small-icon-text{font-size:8px;font-weight:700}.w-button-medium-label-text-typography,.w-button-medium-tertiary-label-text{font-size:16px;font-weight:400;line-height:16px}.w-button-medium-tertiary-label-text{color:#2e3134}.w-button-medium-icon-text{font-size:16px}.w-control-button-medium-label-text{font-size:14px;font-weight:600;line-height:16px}.w-control-button-medium-icon-text{font-size:12px;font-weight:700}.w-button-large-label-text-typography,.w-button-large-tertiary-label-text{font-size:20px;font-weight:400;line-height:24px}.w-button-large-tertiary-label-text{color:#2e3134}.w-button-x-small-label-text{font-size:10px;font-weight:600;line-height:10px}.w-button-small-only-label-text{font-size:12px;font-weight:600;line-height:16px}.w-button-large-icon-text{font-size:24px}.w-view-small-label-text,.w-view-small-value-text{color:#2e3134}.w-input-no-label-height{height:36px}.w-input-disabled{background-color:#f1f3f4;border-color:#e8eaed;opacity:1}.w-input-small-label-text,.w-input-small-label-disabled{color:#2e3134}.w-input-small-label-disabled{color:#9aa0a6}.w-input-small-label-text-content{padding:12px 8px 8px 0;margin:0}.w-input-small-label-text-content-no-top{padding-top:0}.w-input-small-placeholder-text,.w-input-small-placeholder-text-only-color{color:#2e3134}.w-input-small-placeholder-text-disabled,.w-input-small-placeholder-text-disabled-only-color{color:#5f6368}.w-input-small-text-icon,.w-input-small-select-options-text{color:#2e3134}.w-input-medium-label-text-typography,.w-input-medium-label-text,.w-input-medium-label-disabled{font-size:14px;font-weight:600;line-height:16px}.w-input-medium-label-text,.w-input-medium-label-disabled{color:#2e3134}.w-input-medium-label-disabled{color:#9aa0a6}.w-input-medium-placeholder-text-typography,.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text{font-size:16px;font-weight:400;line-height:24px}.w-input-medium-placeholder-text,.w-input-medium-placeholder-text-only-color{color:#2e3134}.w-input-medium-placeholder-text-disabled,.w-input-medium-placeholder-text-disabled-only-color{color:#5f6368}.w-input-medium-text-icon{color:#2e3134}.w-input-medium-select-options-text{font-size:16px;font-weight:400;line-height:24px;color:#2e3134}.w-input-success-alert-text{color:#00db5d;padding:8px 8px 0;margin-top:0}.w-input-warning-alert-text{color:#eeae00;padding:8px 8px 0;margin-top:0}.w-input-error-alert-text{color:#e50000;padding:8px 8px 0;margin-top:0}.w-input-alert-message-height{height:32px}.w-sidebar-title-text,.w-panel-title-text,.w-panel-subtitle-text{color:#2e3134}.w-panel-content{color:#5f6368}.w-tab-text,.w-chip-text{color:#2e3134}.w-badge-text{font-size:8px;font-weight:700;line-height:8px}.w-table-th-text{color:#2e3134}.w-table-td-text{color:#5f6368}.w-wizard-button-gap{margin-right:16px}.w-wizard-subheading{margin-top:16px}::ng-deep .p-steps .p-steps-item.p-highlight .p-steps-number{background:#e0f5fc;color:#003345}.w-wizard-headings{margin-bottom:16px}\n"] }]
|
|
@@ -15,7 +15,7 @@ export class WSkeletonEditComponent {
|
|
|
15
15
|
}
|
|
16
16
|
}
|
|
17
17
|
WSkeletonEditComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonEditComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
18
|
-
WSkeletonEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonEditComponent, selector: "w-skeleton-edit", inputs: { columnsNumber: "columnsNumber" }, ngImport: i0, template: "<w-body-container>\r\n <w-header-panel class=\"col-12\">\r\n <div class=\"main-actions\">\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n <ng-container *ngFor=\"let item of columnsArray\">\r\n <w-panel *ngIf=\"columnsNumber == 1\" class=\"col-12\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n <w-panel *ngIf=\"columnsNumber == 3\" class=\"col-4\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n <w-panel *ngIf=\"columnsNumber == 2\" class=\"col-6\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n </ng-container>\r\n <w-panel class=\"col-12\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n</w-body-container>\r\n", styles: [""], 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.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i3.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "activeMenu", "menuOptions"] }, { kind: "component", type: i4.WBodyContainerComponent, selector: "w-body-container" }, { kind: "component", type: i5.WHeaderPanelComponent, selector: "w-header-panel", inputs: ["showButtonBack", "backToCustomRoute"], outputs: ["onClickButtonBack"] }] });
|
|
18
|
+
WSkeletonEditComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonEditComponent, selector: "w-skeleton-edit", inputs: { columnsNumber: "columnsNumber" }, ngImport: i0, template: "<w-body-container>\r\n <w-header-panel class=\"col-12\">\r\n <div class=\"main-actions\">\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n <ng-container *ngFor=\"let item of columnsArray\">\r\n <w-panel *ngIf=\"columnsNumber == 1\" class=\"col-12\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n <w-panel *ngIf=\"columnsNumber == 3\" class=\"col-4\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n <w-panel *ngIf=\"columnsNumber == 2\" class=\"col-6\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n </ng-container>\r\n <w-panel class=\"col-12\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n</w-body-container>\r\n", styles: [""], 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.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i3.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "backgroundColor", "activeMenu", "menuOptions"] }, { kind: "component", type: i4.WBodyContainerComponent, selector: "w-body-container" }, { kind: "component", type: i5.WHeaderPanelComponent, selector: "w-header-panel", inputs: ["showButtonBack", "backToCustomRoute"], outputs: ["onClickButtonBack"] }] });
|
|
19
19
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonEditComponent, decorators: [{
|
|
20
20
|
type: Component,
|
|
21
21
|
args: [{ selector: 'w-skeleton-edit', template: "<w-body-container>\r\n <w-header-panel class=\"col-12\">\r\n <div class=\"main-actions\">\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n <ng-container *ngFor=\"let item of columnsArray\">\r\n <w-panel *ngIf=\"columnsNumber == 1\" class=\"col-12\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n <w-panel *ngIf=\"columnsNumber == 3\" class=\"col-4\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n <w-panel *ngIf=\"columnsNumber == 2\" class=\"col-6\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n </ng-container>\r\n <w-panel class=\"col-12\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" height=\"500px\"></p-skeleton>\r\n </w-panel>\r\n</w-body-container>\r\n" }]
|
package/esm2020/lib/shared/skeletons/w-skeleton-edit-product/w-skeleton-edit-product.component.mjs
CHANGED
|
@@ -9,7 +9,7 @@ import * as i6 from "../w-skeleton-input-generic/w-skeleton-input-generic.compon
|
|
|
9
9
|
export class WSkeletonEditProductComponent {
|
|
10
10
|
}
|
|
11
11
|
WSkeletonEditProductComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonEditProductComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
12
|
-
WSkeletonEditProductComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonEditProductComponent, selector: "w-skeleton-edit-product", ngImport: i0, template: "<w-body-container>\r\n <w-header-panel class=\"col-12\">\r\n <div class=\"main-actions\" >\r\n <p-skeleton height=\"32px\" width=\"129px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n\r\n <w-panel class=\"col-12 xl:col-8\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\" height=\"140px\"></w-skeleton-input-generic>\r\n\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-4\">\r\n <w-panel-grid class=\"col-12\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel-grid>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-12\">\r\n <w-skeleton-input-generic class=\"col-4\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-12\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\" height=\"140px\"></w-skeleton-input-generic>\r\n </w-panel>\r\n</w-body-container>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i2.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "activeMenu", "menuOptions"] }, { kind: "component", type: i3.WBodyContainerComponent, selector: "w-body-container" }, { kind: "component", type: i4.WHeaderPanelComponent, selector: "w-header-panel", inputs: ["showButtonBack", "backToCustomRoute"], outputs: ["onClickButtonBack"] }, { kind: "component", type: i5.WPanelGridComponent, selector: "w-panel-grid" }, { kind: "component", type: i6.WSkeletonInputGenericComponent, selector: "w-skeleton-input-generic", inputs: ["height", "width", "hasAlign", "label"] }] });
|
|
12
|
+
WSkeletonEditProductComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonEditProductComponent, selector: "w-skeleton-edit-product", ngImport: i0, template: "<w-body-container>\r\n <w-header-panel class=\"col-12\">\r\n <div class=\"main-actions\" >\r\n <p-skeleton height=\"32px\" width=\"129px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n\r\n <w-panel class=\"col-12 xl:col-8\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\" height=\"140px\"></w-skeleton-input-generic>\r\n\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-4\">\r\n <w-panel-grid class=\"col-12\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel-grid>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-12\">\r\n <w-skeleton-input-generic class=\"col-4\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-12\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\" height=\"140px\"></w-skeleton-input-generic>\r\n </w-panel>\r\n</w-body-container>\r\n", styles: [""], dependencies: [{ kind: "component", type: i1.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i2.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "backgroundColor", "activeMenu", "menuOptions"] }, { kind: "component", type: i3.WBodyContainerComponent, selector: "w-body-container" }, { kind: "component", type: i4.WHeaderPanelComponent, selector: "w-header-panel", inputs: ["showButtonBack", "backToCustomRoute"], outputs: ["onClickButtonBack"] }, { kind: "component", type: i5.WPanelGridComponent, selector: "w-panel-grid" }, { kind: "component", type: i6.WSkeletonInputGenericComponent, selector: "w-skeleton-input-generic", inputs: ["height", "width", "hasAlign", "label"] }] });
|
|
13
13
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonEditProductComponent, decorators: [{
|
|
14
14
|
type: Component,
|
|
15
15
|
args: [{ selector: 'w-skeleton-edit-product', template: "<w-body-container>\r\n <w-header-panel class=\"col-12\">\r\n <div class=\"main-actions\" >\r\n <p-skeleton height=\"32px\" width=\"129px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n\r\n <w-panel class=\"col-12 xl:col-8\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\" height=\"140px\"></w-skeleton-input-generic>\r\n\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-3\" label=\"''\"></w-skeleton-input-generic>\r\n\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-6 xl:col-4\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-4\">\r\n <w-panel-grid class=\"col-12\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel-grid>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-12\">\r\n <w-skeleton-input-generic class=\"col-4\" label=\"''\"></w-skeleton-input-generic>\r\n </w-panel>\r\n <w-panel class=\"col-12 xl:col-12\">\r\n <w-skeleton-input-generic class=\"col-12\" label=\"''\" height=\"140px\"></w-skeleton-input-generic>\r\n </w-panel>\r\n</w-body-container>\r\n" }]
|
|
@@ -13,7 +13,7 @@ export class WSkeletonListComponent {
|
|
|
13
13
|
}
|
|
14
14
|
}
|
|
15
15
|
WSkeletonListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
-
WSkeletonListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonListComponent, selector: "w-skeleton-list", inputs: { headerPanel: "headerPanel", contentReduced: "contentReduced" }, ngImport: i0, template: "<w-body-container>\r\n <w-header-panel *ngIf=\"headerPanel\" class=\"col-12\">\r\n <div class=\"main-actions\">\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n <w-panel class=\"col-12\" [reduced]=\"contentReduced\">\r\n <w-skeleton-input-generic class=\"col-12\" [hasAlign]=\"false\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" [hasAlign]=\"false\" height=\"300px\"></w-skeleton-input-generic>\r\n </w-panel>\r\n</w-body-container>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i3.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "activeMenu", "menuOptions"] }, { kind: "component", type: i4.WBodyContainerComponent, selector: "w-body-container" }, { kind: "component", type: i5.WHeaderPanelComponent, selector: "w-header-panel", inputs: ["showButtonBack", "backToCustomRoute"], outputs: ["onClickButtonBack"] }, { kind: "component", type: i6.WSkeletonInputGenericComponent, selector: "w-skeleton-input-generic", inputs: ["height", "width", "hasAlign", "label"] }] });
|
|
16
|
+
WSkeletonListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonListComponent, selector: "w-skeleton-list", inputs: { headerPanel: "headerPanel", contentReduced: "contentReduced" }, ngImport: i0, template: "<w-body-container>\r\n <w-header-panel *ngIf=\"headerPanel\" class=\"col-12\">\r\n <div class=\"main-actions\">\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n <w-panel class=\"col-12\" [reduced]=\"contentReduced\">\r\n <w-skeleton-input-generic class=\"col-12\" [hasAlign]=\"false\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" [hasAlign]=\"false\" height=\"300px\"></w-skeleton-input-generic>\r\n </w-panel>\r\n</w-body-container>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i3.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "backgroundColor", "activeMenu", "menuOptions"] }, { kind: "component", type: i4.WBodyContainerComponent, selector: "w-body-container" }, { kind: "component", type: i5.WHeaderPanelComponent, selector: "w-header-panel", inputs: ["showButtonBack", "backToCustomRoute"], outputs: ["onClickButtonBack"] }, { kind: "component", type: i6.WSkeletonInputGenericComponent, selector: "w-skeleton-input-generic", inputs: ["height", "width", "hasAlign", "label"] }] });
|
|
17
17
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonListComponent, decorators: [{
|
|
18
18
|
type: Component,
|
|
19
19
|
args: [{ selector: 'w-skeleton-list', template: "<w-body-container>\r\n <w-header-panel *ngIf=\"headerPanel\" class=\"col-12\">\r\n <div class=\"main-actions\">\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n <p-skeleton height=\"32px\" width=\"190px\"></p-skeleton>\r\n </div>\r\n </w-header-panel>\r\n <w-panel class=\"col-12\" [reduced]=\"contentReduced\">\r\n <w-skeleton-input-generic class=\"col-12\" [hasAlign]=\"false\"></w-skeleton-input-generic>\r\n <w-skeleton-input-generic class=\"col-12\" [hasAlign]=\"false\" height=\"300px\"></w-skeleton-input-generic>\r\n </w-panel>\r\n</w-body-container>" }]
|
|
@@ -14,7 +14,7 @@ export class WSkeletonTimelineComponent {
|
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
WSkeletonTimelineComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonTimelineComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
17
|
-
WSkeletonTimelineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonTimelineComponent, selector: "w-skeleton-timeline", inputs: { eventsNumber: "eventsNumber" }, ngImport: i0, template: "<p-timeline [value]=\"events\" [align]=\"'alternate'\" styleClass=\"customized-timeline\">\r\n <ng-template pTemplate=\"marker\" let-event>\r\n <p-skeleton shape=\"circle\" size=\"2rem\"></p-skeleton>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-event>\r\n <w-panel [reduced]=\"true\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"100px\"></p-skeleton>\r\n </w-panel>\r\n </ng-template>\r\n</p-timeline>", styles: [""], dependencies: [{ kind: "directive", type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i3.Timeline, selector: "p-timeline", inputs: ["value", "style", "styleClass", "align", "layout"] }, { kind: "component", type: i4.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "activeMenu", "menuOptions"] }] });
|
|
17
|
+
WSkeletonTimelineComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.7", type: WSkeletonTimelineComponent, selector: "w-skeleton-timeline", inputs: { eventsNumber: "eventsNumber" }, ngImport: i0, template: "<p-timeline [value]=\"events\" [align]=\"'alternate'\" styleClass=\"customized-timeline\">\r\n <ng-template pTemplate=\"marker\" let-event>\r\n <p-skeleton shape=\"circle\" size=\"2rem\"></p-skeleton>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-event>\r\n <w-panel [reduced]=\"true\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"100px\"></p-skeleton>\r\n </w-panel>\r\n </ng-template>\r\n</p-timeline>", styles: [""], dependencies: [{ kind: "directive", type: i1.PrimeTemplate, selector: "[pTemplate]", inputs: ["type", "pTemplate"] }, { kind: "component", type: i2.Skeleton, selector: "p-skeleton", inputs: ["styleClass", "style", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: i3.Timeline, selector: "p-timeline", inputs: ["value", "style", "styleClass", "align", "layout"] }, { kind: "component", type: i4.WPanelComponent, selector: "w-panel", inputs: ["width", "title", "subtitle", "activeGrid", "reduced", "justifyContent", "activeOverflow", "heightOverflow", "maxHeightOverflow", "backgroundColor", "activeMenu", "menuOptions"] }] });
|
|
18
18
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.7", ngImport: i0, type: WSkeletonTimelineComponent, decorators: [{
|
|
19
19
|
type: Component,
|
|
20
20
|
args: [{ selector: 'w-skeleton-timeline', template: "<p-timeline [value]=\"events\" [align]=\"'alternate'\" styleClass=\"customized-timeline\">\r\n <ng-template pTemplate=\"marker\" let-event>\r\n <p-skeleton shape=\"circle\" size=\"2rem\"></p-skeleton>\r\n </ng-template>\r\n <ng-template pTemplate=\"content\" let-event>\r\n <w-panel [reduced]=\"true\">\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"20px\"></p-skeleton>\r\n <p-skeleton class=\"col-12\" width=\"100%\" height=\"100px\"></p-skeleton>\r\n </w-panel>\r\n </ng-template>\r\n</p-timeline>" }]
|