@govbr-ds/webcomponents 2.0.0-next.62 → 2.0.0-next.64

package/dist/collection/components/wizard/wizard.js

@@ -2,7 +2,6 @@
  * Construído por SERPRO
  * © https://serpro.gov.br/ - MIT License.
  */
-import { __awaiter } from "tslib";
 import { h, Host, } from "@stencil/core";
 import Helpers from "../../utils/helpers";
 import { UniversalSwipe } from "../../utils/swipe";
@@ -126,7 +125,7 @@ export class Wizard {
          * Se for a última etapa, valida e emite evento de conclusão.
          * Caso contrário, avança para a próxima etapa.
          */
-        this.handleNext = () => __awaiter(this, void 0, void 0, function* () {
+        this.handleNext = async () => {
             if (this.currentStep === this.panels.length) {
                 // Última etapa: validar antes de completar
                 const eventResult = this.brWizardBeforeStepChange.emit(this.currentStep);
@@ -136,16 +135,16 @@ export class Wizard {
                 }
             }
             else {
-                yield this.nextStep();
+                await this.nextStep();
             }
-        });
+        };
         /**
          * Handler do botão "Voltar".
          * Navega para a etapa anterior.
          */
-        this.handlePrevious = () => __awaiter(this, void 0, void 0, function* () {
-            yield this.previousStep();
-        });
+        this.handlePrevious = async () => {
+            await this.previousStep();
+        };
         /**
          * Handler do botão "Cancelar".
          * Emite evento de cancelamento do wizard.
@@ -168,12 +167,10 @@ export class Wizard {
      * Observa mudanças na etapa inicial.
      * Reinicializa o wizard quando a prop initialStep é alterada externamente.
      */
-    handleInitialStepChange() {
-        return __awaiter(this, void 0, void 0, function* () {
-            this.setInitialStep();
-            yield this.syncWithBrStep();
-            this.updatePanels();
-        });
+    async handleInitialStepChange() {
+        this.setInitialStep();
+        await this.syncWithBrStep();
+        this.updatePanels();
     }
     /**
      * Observa mudanças na etapa atual (fonte única de verdade).
@@ -181,15 +178,13 @@ export class Wizard {
      * @param newStep - Nova etapa
      * @param oldStep - Etapa anterior
      */
-    handleCurrentStepChange(newStep, oldStep) {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (newStep !== oldStep) {
-                yield this.syncWithBrStep();
-                this.updatePanels();
-                this.announceStepChange(newStep, oldStep);
-                this.setFocusOnActivePanel();
-            }
-        });
+    async handleCurrentStepChange(newStep, oldStep) {
+        if (newStep !== oldStep) {
+            await this.syncWithBrStep();
+            this.updatePanels();
+            this.announceStepChange(newStep, oldStep);
+            this.setFocusOnActivePanel();
+        }
     }
     // ========================================
     // LISTENERS
@@ -199,31 +194,27 @@ export class Wizard {
      * Redescobre os painéis e ressincroniza o estado.
      * @param event - Evento slotchange
      */
-    handleSlotChange(event) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const slot = event.target;
-            this.discoverPanelsFromSlot(slot);
-            yield this.syncWithBrStep();
-            this.updatePanels();
-        });
+    async handleSlotChange(event) {
+        const slot = event.target;
+        this.discoverPanelsFromSlot(slot);
+        await this.syncWithBrStep();
+        this.updatePanels();
     }
     /**
      * Detecta quando o br-step muda de etapa ativa.
      * Valida e sincroniza a navegação com o componente interno br-step.
      * @param event - Evento customizado do br-step
      */
-    handleStepChange(event) {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this.isSyncingWithStep) {
-                return;
-            }
-            const requestedStep = event.detail.activeStep + 1;
-            const success = yield this.navigateToStep(requestedStep);
-            if (!success) {
-                event.stopPropagation();
-                yield this.syncWithBrStep();
-            }
-        });
+    async handleStepChange(event) {
+        if (this.isSyncingWithStep) {
+            return;
+        }
+        const requestedStep = event.detail.activeStep + 1;
+        const success = await this.navigateToStep(requestedStep);
+        if (!success) {
+            event.stopPropagation();
+            await this.syncWithBrStep();
+        }
     }
     // ========================================
     // LIFECYCLE HOOKS
