cfc-ds
Version:
Design System do Conselho Federal de Contabilidade baseado no govbr-ds
137 lines • 55.6 kB
JavaScript
// wizard.component.ts
// Adicione uma nova propriedade para controlar a orientação
import { Component, ContentChildren, Output, EventEmitter, Input, HostListener } from '@angular/core';
import { WizardStepComponent } from './wizardStep/wizard-step.component';
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
import * as i2 from "@angular/flex-layout/extended";
export class WizardComponent {
stepsQuery;
steps = [];
currentStepIndex = 0;
showCancelButton = true;
alwaysShowBackButton = false;
isFirstStepDisabled = false;
isNextButtonDisabled = false;
isFinishButtonDisabled = false;
cancelText = 'Cancelar';
backText = 'Voltar';
nextText = 'Avançar';
finishText = 'Concluir';
// Nova propriedade para forçar o modo móvel
forceMobileMode = null;
// Nova propriedade para controlar a orientação do wizard
orientation = 'horizontal';
// Propriedade para armazenar o estado atual do modo móvel
isMobileView = false;
stepChange = new EventEmitter();
wizardCancel = new EventEmitter();
wizardComplete = new EventEmitter();
get isLastStep() {
return this.currentStepIndex === this.steps.length - 1;
}
ngOnInit() {
this.checkMobileView();
}
ngAfterContentInit() {
this.stepsQuery.changes.subscribe(() => {
this.updateSteps();
});
this.updateSteps();
}
// Método para detectar modo móvel quando a janela é redimensionada
onResize() {
this.checkMobileView();
}
// Verifica se deve usar o modo móvel
checkMobileView() {
// Se forceMobileMode for fornecido, usa esse valor
// Caso contrário, faz detecção automática baseada na largura da tela
if (this.forceMobileMode !== null) {
this.isMobileView = this.forceMobileMode;
}
else {
this.isMobileView = window.innerWidth <= 576; // Breakpoint padrão para mobile
}
}
updateSteps() {
this.steps = this.stepsQuery.toArray();
this.updateActiveStep();
}
next() {
if (this.currentStepIndex < this.steps.length - 1) {
this.currentStepIndex++;
this.updateActiveStep();
this.stepChange.emit(this.currentStepIndex);
}
}
previous() {
if (this.currentStepIndex > 0) {
this.currentStepIndex--;
this.updateActiveStep();
this.stepChange.emit(this.currentStepIndex);
}
}
finish() {
this.wizardComplete.emit();
}
onCancel() {
this.wizardCancel.emit();
}
updateActiveStep() {
this.steps.forEach((step, index) => {
step.isActive = index === this.currentStepIndex;
step.isCompleted = index < this.currentStepIndex;
});
}
goToStep(index) {
if (index >= 0 && index < this.steps.length) {
this.currentStepIndex = index;
this.updateActiveStep();
this.stepChange.emit(this.currentStepIndex);
}
}
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WizardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: WizardComponent, selector: "cfc-wizard", inputs: { currentStepIndex: "currentStepIndex", showCancelButton: "showCancelButton", alwaysShowBackButton: "alwaysShowBackButton", isFirstStepDisabled: "isFirstStepDisabled", isNextButtonDisabled: "isNextButtonDisabled", isFinishButtonDisabled: "isFinishButtonDisabled", cancelText: "cancelText", backText: "backText", nextText: "nextText", finishText: "finishText", forceMobileMode: "forceMobileMode", orientation: "orientation" }, outputs: { stepChange: "stepChange", wizardCancel: "wizardCancel", wizardComplete: "wizardComplete" }, host: { listeners: { "window:resize": "onResize()" } }, queries: [{ propertyName: "stepsQuery", predicate: WizardStepComponent }], ngImport: i0, template: "<!-- wizard.component.html -->\r\n<div class=\"wizard-container\" \r\n [ngClass]=\"{\r\n 'mobile-view': isMobileView,\r\n 'vertical-layout': orientation === 'vertical'\r\n }\">\r\n \r\n <!-- wizard.component.html (parte do layout vertical) -->\r\n <ng-container *ngIf=\"orientation === 'vertical'\">\r\n <div class=\"wizard-layout-vertical\">\r\n <!-- Painel vertical de etapas -->\r\n <div class=\"wizard-steps-panel-vertical\">\r\n <div class=\"steps-container-vertical\">\r\n <!-- Linha conectora cont\u00EDnua principal -->\r\n <div class=\"vertical-connector-line\"></div>\r\n \r\n <ng-container *ngFor=\"let step of steps; let i = index; let last = last\">\r\n <div class=\"step-item-vertical\" \r\n [class.active]=\"i === currentStepIndex\"\r\n [class.completed]=\"i < currentStepIndex\"\r\n [class.disabled]=\"i > currentStepIndex\"\r\n (click)=\"i <= currentStepIndex && goToStep(i)\">\r\n <div class=\"step-label-vertical\">{{ step.label }}</div>\r\n <div class=\"step-circle-vertical\">{{ i + 1 }}</div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n\r\n <!-- \u00C1rea de conte\u00FAdo vertical -->\r\n <div class=\"wizard-content-area-vertical\">\r\n <ng-container *ngFor=\"let step of steps; let i = index\">\r\n <div class=\"step-content\" [hidden]=\"i !== currentStepIndex\">\r\n <ng-container *ngTemplateOutlet=\"step.contentTemplate\"></ng-container>\r\n </div>\r\n </ng-container>\r\n \r\n <!-- Navega\u00E7\u00E3o na parte inferior -->\r\n <div class=\"wizard-navigation-container\">\r\n <div class=\"wizard-navigation-content\">\r\n <!-- Cancelar -->\r\n <button \r\n class=\"wizard-cancel-button\" \r\n *ngIf=\"showCancelButton\" \r\n (click)=\"onCancel()\">\r\n {{ cancelText }}\r\n </button>\r\n \r\n <div class=\"wizard-navigation-buttons\">\r\n <button \r\n class=\"wizard-back-button\"\r\n [disabled]=\"currentStepIndex === 0\"\r\n *ngIf=\"currentStepIndex > 0 || alwaysShowBackButton\"\r\n (click)=\"previous()\">\r\n {{ backText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-next-button\"\r\n [disabled]=\"isNextButtonDisabled\"\r\n *ngIf=\"!isLastStep\"\r\n (click)=\"next()\">\r\n {{ nextText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-finish-button\"\r\n [disabled]=\"isFinishButtonDisabled\"\r\n *ngIf=\"isLastStep\"\r\n (click)=\"finish()\">\r\n {{ finishText }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n \r\n <!-- Layout horizontal (mantido como estava) -->\r\n <ng-container *ngIf=\"orientation === 'horizontal'\">\r\n <!-- Painel de etapas -->\r\n <div class=\"wizard-steps-panel\" [ngClass]=\"{'hidden-xs': isMobileView && steps.length > 4}\">\r\n <div class=\"steps-container\">\r\n <!-- Componente Step -->\r\n <ng-container *ngFor=\"let step of steps; let i = index; let last = last\">\r\n <div class=\"step-item\" \r\n [class.active]=\"i === currentStepIndex\"\r\n [class.completed]=\"i < currentStepIndex\"\r\n [class.disabled]=\"i > currentStepIndex\">\r\n <div class=\"step-circle\">{{ i + 1 }}</div>\r\n <div class=\"step-label\">{{ step.label }}</div>\r\n </div>\r\n <div class=\"step-connector\" *ngIf=\"!last\"></div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n \r\n <!-- \u00C1rea de Conte\u00FAdo -->\r\n <div class=\"wizard-content-area\">\r\n <ng-container *ngFor=\"let step of steps; let i = index\">\r\n <div class=\"step-content\" [hidden]=\"i !== currentStepIndex\">\r\n <ng-container *ngTemplateOutlet=\"step.contentTemplate\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n \r\n <!-- Barra de Navega\u00E7\u00E3o -->\r\n <div class=\"wizard-navigation-container\" [ngClass]=\"{'mobile-navigation': isMobileView}\">\r\n <div class=\"wizard-navigation-content\">\r\n <!-- Link Cancelar -->\r\n <button \r\n class=\"wizard-cancel-button\" \r\n *ngIf=\"showCancelButton\" \r\n (click)=\"onCancel()\">\r\n {{ cancelText }}\r\n </button>\r\n \r\n <div class=\"wizard-navigation-buttons\">\r\n <!-- Modo Desktop: Bot\u00F5es regulares -->\r\n <ng-container *ngIf=\"!isMobileView\">\r\n <button \r\n class=\"wizard-back-button\"\r\n [disabled]=\"currentStepIndex === 0\"\r\n *ngIf=\"currentStepIndex > 0 || alwaysShowBackButton\"\r\n (click)=\"previous()\">\r\n {{ backText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-next-button\"\r\n [disabled]=\"isNextButtonDisabled\"\r\n *ngIf=\"!isLastStep\"\r\n (click)=\"next()\">\r\n {{ nextText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-finish-button\"\r\n [disabled]=\"isFinishButtonDisabled\"\r\n *ngIf=\"isLastStep\"\r\n (click)=\"finish()\">\r\n {{ finishText }}\r\n </button>\r\n </ng-container>\r\n \r\n <!-- Modo Mobile: Bot\u00F5es circulares -->\r\n <ng-container *ngIf=\"isMobileView\">\r\n <!-- Bot\u00E3o voltar circular -->\r\n <button \r\n class=\"wizard-mobile-button wizard-mobile-back-button\"\r\n [disabled]=\"currentStepIndex === 0\"\r\n *ngIf=\"currentStepIndex > 0 || alwaysShowBackButton\"\r\n (click)=\"previous()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n <path d=\"M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z\"/>\r\n </svg>\r\n </button>\r\n \r\n <!-- Bot\u00E3o avan\u00E7ar circular -->\r\n <button \r\n class=\"wizard-mobile-button wizard-mobile-next-button\"\r\n [disabled]=\"isNextButtonDisabled\"\r\n *ngIf=\"!isLastStep\"\r\n (click)=\"next()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"/>\r\n </svg>\r\n </button>\r\n \r\n <!-- Bot\u00E3o concluir circular -->\r\n <button \r\n class=\"wizard-mobile-button wizard-mobile-finish-button\"\r\n [disabled]=\"isFinishButtonDisabled\"\r\n *ngIf=\"isLastStep\"\r\n (click)=\"finish()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n <path d=\"M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z\"/>\r\n </svg>\r\n </button>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>", styles: [".wizard-container{display:flex;flex-direction:column;border:1px solid #e0e0e0;border-radius:4px;background-color:#fff;box-shadow:0 2px 10px #0000000d}.wizard-steps-panel{padding:24px;border-bottom:1px solid #e0e0e0}.steps-container{display:flex;align-items:center;justify-content:space-between;z-index:9;position:relative;background-color:#fff}.step-item{display:flex;flex-direction:column;align-items:center;position:relative;z-index:9;background-color:#fff}.step-circle{width:32px;height:32px;border-radius:50%;border:2px solid #e0e0e0;background-color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:14px;color:#757575;margin-bottom:8px}.step-item.active .step-circle{border-color:#0052cc;background-color:#0052cc;color:#fff}.step-item.completed .step-circle{border-color:#0052cc;background-color:#fff;color:#0052cc}.step-label{font-size:14px;color:#757575}.step-item.active .step-label{color:#0052cc;font-weight:500}.step-connector{position:absolute;height:2px;background-color:#e0e0e0;z-index:1;top:16px;left:16px;right:16px}.wizard-content-area{padding:32px 24px;min-height:200px}.wizard-navigation-container{padding:16px 24px;background-color:#fff;border-top:1px solid #e0e0e0}.wizard-navigation-content{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;width:100%}.wizard-navigation-buttons{display:flex;gap:8px}.wizard-cancel-button{background-color:transparent;color:#06c;border:none;padding:8px 0;font-weight:500;font-size:14px;cursor:pointer}.wizard-cancel-button:hover{color:#004999;text-decoration:underline}.wizard-back-button{background-color:#fff;color:#06c;border:1px solid #0066CC;border-radius:20px;padding:8px 24px;font-weight:500;font-size:14px;cursor:pointer;min-width:100px}.wizard-back-button:hover:not(:disabled){background-color:#0066cc0d}.wizard-back-button:disabled{opacity:.5;cursor:not-allowed}.wizard-next-button,.wizard-finish-button{background-color:#06c;color:#fff;border:none;border-radius:20px;padding:8px 24px;font-weight:500;font-size:14px;cursor:pointer;min-width:100px}.wizard-next-button:hover:not(:disabled),.wizard-finish-button:hover:not(:disabled){background-color:#004999}.wizard-next-button:disabled,.wizard-finish-button:disabled{opacity:.5;cursor:not-allowed}.mobile-navigation{background-color:#fff;padding:16px;box-shadow:0 -2px 10px #0000001a}.mobile-navigation .wizard-navigation-content{display:flex;justify-content:space-between;align-items:center}.mobile-navigation .wizard-cancel-button{color:#06c;background-color:transparent;border:none;font-size:14px;font-weight:500;padding:0;cursor:pointer;text-decoration:none}.mobile-navigation .wizard-cancel-button:hover{text-decoration:underline}.mobile-navigation .wizard-navigation-buttons{display:flex;gap:12px}.wizard-mobile-button{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:background-color .2s ease}.wizard-mobile-button:disabled{opacity:.5;cursor:not-allowed}.wizard-mobile-button svg{width:16px;height:16px}.wizard-mobile-back-button{border:1px solid #0066CC;background-color:#fff}.wizard-mobile-back-button svg{color:#06c}.wizard-mobile-back-button:hover:not(:disabled){background-color:#0066cc0d}.wizard-mobile-next-button,.wizard-mobile-finish-button{background-color:#06c;color:#fff}.wizard-mobile-next-button:hover:not(:disabled),.wizard-mobile-finish-button:hover:not(:disabled){background-color:#004999}@media (max-width: 576px){.mobile-navigation{position:fixed;bottom:0;left:0;right:0;z-index:1000;border-top:1px solid #e0e0e0}.wizard-content-area{padding-bottom:80px}.hidden-xs{display:none}}.mobile-view .wizard-steps-panel,.mobile-view .wizard-content-area{padding:16px}.vertical-layout .wizard-layout-vertical .wizard-steps-panel-vertical{width:260px;min-width:200px;border-right:1px solid #e0e0e0;padding:32px 0}.vertical-layout{height:100%}.vertical-layout .wizard-layout-vertical{display:flex;height:100%;min-height:400px}.vertical-layout .wizard-layout-vertical .wizard-steps-panel-vertical{width:200px;min-width:180px;border-right:1px solid #e0e0e0;padding:32px 0;position:relative;background-color:#f9f9f9}.vertical-layout .wizard-layout-vertical .wizard-content-area-vertical{flex:1;display:flex;flex-direction:column}.vertical-layout .wizard-layout-vertical .wizard-content-area-vertical .step-content{flex:1;padding:32px;overflow-y:auto}.vertical-layout .wizard-layout-vertical .wizard-content-area-vertical .wizard-navigation-container{border-top:1px solid #e0e0e0;padding:16px 32px}.steps-container-vertical{display:flex;align-items:center;justify-content:space-between;position:relative}.steps-container-vertical .vertical-connector-line{position:absolute;width:2px;background-color:#e0e0e0;top:0;bottom:0;right:40px;z-index:1}.step-item-vertical{display:flex;align-items:center;padding:16px 0;position:relative;cursor:pointer}.step-item-vertical .step-circle-vertical{width:32px;height:32px;border-radius:50%;border:2px solid #e0e0e0;background-color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:14px;color:#757575;position:relative;z-index:2;margin-left:auto}.step-item-vertical .step-label-vertical{font-size:14px;color:#06c;margin-right:24px;font-weight:400}.step-item-vertical.active .step-circle-vertical{border-color:#0052cc;background-color:#0052cc;color:#fff}.step-item-vertical.active .step-label-vertical{color:#0052cc;font-weight:500}.step-item-vertical.completed .step-circle-vertical{border-color:#0052cc;background-color:#fff;color:#0052cc}.step-item-vertical.completed~.vertical-connector-line{background-color:#0052cc}.step-item-vertical:hover:not(.disabled) .step-label-vertical{text-decoration:underline}.step-item-vertical.disabled{cursor:not-allowed;opacity:.7}@media (max-width: 768px){.vertical-layout .wizard-layout-vertical{flex-direction:column}.vertical-layout .wizard-layout-vertical .wizard-steps-panel-vertical{width:100%;max-height:200px;overflow-y:auto;border-right:none;border-bottom:1px solid #e0e0e0;padding:16px}.vertical-layout .wizard-layout-vertical .vertical-connector-line{display:none}.vertical-layout .wizard-layout-vertical .step-item-vertical{padding:10px 0}.vertical-layout .wizard-layout-vertical .step-item-vertical .step-label-vertical{margin-right:auto}.vertical-layout .wizard-layout-vertical .step-item-vertical .step-circle-vertical{margin-left:16px}}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { 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.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }] });
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: WizardComponent, decorators: [{
type: Component,
args: [{ selector: 'cfc-wizard', template: "<!-- wizard.component.html -->\r\n<div class=\"wizard-container\" \r\n [ngClass]=\"{\r\n 'mobile-view': isMobileView,\r\n 'vertical-layout': orientation === 'vertical'\r\n }\">\r\n \r\n <!-- wizard.component.html (parte do layout vertical) -->\r\n <ng-container *ngIf=\"orientation === 'vertical'\">\r\n <div class=\"wizard-layout-vertical\">\r\n <!-- Painel vertical de etapas -->\r\n <div class=\"wizard-steps-panel-vertical\">\r\n <div class=\"steps-container-vertical\">\r\n <!-- Linha conectora cont\u00EDnua principal -->\r\n <div class=\"vertical-connector-line\"></div>\r\n \r\n <ng-container *ngFor=\"let step of steps; let i = index; let last = last\">\r\n <div class=\"step-item-vertical\" \r\n [class.active]=\"i === currentStepIndex\"\r\n [class.completed]=\"i < currentStepIndex\"\r\n [class.disabled]=\"i > currentStepIndex\"\r\n (click)=\"i <= currentStepIndex && goToStep(i)\">\r\n <div class=\"step-label-vertical\">{{ step.label }}</div>\r\n <div class=\"step-circle-vertical\">{{ i + 1 }}</div>\r\n </div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n\r\n <!-- \u00C1rea de conte\u00FAdo vertical -->\r\n <div class=\"wizard-content-area-vertical\">\r\n <ng-container *ngFor=\"let step of steps; let i = index\">\r\n <div class=\"step-content\" [hidden]=\"i !== currentStepIndex\">\r\n <ng-container *ngTemplateOutlet=\"step.contentTemplate\"></ng-container>\r\n </div>\r\n </ng-container>\r\n \r\n <!-- Navega\u00E7\u00E3o na parte inferior -->\r\n <div class=\"wizard-navigation-container\">\r\n <div class=\"wizard-navigation-content\">\r\n <!-- Cancelar -->\r\n <button \r\n class=\"wizard-cancel-button\" \r\n *ngIf=\"showCancelButton\" \r\n (click)=\"onCancel()\">\r\n {{ cancelText }}\r\n </button>\r\n \r\n <div class=\"wizard-navigation-buttons\">\r\n <button \r\n class=\"wizard-back-button\"\r\n [disabled]=\"currentStepIndex === 0\"\r\n *ngIf=\"currentStepIndex > 0 || alwaysShowBackButton\"\r\n (click)=\"previous()\">\r\n {{ backText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-next-button\"\r\n [disabled]=\"isNextButtonDisabled\"\r\n *ngIf=\"!isLastStep\"\r\n (click)=\"next()\">\r\n {{ nextText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-finish-button\"\r\n [disabled]=\"isFinishButtonDisabled\"\r\n *ngIf=\"isLastStep\"\r\n (click)=\"finish()\">\r\n {{ finishText }}\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n \r\n <!-- Layout horizontal (mantido como estava) -->\r\n <ng-container *ngIf=\"orientation === 'horizontal'\">\r\n <!-- Painel de etapas -->\r\n <div class=\"wizard-steps-panel\" [ngClass]=\"{'hidden-xs': isMobileView && steps.length > 4}\">\r\n <div class=\"steps-container\">\r\n <!-- Componente Step -->\r\n <ng-container *ngFor=\"let step of steps; let i = index; let last = last\">\r\n <div class=\"step-item\" \r\n [class.active]=\"i === currentStepIndex\"\r\n [class.completed]=\"i < currentStepIndex\"\r\n [class.disabled]=\"i > currentStepIndex\">\r\n <div class=\"step-circle\">{{ i + 1 }}</div>\r\n <div class=\"step-label\">{{ step.label }}</div>\r\n </div>\r\n <div class=\"step-connector\" *ngIf=\"!last\"></div>\r\n </ng-container>\r\n </div>\r\n </div>\r\n \r\n <!-- \u00C1rea de Conte\u00FAdo -->\r\n <div class=\"wizard-content-area\">\r\n <ng-container *ngFor=\"let step of steps; let i = index\">\r\n <div class=\"step-content\" [hidden]=\"i !== currentStepIndex\">\r\n <ng-container *ngTemplateOutlet=\"step.contentTemplate\"></ng-container>\r\n </div>\r\n </ng-container>\r\n </div>\r\n \r\n <!-- Barra de Navega\u00E7\u00E3o -->\r\n <div class=\"wizard-navigation-container\" [ngClass]=\"{'mobile-navigation': isMobileView}\">\r\n <div class=\"wizard-navigation-content\">\r\n <!-- Link Cancelar -->\r\n <button \r\n class=\"wizard-cancel-button\" \r\n *ngIf=\"showCancelButton\" \r\n (click)=\"onCancel()\">\r\n {{ cancelText }}\r\n </button>\r\n \r\n <div class=\"wizard-navigation-buttons\">\r\n <!-- Modo Desktop: Bot\u00F5es regulares -->\r\n <ng-container *ngIf=\"!isMobileView\">\r\n <button \r\n class=\"wizard-back-button\"\r\n [disabled]=\"currentStepIndex === 0\"\r\n *ngIf=\"currentStepIndex > 0 || alwaysShowBackButton\"\r\n (click)=\"previous()\">\r\n {{ backText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-next-button\"\r\n [disabled]=\"isNextButtonDisabled\"\r\n *ngIf=\"!isLastStep\"\r\n (click)=\"next()\">\r\n {{ nextText }}\r\n </button>\r\n \r\n <button \r\n class=\"wizard-finish-button\"\r\n [disabled]=\"isFinishButtonDisabled\"\r\n *ngIf=\"isLastStep\"\r\n (click)=\"finish()\">\r\n {{ finishText }}\r\n </button>\r\n </ng-container>\r\n \r\n <!-- Modo Mobile: Bot\u00F5es circulares -->\r\n <ng-container *ngIf=\"isMobileView\">\r\n <!-- Bot\u00E3o voltar circular -->\r\n <button \r\n class=\"wizard-mobile-button wizard-mobile-back-button\"\r\n [disabled]=\"currentStepIndex === 0\"\r\n *ngIf=\"currentStepIndex > 0 || alwaysShowBackButton\"\r\n (click)=\"previous()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n <path d=\"M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z\"/>\r\n </svg>\r\n </button>\r\n \r\n <!-- Bot\u00E3o avan\u00E7ar circular -->\r\n <button \r\n class=\"wizard-mobile-button wizard-mobile-next-button\"\r\n [disabled]=\"isNextButtonDisabled\"\r\n *ngIf=\"!isLastStep\"\r\n (click)=\"next()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n <path d=\"M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z\"/>\r\n </svg>\r\n </button>\r\n \r\n <!-- Bot\u00E3o concluir circular -->\r\n <button \r\n class=\"wizard-mobile-button wizard-mobile-finish-button\"\r\n [disabled]=\"isFinishButtonDisabled\"\r\n *ngIf=\"isLastStep\"\r\n (click)=\"finish()\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"16\" height=\"16\" fill=\"currentColor\" viewBox=\"0 0 16 16\">\r\n <path d=\"M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z\"/>\r\n </svg>\r\n </button>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>", styles: [".wizard-container{display:flex;flex-direction:column;border:1px solid #e0e0e0;border-radius:4px;background-color:#fff;box-shadow:0 2px 10px #0000000d}.wizard-steps-panel{padding:24px;border-bottom:1px solid #e0e0e0}.steps-container{display:flex;align-items:center;justify-content:space-between;z-index:9;position:relative;background-color:#fff}.step-item{display:flex;flex-direction:column;align-items:center;position:relative;z-index:9;background-color:#fff}.step-circle{width:32px;height:32px;border-radius:50%;border:2px solid #e0e0e0;background-color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:14px;color:#757575;margin-bottom:8px}.step-item.active .step-circle{border-color:#0052cc;background-color:#0052cc;color:#fff}.step-item.completed .step-circle{border-color:#0052cc;background-color:#fff;color:#0052cc}.step-label{font-size:14px;color:#757575}.step-item.active .step-label{color:#0052cc;font-weight:500}.step-connector{position:absolute;height:2px;background-color:#e0e0e0;z-index:1;top:16px;left:16px;right:16px}.wizard-content-area{padding:32px 24px;min-height:200px}.wizard-navigation-container{padding:16px 24px;background-color:#fff;border-top:1px solid #e0e0e0}.wizard-navigation-content{display:flex;justify-content:space-between;align-items:center;max-width:1200px;margin:0 auto;width:100%}.wizard-navigation-buttons{display:flex;gap:8px}.wizard-cancel-button{background-color:transparent;color:#06c;border:none;padding:8px 0;font-weight:500;font-size:14px;cursor:pointer}.wizard-cancel-button:hover{color:#004999;text-decoration:underline}.wizard-back-button{background-color:#fff;color:#06c;border:1px solid #0066CC;border-radius:20px;padding:8px 24px;font-weight:500;font-size:14px;cursor:pointer;min-width:100px}.wizard-back-button:hover:not(:disabled){background-color:#0066cc0d}.wizard-back-button:disabled{opacity:.5;cursor:not-allowed}.wizard-next-button,.wizard-finish-button{background-color:#06c;color:#fff;border:none;border-radius:20px;padding:8px 24px;font-weight:500;font-size:14px;cursor:pointer;min-width:100px}.wizard-next-button:hover:not(:disabled),.wizard-finish-button:hover:not(:disabled){background-color:#004999}.wizard-next-button:disabled,.wizard-finish-button:disabled{opacity:.5;cursor:not-allowed}.mobile-navigation{background-color:#fff;padding:16px;box-shadow:0 -2px 10px #0000001a}.mobile-navigation .wizard-navigation-content{display:flex;justify-content:space-between;align-items:center}.mobile-navigation .wizard-cancel-button{color:#06c;background-color:transparent;border:none;font-size:14px;font-weight:500;padding:0;cursor:pointer;text-decoration:none}.mobile-navigation .wizard-cancel-button:hover{text-decoration:underline}.mobile-navigation .wizard-navigation-buttons{display:flex;gap:12px}.wizard-mobile-button{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;transition:background-color .2s ease}.wizard-mobile-button:disabled{opacity:.5;cursor:not-allowed}.wizard-mobile-button svg{width:16px;height:16px}.wizard-mobile-back-button{border:1px solid #0066CC;background-color:#fff}.wizard-mobile-back-button svg{color:#06c}.wizard-mobile-back-button:hover:not(:disabled){background-color:#0066cc0d}.wizard-mobile-next-button,.wizard-mobile-finish-button{background-color:#06c;color:#fff}.wizard-mobile-next-button:hover:not(:disabled),.wizard-mobile-finish-button:hover:not(:disabled){background-color:#004999}@media (max-width: 576px){.mobile-navigation{position:fixed;bottom:0;left:0;right:0;z-index:1000;border-top:1px solid #e0e0e0}.wizard-content-area{padding-bottom:80px}.hidden-xs{display:none}}.mobile-view .wizard-steps-panel,.mobile-view .wizard-content-area{padding:16px}.vertical-layout .wizard-layout-vertical .wizard-steps-panel-vertical{width:260px;min-width:200px;border-right:1px solid #e0e0e0;padding:32px 0}.vertical-layout{height:100%}.vertical-layout .wizard-layout-vertical{display:flex;height:100%;min-height:400px}.vertical-layout .wizard-layout-vertical .wizard-steps-panel-vertical{width:200px;min-width:180px;border-right:1px solid #e0e0e0;padding:32px 0;position:relative;background-color:#f9f9f9}.vertical-layout .wizard-layout-vertical .wizard-content-area-vertical{flex:1;display:flex;flex-direction:column}.vertical-layout .wizard-layout-vertical .wizard-content-area-vertical .step-content{flex:1;padding:32px;overflow-y:auto}.vertical-layout .wizard-layout-vertical .wizard-content-area-vertical .wizard-navigation-container{border-top:1px solid #e0e0e0;padding:16px 32px}.steps-container-vertical{display:flex;align-items:center;justify-content:space-between;position:relative}.steps-container-vertical .vertical-connector-line{position:absolute;width:2px;background-color:#e0e0e0;top:0;bottom:0;right:40px;z-index:1}.step-item-vertical{display:flex;align-items:center;padding:16px 0;position:relative;cursor:pointer}.step-item-vertical .step-circle-vertical{width:32px;height:32px;border-radius:50%;border:2px solid #e0e0e0;background-color:#fff;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:14px;color:#757575;position:relative;z-index:2;margin-left:auto}.step-item-vertical .step-label-vertical{font-size:14px;color:#06c;margin-right:24px;font-weight:400}.step-item-vertical.active .step-circle-vertical{border-color:#0052cc;background-color:#0052cc;color:#fff}.step-item-vertical.active .step-label-vertical{color:#0052cc;font-weight:500}.step-item-vertical.completed .step-circle-vertical{border-color:#0052cc;background-color:#fff;color:#0052cc}.step-item-vertical.completed~.vertical-connector-line{background-color:#0052cc}.step-item-vertical:hover:not(.disabled) .step-label-vertical{text-decoration:underline}.step-item-vertical.disabled{cursor:not-allowed;opacity:.7}@media (max-width: 768px){.vertical-layout .wizard-layout-vertical{flex-direction:column}.vertical-layout .wizard-layout-vertical .wizard-steps-panel-vertical{width:100%;max-height:200px;overflow-y:auto;border-right:none;border-bottom:1px solid #e0e0e0;padding:16px}.vertical-layout .wizard-layout-vertical .vertical-connector-line{display:none}.vertical-layout .wizard-layout-vertical .step-item-vertical{padding:10px 0}.vertical-layout .wizard-layout-vertical .step-item-vertical .step-label-vertical{margin-right:auto}.vertical-layout .wizard-layout-vertical .step-item-vertical .step-circle-vertical{margin-left:16px}}\n"] }]
}], propDecorators: { stepsQuery: [{
type: ContentChildren,
args: [WizardStepComponent]
}], currentStepIndex: [{
type: Input
}], showCancelButton: [{
type: Input
}], alwaysShowBackButton: [{
type: Input
}], isFirstStepDisabled: [{
type: Input
}], isNextButtonDisabled: [{
type: Input
}], isFinishButtonDisabled: [{
type: Input
}], cancelText: [{
type: Input
}], backText: [{
type: Input
}], nextText: [{
type: Input
}], finishText: [{
type: Input
}], forceMobileMode: [{
type: Input
}], orientation: [{
type: Input
}], stepChange: [{
type: Output
}], wizardCancel: [{
type: Output
}], wizardComplete: [{
type: Output
}], onResize: [{
type: HostListener,
args: ['window:resize']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2l6YXJkLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NmYy1kcy9zcmMvbGliL2NvbXBvbmVudHMvd2l6YXJkL3dpemFyZC5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9jZmMtZHMvc3JjL2xpYi9jb21wb25lbnRzL3dpemFyZC93aXphcmQuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsc0JBQXNCO0FBQ3RCLDREQUE0RDtBQUM1RCxPQUFPLEVBQUUsU0FBUyxFQUFFLGVBQWUsRUFBYSxNQUFNLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxZQUFZLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDekgsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sb0NBQW9DLENBQUM7Ozs7QUFPekUsTUFBTSxPQUFPLGVBQWU7SUFDWSxVQUFVLENBQWtDO0lBQ2xGLEtBQUssR0FBMEIsRUFBRSxDQUFDO0lBRXpCLGdCQUFnQixHQUFHLENBQUMsQ0FBQztJQUNyQixnQkFBZ0IsR0FBRyxJQUFJLENBQUM7SUFDeEIsb0JBQW9CLEdBQUcsS0FBSyxDQUFDO0lBQzdCLG1CQUFtQixHQUFHLEtBQUssQ0FBQztJQUM1QixvQkFBb0IsR0FBRyxLQUFLLENBQUM7SUFDN0Isc0JBQXNCLEdBQUcsS0FBSyxDQUFDO0lBRS9CLFVBQVUsR0FBRyxVQUFVLENBQUM7SUFDeEIsUUFBUSxHQUFHLFFBQVEsQ0FBQztJQUNwQixRQUFRLEdBQUcsU0FBUyxDQUFDO0lBQ3JCLFVBQVUsR0FBRyxVQUFVLENBQUM7SUFFakMsNENBQTRDO0lBQ25DLGVBQWUsR0FBbUIsSUFBSSxDQUFDO0lBRWhELHlEQUF5RDtJQUNoRCxXQUFXLEdBQThCLFlBQVksQ0FBQztJQUUvRCwwREFBMEQ7SUFDMUQsWUFBWSxHQUFHLEtBQUssQ0FBQztJQUVYLFVBQVUsR0FBRyxJQUFJLFlB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LENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO1FBQzlDLENBQUM7SUFDSCxDQUFDO3dHQXhHVSxlQUFlOzRGQUFmLGVBQWUsOHBCQUNULG1CQUFtQiw2QkNYdEMsdTZQQXlMTTs7NEZEL0tPLGVBQWU7a0JBTDNCLFNBQVM7K0JBQ0UsWUFBWTs4QkFLZ0IsVUFBVTtzQkFBL0MsZUFBZTt1QkFBQyxtQkFBbUI7Z0JBRzNCLGdCQUFnQjtzQkFBeEIsS0FBSztnQkFDRyxnQkFBZ0I7c0JBQXhCLEtBQUs7Z0JBQ0csb0JBQW9CO3NCQUE1QixLQUFLO2dCQUNHLG1CQUFtQjtzQkFBM0IsS0FBSztnQkFDRyxvQkFBb0I7c0JBQTVCLEtBQUs7Z0JBQ0csc0JBQXNCO3NCQUE5QixLQUFLO2dCQUVHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLFVBQVU7c0JBQWxCLEtBQUs7Z0JBR0csZUFBZTtzQkFBdkIsS0FBSztnQkFHRyxXQUFXO3NCQUFuQixLQUFLO2dCQUtJLFVBQVU7c0JBQW5CLE1BQU07Z0JBQ0csWUFBWTtzQkFBckIsTUFBTTtnQkFDRyxjQUFjO3NCQUF2QixNQUFNO2dCQW9CUCxRQUFRO3NCQURQLFlBQVk7dUJBQUMsZUFBZSIsInNvdXJjZXNDb250ZW50IjpbIi8vIHdpemFyZC5jb21wb25lbnQudHNcclxuLy8gQWRpY2lvbmUgdW1hIG5vdmEgcHJvcHJpZWRhZGUgcGFyYSBjb250cm9sYXIgYSBvcmllbnRhw6fDo29cclxuaW1wb3J0IHsgQ29tcG9uZW50LCBDb250ZW50Q2hpbGRyZW4sIFF1ZXJ5TGlzdCwgT3V0cHV0LCBFdmVudEVtaXR0ZXIsIElucHV0LCBIb3N0TGlzdGVuZXIsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBXaXphcmRTdGVwQ29tcG9uZW50IH0gZnJvbSAnLi93aXphcmRTdGVwL3dpemFyZC1zdGVwLmNvbXBvbmVudCc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2NmYy13aXphcmQnLFxyXG4gIHRlbXBsYXRlVXJsOiAnLi93aXphcmQuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3dpemFyZC5jb21wb25lbnQuc2NzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBXaXphcmRDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xyXG4gIEBDb250ZW50Q2hpbGRyZW4oV2l6YXJkU3RlcENvbXBvbmVudCkgc3RlcHNRdWVyeSE6IFF1ZXJ5TGlzdDxXaXphcmRTdGVwQ29tcG9uZW50PjtcclxuICBzdGVwczogV2l6YXJkU3RlcENvbXBvbmVudFtdID0gW107XHJcbiAgXHJcbiAgQElucHV0KCkgY3VycmVudFN0ZXBJbmRleCA9IDA7XHJcbiAgQElucHV0KCkgc2hvd0NhbmNlbEJ1dHRvbiA9IHRydWU7XHJcbiAgQElucHV0KCkgYWx3YXlzU2hvd0JhY2tCdXR0b24gPSBmYWxzZTtcclxuICBASW5wdXQoKSBpc0ZpcnN0U3RlcERpc2FibGVkID0gZmFsc2U7XHJcbiAgQElucHV0KCkgaXNOZXh0QnV0dG9uRGlzYWJsZWQgPSBmYWxzZTtcclxuICBASW5wdXQoKSBpc0ZpbmlzaEJ1dHRvbkRpc2FibGVkID0gZmFsc2U7XHJcbiAgXHJcbiAgQElucHV0KCkgY2FuY2VsVGV4dCA9ICdDYW5jZWxhcic7XHJcbiAgQElucHV0KCkgYmFja1RleHQgPSAnVm9sdGFyJztcclxuICBASW5wdXQoKSBuZXh0VGV4dCA9ICdBdmFuw6dhcic7XHJcbiAgQElucHV0KCkgZmluaXNoVGV4dCA9ICdDb25jbHVpcic7XHJcbiAgXHJcbiAgLy8gTm92YSBwcm9wcmllZGFkZSBwYXJhIGZvcsOnYXIgbyBtb2RvIG3Ds3ZlbFxyXG4gIEBJbnB1dCgpIGZvcmNlTW9iaWxlTW9kZTogYm9vbGVhbiB8IG51bGwgPSBudWxsO1xyXG4gIFxyXG4gIC8vIE5vdmEgcHJvcHJpZWRhZGUgcGFyYSBjb250cm9sYXIgYSBvcmllbnRhw6fDo28gZG8gd2l6YXJkXHJcbiAgQElucHV0KCkgb3JpZW50YXRpb246ICdob3Jpem9udGFsJyB8ICd2ZXJ0aWNhbCcgPSAnaG9yaXpvbnRhbCc7XHJcbiAgXHJcbiAgLy8gUHJvcHJpZWRhZGUgcGFyYSBhcm1hemVuYXIgbyBlc3RhZG8gYXR1YWwgZG8gbW9kbyBtw7N2ZWxcclxuICBpc01vYmlsZVZpZXcgPSBmYWxzZTtcclxuICBcclxuICBAT3V0cHV0KCkgc3RlcENoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8bnVtYmVyPigpO1xyXG4gIEBPdXRwdXQoKSB3aXphcmRDYW5jZWwgPSBuZXcgRXZlbnRFbWl0dGVyPHZvaWQ+KCk7XHJcbiAgQE91dHB1dCgpIHdpemFyZENvbXBsZXRlID0gbmV3IEV2ZW50RW1pdHRlcjx2b2lkPigpO1xyXG5cclxuICBnZXQgaXNMYXN0U3RlcCgpOiBib29sZWFuIHtcclxuICAgIHJldHVybiB0aGlzLmN1cnJlbnRTdGVwSW5kZXggPT09IHRoaXMuc3RlcHMubGVuZ3RoIC0gMTtcclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCkge1xyXG4gICAgdGhpcy5jaGVja01vYmlsZVZpZXcoKTtcclxuICB9XHJcblxyXG4gIG5nQWZ0ZXJDb250ZW50SW5pdCgpIHtcclxuICAgIHRoaXMuc3RlcHNRdWVyeS5jaGFuZ2VzLnN1YnNjcmliZSgoKSA9PiB7XHJcbiAgICAgIHRoaXMudXBkYXRlU3RlcHMoKTtcclxuICAgIH0pO1xyXG4gICAgXHJcbiAgICB0aGlzLnVwZGF0ZVN0ZXBzKCk7XHJcbiAgfVxyXG5cclxuICAvLyBNw6l0b2RvIHBhcmEgZGV0ZWN0YXIgbW9kbyBtw7N2ZWwgcXVhbmRvIGEgamFuZWxhIMOpIHJlZGltZW5zaW9uYWRhXHJcbiAgQEhvc3RMaXN0ZW5lcignd2luZG93OnJlc2l6ZScpXHJcbiAgb25SZXNpemUoKSB7XHJcbiAgICB0aGlzLmNoZWNrTW9iaWxlVmlldygpO1xyXG4gIH1cclxuICBcclxuICAvLyBWZXJpZmljYSBzZSBkZXZlIHVzYXIgbyBtb2RvIG3Ds3ZlbFxyXG4gIGNoZWNrTW9iaWxlVmlldygpIHtcclxuICAgIC8vIFNlIGZvcmNlTW9iaWxlTW9kZSBmb3IgZm9ybmVjaWRvLCB1c2EgZXNzZSB2YWxvclxyXG4gICAgLy8gQ2FzbyBjb250csOhcmlvLCBmYXogZGV0ZWPDp8OjbyBhdXRvbcOhdGljYSBiYXNlYWRhIG5hIGxhcmd1cmEgZGEgdGVsYVxyXG4gICAgaWYgKHRoaXMuZm9yY2VNb2JpbGVNb2RlICE9PSBudWxsKSB7XHJcbiAgICAgIHRoaXMuaXNNb2JpbGVWaWV3ID0gdGhpcy5mb3JjZU1vYmlsZU1vZGU7XHJcbiAgICB9IGVsc2Uge1xyXG4gICAgICB0aGlzLmlzTW9iaWxlVmlldyA9IHdpbmRvdy5pbm5lcldpZHRoIDw9IDU3NjsgLy8gQnJlYWtwb2ludCBwYWRyw6NvIHBhcmEgbW9iaWxlXHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICB1cGRhdGVTdGVwcygpIHtcclxuICAgIHRoaXMuc3RlcHMgPSB0aGlzLnN0ZXBzUXVlcnkudG9BcnJheSgpO1xyXG4gICAgdGhpcy51cGRhdGVBY3RpdmVTdGVwKCk7XHJcbiAgfVxyXG5cclxuICBuZXh0KCkge1xyXG4gICAgaWYgKHRoaXMuY3VycmVudFN0ZXBJbmRleCA8IHRoaXMuc3RlcHMubGVuZ3RoIC0gMSkge1xyXG4gICAgICB0aGlzLmN1cnJlbnRTdGVwSW5kZXgrKztcclxuICAgICAgdGhpcy51cGRhdGVBY3RpdmVTdGVwKCk7XHJcbiAgICAgIHRoaXMuc3RlcENoYW5nZS5lbWl0KHRoaXMuY3VycmVudFN0ZXBJbmRleCk7XHJcbiAgICB9XHJcbiAgfVxyXG5cclxuICBwcmV2aW91cygpIHtcclxuICAgIGlmICh0aGlzLmN1cnJlbnRTdGVwSW5kZXggPiAwKSB7XHJcbiAgICAgIHRoaXMuY3VycmVudFN0ZXBJbmRleC0tO1xyXG4gICAgICB0aGlzLnVwZGF0ZUFjdGl2ZVN0ZXAoKTtcclxuICAgICAgdGhpcy5zdGVwQ2hhbmdlLmVtaXQodGhpcy5jdXJyZW50U3RlcEluZGV4KTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGZpbmlzaCgpIHtcclxuICAgIHRoaXMud2l6YXJkQ29tcGxldGUuZW1pdCgpO1xyXG4gIH1cclxuXHJcbiAgb25DYW5jZWwoKSB7XHJcbiAgICB0aGlzLndpemFyZENhbmNlbC5lbWl0KCk7XHJcbiAgfVxyXG5cclxuICB1cGRhdGVBY3RpdmVTdGVwKCkge1xyXG4gICAgdGhpcy5zdGVwcy5mb3JFYWNoKChzdGVwLCBpbmRleCkgPT4ge1xyXG4gICAgICBzdGVwLmlzQWN0aXZlID0gaW5kZXggPT09IHRoaXMuY3VycmVudFN0ZXBJbmRleDtcclxuICAgICAgc3RlcC5pc0NvbXBsZXRlZCA9IGluZGV4IDwgdGhpcy5jdXJyZW50U3RlcEluZGV4O1xyXG4gICAgfSk7XHJcbiAgfVxyXG5cclxuICBnb1RvU3RlcChpbmRleDogbnVtYmVyKSB7XHJcbiAgICBpZiAoaW5kZXggPj0gMCAmJiBpbmRleCA8IHRoaXMuc3RlcHMubGVuZ3RoKSB7XHJcbiAgICAgIHRoaXMuY3VycmVudFN0ZXBJbmRleCA9IGluZGV4O1xyXG4gICAgICB0aGlzLnVwZGF0ZUFjdGl2ZVN0ZXAoKTtcclxuICAgICAgdGhpcy5zdGVwQ2hhbmdlLmVtaXQodGhpcy5jdXJyZW50U3RlcEluZGV4KTtcclxuICAgIH1cclxuICB9XHJcbn0iLCI8IS0tIHdpemFyZC5jb21wb25lbnQuaHRtbCAtLT5cclxuPGRpdiBjbGFzcz1cIndpemFyZC1jb250YWluZXJcIiBcclxuICAgICBbbmdDbGFzc109XCJ7XHJcbiAgICAgICAnbW9iaWxlLXZpZXcnOiBpc01vYmlsZVZpZXcsXHJcbiAgICAgICAndmVydGljYWwtbGF5b3V0Jzogb3JpZW50YXRpb24gPT09ICd2ZXJ0aWNhbCdcclxuICAgICB9XCI+XHJcbiAgXHJcbiAgPCEtLSB3aXphcmQuY29tcG9uZW50Lmh0bWwgKHBhcnRlIGRvIGxheW91dCB2ZXJ0aWNhbCkgLS0+XHJcbiAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm9yaWVudGF0aW9uID09PSAndmVydGljYWwnXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwid2l6YXJkLWxheW91dC12ZXJ0aWNhbFwiPlxyXG4gICAgICA8IS0tIFBhaW5lbCB2ZXJ0aWNhbCBkZSBldGFwYXMgLS0+XHJcbiAgICAgIDxkaXYgY2xhc3M9XCJ3aXphcmQtc3RlcHMtcGFuZWwtdmVydGljYWxcIj5cclxuICAgICAgICA8ZGl2IGNsYXNzPVwic3RlcHMtY29udGFpbmVyLXZlcnRpY2FsXCI+XHJcbiAgICAgICAgICA8IS0tIExpbmhhIGNvbmVjdG9yYSBjb250w61udWEgcHJpbmNpcGFsIC0tPlxyXG4gICAgICAgICAgPGRpdiBjbGFzcz1cInZlcnRpY2FsLWNvbm5lY3Rvci1saW5lXCI+PC9kaXY+XHJcbiAgICAgICAgICBcclxuICAgICAgICAgIDxuZy1jb250YWluZXIgKm5nRm9yPVwibGV0IHN0ZXAgb2Ygc3RlcHM7IGxldCBpID0gaW5kZXg7IGxldCBsYXN0ID0gbGFzdFwiPlxyXG4gICAgICAgICAgICA8ZGl2IGNsYXNzPVwic3RlcC1pdGVtLXZlcnRpY2FsXCIgXHJcbiAgICAgICAgICAgICAgICBbY2xhc3MuYWN0aXZlXT1cImkgPT09IGN1cnJlbnRTdGVwSW5kZXhcIlxyXG4gICAgICAgICAgICAgICAgW2NsYXNzLmNvbXBsZXRlZF09XCJpIDwgY3VycmVudFN0ZXBJbmRleFwiXHJcbiAgICAgICAgICAgICAgICBbY2xhc3MuZGlzYWJsZWRdPVwiaSA+IGN1cnJlbnRTdGVwSW5kZXhcIlxyXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cImkgPD0gY3VycmVudFN0ZXBJbmRleCAmJiBnb1RvU3RlcChpKVwiPlxyXG4gICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzdGVwLWxhYmVsLXZlcnRpY2FsXCI+e3sgc3RlcC5sYWJlbCB9fTwvZGl2PlxyXG4gICAgICAgICAgICAgIDxkaXYgY2xhc3M9XCJzdGVwLWNpcmNsZS12ZXJ0aWNhbFwiPnt7IGkgKyAxIH19PC9kaXY+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgPC9uZy1jb250YWluZXI+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgIDwvZGl2PlxyXG5cclxuICAgICAgPCEtLSDDgXJlYSBkZSBjb250ZcO6ZG8gdmVydGljYWwgLS0+XHJcbiAgICAgIDxkaXYgY2xhc3M9XCJ3aXphcmQtY29udGVudC1hcmVhLXZlcnRpY2FsXCI+XHJcbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgc3RlcCBvZiBzdGVwczsgbGV0IGkgPSBpbmRleFwiPlxyXG4gICAgICAgICAgPGRpdiBjbGFzcz1cInN0ZXAtY29udGVudFwiIFtoaWRkZW5dPVwiaSAhPT0gY3VycmVudFN0ZXBJbmRleFwiPlxyXG4gICAgICAgICAgICA8bmctY29udGFpbmVyICpuZ1RlbXBsYXRlT3V0bGV0PVwic3RlcC5jb250ZW50VGVtcGxhdGVcIj48L25nLWNvbnRhaW5lcj5cclxuICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgIDwvbmctY29udGFpbmVyPlxyXG4gICAgICAgIFxyXG4gICAgICAgIDwhLS0gTmF2ZWdhw6fDo28gbmEgcGFydGUgaW5mZXJpb3IgLS0+XHJcbiAgICAgICAgPGRpdiBjbGFzcz1cIndpemFyZC1uYXZpZ2F0aW9uLWNvbnRhaW5lclwiPlxyXG4gICAgICAgICAgPGRpdiBjbGFzcz1cIndpemFyZC1uYXZpZ2F0aW9uLWNvbnRlbnRcIj5cclxuICAgICAgICAgICAgPCEtLSBDYW5jZWxhciAtLT5cclxuICAgICAgICAgICAgPGJ1dHRvbiBcclxuICAgICAgICAgICAgICBjbGFzcz1cIndpemFyZC1jYW5jZWwtYnV0dG9uXCIgXHJcbiAgICAgICAgICAgICAgKm5nSWY9XCJzaG93Q2FuY2VsQnV0dG9uXCIgXHJcbiAgICAgICAgICAgICAgKGNsaWNrKT1cIm9uQ2FuY2VsKClcIj5cclxuICAgICAgICAgICAgICB7eyBjYW5jZWxUZXh0IH19XHJcbiAgICAgICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICAgICAgICBcclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cIndpemFyZC1uYXZpZ2F0aW9uLWJ1dHRvbnNcIj5cclxuICAgICAgICAgICAgICA8YnV0dG9uIFxyXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJ3aXphcmQtYmFjay1idXR0b25cIlxyXG4gICAgICAgICAgICAgICAgW2Rpc2FibGVkXT1cImN1cnJlbnRTdGVwSW5kZXggPT09IDBcIlxyXG4gICAgICAgICAgICAgICAgKm5nSWY9XCJjdXJyZW50U3RlcEluZGV4ID4gMCB8fCBhbHdheXNTaG93QmFja0J1dHRvblwiXHJcbiAgICAgICAgICAgICAgICAoY2xpY2spPVwicHJldmlvdXMoKVwiPlxyXG4gICAgICAgICAgICAgICAge3sgYmFja1RleHQgfX1cclxuICAgICAgICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgICAgICAgICBcclxuICAgICAgICAgICAgICA8YnV0dG9uIFxyXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJ3aXphcmQtbmV4dC1idXR0b25cIlxyXG4gICAgICAgICAgICAgICAgW2Rpc2FibGVkXT1cImlzTmV4dEJ1dHRvbkRpc2FibGVkXCJcclxuICAgICAgICAgICAgICAgICpuZ0lmPVwiIWlzTGFzdFN0ZXBcIlxyXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cIm5leHQoKVwiPlxyXG4gICAgICAgICAgICAgICAge3sgbmV4dFRleHQgfX1cclxuICAgICAgICAgICAgICA8L2J1dHRvbj5cclxuICAgICAgICAgICAgICBcclxuICAgICAgICAgICAgICA8YnV0dG9uIFxyXG4gICAgICAgICAgICAgICAgY2xhc3M9XCJ3aXphcmQtZmluaXNoLWJ1dHRvblwiXHJcbiAgICAgICAgICAgICAgICBbZGlzYWJsZWRdPVwiaXNGaW5pc2hCdXR0b25EaXNhYmxlZFwiXHJcbiAgICAgICAgICAgICAgICAqbmdJZj1cImlzTGFzdFN0ZXBcIlxyXG4gICAgICAgICAgICAgICAgKGNsaWNrKT1cImZpbmlzaCgpXCI+XHJcbiAgICAgICAgICAgICAgICB7eyBmaW5pc2hUZXh0IH19XHJcbiAgICAgICAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgPC9kaXY+XHJcbiAgICAgIDwvZGl2PlxyXG4gICAgPC9kaXY+XHJcbiAgPC9uZy1jb250YWluZXI+XHJcbiAgXHJcbiAgPCEtLSBMYXlvdXQgaG9yaXpvbnRhbCAobWFudGlkbyBjb21vIGVzdGF2YSkgLS0+XHJcbiAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIm9yaWVudGF0aW9uID09PSAnaG9yaXpvbnRhbCdcIj5cclxuICAgIDwhLS0gUGFpbmVsIGRlIGV0YXBhcyAtLT5cclxuICAgIDxkaXYgY2xhc3M9XCJ3aXphcmQtc3RlcHMtcGFuZWxcIiBbbmdDbGFzc109XCJ7J2hpZGRlbi14cyc6IGlzTW9iaWxlVmlldyAmJiBzdGVwcy5sZW5ndGggPiA0fVwiPlxyXG4gICAgICA8ZGl2IGNsYXNzPVwic3RlcHMtY29udGFpbmVyXCI+XHJcbiAgICAgICAgPCEtLSBDb21wb25lbnRlIFN0ZXAgLS0+XHJcbiAgICAgICAgPG5nLWNvbnRhaW5lciAqbmdGb3I9XCJsZXQgc3RlcCBvZiBzdGVwczsgbGV0IGkgPSBpbmRleDsgbGV0IGxhc3QgPSBsYXN0XCI+XHJcbiAgICAgICAgICA8ZGl2IGNsYXNzPVwic3RlcC1pdGVtXCIgXHJcbiAgICAgICAgICAgICAgIFtjbGFzcy5hY3RpdmVdPVwiaSA9PT0gY3VycmVudFN0ZXBJbmRleFwiXHJcbiAgICAgICAgICAgICAgIFtjbGFzcy5jb21wbGV0ZWRdPVwiaSA8IGN1cnJlbnRTdGVwSW5kZXhcIlxyXG4gICAgICAgICAgICAgICBbY2xhc3MuZGlzYWJsZWRdPVwiaSA+IGN1cnJlbnRTdGVwSW5kZXhcIj5cclxuICAgICAgICAgICAgPGRpdiBjbGFzcz1cI