web: Flesh out a11y in wizard elements.

web/src/components/ak-wizard/WizardStep.ts

@@ -80,7 +80,7 @@ export abstract class WizardStep extends AKElement {
     ];
 
     @property({ type: Boolean, attribute: true, reflect: true })
-    enabled = false;
+    public enabled?: boolean;
 
     /**
      * The name. Should match the slot. Reflected if not present.
@@ -89,7 +89,7 @@ export abstract class WizardStep extends AKElement {
     name?: string;
 
     @consume({ context: wizardStepContext, subscribe: true })
-    wizardStepState: WizardStepState = { currentStep: undefined, stepLabels: [] };
+    protected wizardStepState: WizardStepState = { currentStep: undefined, stepLabels: [] };
 
     /**
      * What appears in the titlebar of the Wizard. Usually, but not necessarily, the same for all
@@ -263,7 +263,7 @@ export abstract class WizardStep extends AKElement {
             });
     }
 
-    renderHeaderCancelIcon() {
+    protected renderHeaderCancelIcon() {
         return html`<button
             class="pf-c-button pf-m-plain pf-c-wizard__close"
             type="button"

web/src/elements/wizard/Wizard.ts

@@ -40,13 +40,13 @@ export class Wizard extends ModalButton {
      * Whether the wizard can be cancelled.
      */
     @property({ type: Boolean })
-    canCancel = true;
+    public canCancel = true;
 
     /**
      * Whether the wizard can go back to the previous step.
      */
     @property({ type: Boolean })
-    canBack = true;
+    public canBack = true;
 
     /**
      * Header title of the wizard.
@@ -64,7 +64,7 @@ export class Wizard extends ModalButton {
      * Whether the wizard is valid and can proceed to the next step.
      */
     @property({ type: Boolean })
-    isValid = false;
+    public isValid?: boolean;
 
     /**
      * Actions to display at the end of the wizard.