@@ -239,24 +230,22 @@ export class Wizard {
      * Lifecycle: carrega painéis e configura estado inicial.
      * Sincroniza com br-step, atualiza painéis e configura detecção mobile.
      */
-    componentDidLoad() {
-        return __awaiter(this, void 0, void 0, function* () {
-            var _a;
-            const slot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
-            if (slot !== null && typeof slot !== 'undefined') {
-                const assignedElements = slot.assignedElements();
-                const slotPanels = assignedElements.filter((el) => el.tagName.toLowerCase() === 'br-wizard-panel');
-                if (slotPanels.length !== this.panels.length) {
-                    this.panels = slotPanels;
-                }
-            }
-            yield this.syncWithBrStep();
-            this.updatePanels();
-            this.setupMobileDetection();
-            if (this.isMobile) {
-                this.collapsed = true;
+    async componentDidLoad() {
+        var _a;
+        const slot = (_a = this.el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot');
+        if (slot !== null && typeof slot !== 'undefined') {
+            const assignedElements = slot.assignedElements();
+            const slotPanels = assignedElements.filter((el) => el.tagName.toLowerCase() === 'br-wizard-panel');
+            if (slotPanels.length !== this.panels.length) {
+                this.panels = slotPanels;
             }
-        });
+        }
+        await this.syncWithBrStep();
+        this.updatePanels();
+        this.setupMobileDetection();
+        if (this.isMobile) {
+            this.collapsed = true;
+        }
     }
     /**
      * Lifecycle: limpa listeners quando componente é removido.
@@ -274,20 +263,16 @@ export class Wizard {
      * Executa validação via evento `brWizardBeforeStepChange` antes de navegar.
      * @returns Promise<boolean> - true se navegou com sucesso, false se bloqueado
      */
-    nextStep() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return yield this.navigateToStep(this.currentStep + 1);
-        });
+    async nextStep() {
+        return await this.navigateToStep(this.currentStep + 1);
     }
     /**
      * Volta para a etapa anterior.
      * Não executa validação ao retornar.
      * @returns Promise<boolean> - true se navegou com sucesso, false se bloqueado
      */
-    previousStep() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return yield this.navigateToStep(this.currentStep - 1);
-        });
+    async previousStep() {
+        return await this.navigateToStep(this.currentStep - 1);
     }
     /**
      * Navega para uma etapa específica.
@@ -295,67 +280,53 @@ export class Wizard {
      * @param stepNumber - Número da etapa de destino (numeração começa em 1)
      * @returns Promise<boolean> - true se navegou com sucesso, false se bloqueado
      */
-    goToStep(stepNumber) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return yield this.navigateToStep(stepNumber);
-        });
+    async goToStep(stepNumber) {
+        return await this.navigateToStep(stepNumber);
     }
     /**
      * Retorna à primeira etapa do wizard.
      * Não executa validação (útil para reiniciar o fluxo).
      * @returns Promise<void>
      */
-    reset() {
-        return __awaiter(this, void 0, void 0, function* () {
-            yield this.navigateToStep(1, true);
-        });
+    async reset() {
+        await this.navigateToStep(1, true);
     }
     /**
      * Retorna o elemento HTML do painel ativo no momento.
      * @returns Promise<HTMLElement | null>
      */
-    getCurrentStep() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.panels[this.currentStep - 1] || null;
-        });
+    async getCurrentStep() {
+        return this.panels[this.currentStep - 1] || null;
     }
     /**
      * Retorna todos os painéis do wizard.
      * @returns Promise<HTMLElement[]>
      */
-    getAllSteps() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return [...this.panels];
-        });
+    async getAllSteps() {
+        return [...this.panels];
     }
     /**
      * Retorna um painel específico pelo índice.
      * @param stepNumber - Número da etapa (numeração começa em 1)
      * @returns Promise<HTMLElement | null>
      */
-    getStepByIndex(stepNumber) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.panels[stepNumber - 1] || null;
-        });
+    async getStepByIndex(stepNumber) {
+        return this.panels[stepNumber - 1] || null;
     }
     /**
      * Retorna o índice (número) da etapa atual.
      * A numeração começa em 1 (primeira etapa = 1, segunda = 2, etc).
      * @returns Promise<number>
      */
-    getCurrentStepIndex() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.currentStep;
-        });
+    async getCurrentStepIndex() {
+        return this.currentStep;
     }
     /**
      * Retorna o número total de etapas do wizard.
      * @returns Promise<number>
      */
-    getTotalSteps() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.panels.length;
-        });
+    async getTotalSteps() {
+        return this.panels.length;
     }
     // ========================================
     // NAVEGAÇÃO E VALIDAÇÃO
@@ -371,64 +342,62 @@ export class Wizard {
      * @param skipValidation - Se true, pula validação (útil para reset/programático)
      * @returns Promise<boolean> - true se navegou com sucesso, false se bloqueado
      */
-    navigateToStep(targetStep_1) {
-        return __awaiter(this, arguments, void 0, function* (targetStep, skipValidation = false) {
-            /**
-             * VALIDAÇÕES BÁSICAS
-             * 1. Verifica se targetStep está dentro dos limites válidos
-             * 2. Se já estamos na etapa alvo, retorna sucesso imediatamente
-             */
-            if (targetStep < 1 || targetStep > this.panels.length) {
+    async navigateToStep(targetStep, skipValidation = false) {
+        /**
+         * VALIDAÇÕES BÁSICAS
+         * 1. Verifica se targetStep está dentro dos limites válidos
+         * 2. Se já estamos na etapa alvo, retorna sucesso imediatamente
+         */
+        if (targetStep < 1 || targetStep > this.panels.length) {
+            return false;
+        }
+        if (targetStep === this.currentStep) {
+            return true;
+        }
+        /**
+         * MODO LINEAR: RESTRIÇÕES
+         * No modo linear, não é permitido pular para etapas futuras não visitadas.
+         * É possível voltar, mas não avançar além da próxima etapa sequencial.
+         */
+        if (this.progressionType === 'linear') {
+            if (targetStep > this.currentStep + 1) {
+                const message = `Não é possível pular etapas. Complete a etapa ${this.currentStep + 1} antes de avançar.`;
+                this.announceToScreenReader(message);
+                this.brWizardNavigationBlocked.emit('linear-progression');
                 return false;
             }
-            if (targetStep === this.currentStep) {
-                return true;
-            }
-            /**
-             * MODO LINEAR: RESTRIÇÕES
-             * No modo linear, não é permitido pular para etapas futuras não visitadas.
-             * É possível voltar, mas não avançar além da próxima etapa sequencial.
-             */
-            if (this.progressionType === 'linear') {
-                if (targetStep > this.currentStep + 1) {
-                    const message = `Não é possível pular etapas. Complete a etapa ${this.currentStep + 1} antes de avançar.`;
-                    this.announceToScreenReader(message);
-                    this.brWizardNavigationBlocked.emit('linear-progression');
-                    return false;
-                }
-            }
+        }
+        /**
+         * VALIDAÇÃO CUSTOMIZADA
+         * Emite evento brWizardBeforeStepChange APENAS se:
+         * 1. Não estamos pulando validação (skipValidation=false)
+         * 2. Estamos AVANÇANDO (targetStep > currentStep)
+         *
+         * Observações:
+         * - Voltar não precisa validar
+         * - Validação se aplica a ambos os modos (linear e nonlinear)
+         */
+        const shouldValidate = !skipValidation && targetStep > this.currentStep;
+        if (shouldValidate) {
+            const eventResult = this.brWizardBeforeStepChange.emit(targetStep);
             /**
-             * VALIDAÇÃO CUSTOMIZADA
-             * Emite evento brWizardBeforeStepChange APENAS se:
-             * 1. Não estamos pulando validação (skipValidation=false)
-             * 2. Estamos AVANÇANDO (targetStep > currentStep)
-             *
-             * Observações:
-             * - Voltar não precisa validar
-             * - Validação se aplica a ambos os modos (linear e nonlinear)
+             * Se preventDefault() foi chamado no listener do evento,
+             * bloqueia a navegação e retorna false
              */
-            const shouldValidate = !skipValidation && targetStep > this.currentStep;
-            if (shouldValidate) {
-                const eventResult = this.brWizardBeforeStepChange.emit(targetStep);
-                /**
-                 * Se preventDefault() foi chamado no listener do evento,
-                 * bloqueia a navegação e retorna false
-                 */
-                if (eventResult.defaultPrevented) {
-                    const message = 'Não é possível avançar. Verifique os campos obrigatórios da etapa atual.';
-                    this.announceToScreenReader(message);
-                    this.brWizardNavigationBlocked.emit('validation-failed');
-                    return false;
-                }
+            if (eventResult.defaultPrevented) {
+                const message = 'Não é possível avançar. Verifique os campos obrigatórios da etapa atual.';
+                this.announceToScreenReader(message);
+                this.brWizardNavigationBlocked.emit('validation-failed');
+                return false;
             }
-            /**
-             * EXECUTA NAVEGAÇÃO
-             * Atualiza o estado interno e emite evento de confirmação
-             */
-            this.currentStep = targetStep;
-            this.brWizardStepChange.emit(this.currentStep);
-            return true;
-        });
+        }
+        /**
+         * EXECUTA NAVEGAÇÃO
+         * Atualiza o estado interno e emite evento de confirmação
+         */
+        this.currentStep = targetStep;
+        this.brWizardStepChange.emit(this.currentStep);
+        return true;
     }
     // ========================================
     // SINCRONIZAÇÃO COM BR-STEP
@@ -439,35 +408,33 @@ export class Wizard {
      * O br-step já gerencia completamente os atributos 'active' via componentShouldUpdate
      * e requestAnimationFrame, então apenas chamamos os métodos de navegação dele.
      */
-    syncWithBrStep() {
-        return __awaiter(this, void 0, void 0, function* () {
-            if (this.stepRef === null)
-                return;
-            if (typeof this.stepRef.GetActiveStep !== 'function') {
-                return;
-            }
-            this.isSyncingWithStep = true;
-            try {
-                const targetStepIndex = this.currentStep - 1;
-                const currentActiveStep = yield this.stepRef.GetActiveStep();
-                if (currentActiveStep !== targetStepIndex) {
-                    const diff = targetStepIndex - currentActiveStep;
-                    if (diff > 0) {
-                        for (let i = 0; i < diff; i++) {
-                            yield this.stepRef.ProceedToNextStep();
-                        }
+    async syncWithBrStep() {
+        if (this.stepRef === null)
+            return;
+        if (typeof this.stepRef.GetActiveStep !== 'function') {
+            return;
+        }
+        this.isSyncingWithStep = true;
+        try {
+            const targetStepIndex = this.currentStep - 1;
+            const currentActiveStep = await this.stepRef.GetActiveStep();
+            if (currentActiveStep !== targetStepIndex) {
+                const diff = targetStepIndex - currentActiveStep;
+                if (diff > 0) {
+                    for (let i = 0; i < diff; i++) {
+                        await this.stepRef.ProceedToNextStep();
                     }
-                    else {
-                        for (let i = 0; i < Math.abs(diff); i++) {
-                            yield this.stepRef.BackToPreviousStep();
-                        }
+                }
+                else {
+                    for (let i = 0; i < Math.abs(diff); i++) {
+                        await this.stepRef.BackToPreviousStep();
                     }
                 }
             }
-            finally {
-                this.isSyncingWithStep = false;
-            }
-        });
+        }
+        finally {
+            this.isSyncingWithStep = false;
+        }
     }
     // ========================================
     // GERENCIAMENTO DE PAINÉIS
@@ -484,16 +451,14 @@ export class Wizard {
      * Atualiza estados de todos os painéis.
      * Define o índice e o estado ativo de cada painel.
      */
-    updatePanels() {
-        return __awaiter(this, void 0, void 0, function* () {
-            for (let idx = 0; idx < this.panels.length; idx++) {
-                const panel = this.panels[idx];
-                const stepNumber = idx + 1;
-                const isActive = stepNumber === this.currentStep;
-                yield panel.setIndex(stepNumber);
-                yield panel.setActive(isActive);
-            }
-        });
+    async updatePanels() {
+        for (let idx = 0; idx < this.panels.length; idx++) {
+            const panel = this.panels[idx];
+            const stepNumber = idx + 1;
+            const isActive = stepNumber === this.currentStep;
+            await panel.setIndex(stepNumber);
+            await panel.setActive(isActive);
+        }
     }
     /**
      * Define etapa inicial baseada na prop initialStep.