@visa/nova-angular
Version:
Visa Product Design System Nova Angular library
124 lines • 12.6 kB
JavaScript
/**
* Copyright (c) 2025 Visa, Inc.
*
* Licensed under the Apache License, Version 2.0 (the "License");
* you may not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*
**/
import { coerceBooleanProperty } from '@angular/cdk/coercion';
import { Directive, Input, HostBinding, Optional, ContentChildren, QueryList, ChangeDetectorRef } from '@angular/core';
import { AccordionDetailsDirective } from '../accordion-item/accordion-item.directive';
import { ButtonDirective } from '../button/button.directive';
import * as i0 from "@angular/core";
import * as i1 from "../accordion-item/accordion-item.directive";
export class WizardStepDirective {
/**
* Provides custom class(es) for custom styling.
* @default .v-wizard-step
*/
get class() {
return [this._class, 'v-wizard-step'].join(' ');
}
set class(value) {
this._class = value;
}
get hostClass() {
return this.class;
}
constructor(accordion, cdRef) {
this.accordion = accordion;
this.cdRef = cdRef;
this._class = '';
this._active = false;
this._complete = false;
this._invalid = false;
}
/**
* Marks the step as current step when true.
* @default false
*/
get active() {
return this._active;
}
set active(value) {
this._active = coerceBooleanProperty(value);
}
get hostAriaCurrent() {
if (this.active) {
return 'step';
}
}
/**
* Marks the step as completed when true.
* @default false
*/
get complete() {
return this._complete;
}
set complete(value) {
this._complete = coerceBooleanProperty(value);
}
/**
* Marks the step as invalid when true.
* @default false
*/
get invalid() {
return this._invalid;
}
set invalid(value) {
this._invalid = coerceBooleanProperty(value);
}
ngAfterContentInit() {
if (this.accordion) {
this.active = this.accordion.expanded;
this.accordion.toggled.subscribe((expanded) => {
this.active = expanded;
});
}
if (this.buttons) {
this.buttons.forEach((button) => (button.class = [button.class, 'v-wizard-step'].join(' ')));
this.buttons.changes.subscribe(() => {
this.buttons.forEach((button) => (button.class = [button.class, 'v-wizard-step'].join(' ')));
this.cdRef.detectChanges();
});
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: WizardStepDirective, deps: [{ token: i1.AccordionDetailsDirective, optional: true }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: WizardStepDirective, isStandalone: true, selector: "[v-wizard-step] ", inputs: { class: "class", active: "active", complete: "complete", invalid: "invalid" }, host: { properties: { "class": "this.hostClass", "attr.aria-current": "this.hostAriaCurrent" } }, queries: [{ propertyName: "buttons", predicate: ButtonDirective }], ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: WizardStepDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[v-wizard-step] '
}]
}], ctorParameters: () => [{ type: i1.AccordionDetailsDirective, decorators: [{
type: Optional
}] }, { type: i0.ChangeDetectorRef }], propDecorators: { buttons: [{
type: ContentChildren,
args: [ButtonDirective]
}], class: [{
type: Input
}], hostClass: [{
type: HostBinding,
args: ['class']
}], active: [{
type: Input
}], hostAriaCurrent: [{
type: HostBinding,
args: ['attr.aria-current']
}], complete: [{
type: Input
}], invalid: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2l6YXJkLXN0ZXAuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9ub3ZhLWxpYi9zcmMvbGliL3dpemFyZC1zdGVwL3dpemFyZC1zdGVwLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7O0lBZUk7QUFDSixPQUFPLEVBQWdCLHFCQUFxQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDNUUsT0FBTyxFQUNMLFNBQVMsRUFDVCxLQUFLLEVBQ0wsV0FBVyxFQUNYLFFBQVEsRUFHUixlQUFlLEVBQ2YsU0FBUyxFQUNULGlCQUFpQixFQUNsQixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUseUJBQXlCLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUN2RixPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7OztBQU03RCxNQUFNLE9BQU8sbUJBQW1CO0lBRTlCOzs7T0FHRztJQUNILElBQ0ksS0FBSztRQUNQLE9BQU8sQ0FBQyxJQUFJLENBQUMsTUFBTSxFQUFFLGVBQWUsQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQztJQUNsRCxDQUFDO0lBQ0QsSUFBSSxLQUFLLENBQUMsS0FBYTtRQUNyQixJQUFJLENBQUMsTUFBTSxHQUFHLEtBQUssQ0FBQztJQUN0QixDQUFDO0lBRUQsSUFDSSxTQUFTO1FBQ1gsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDO0lBQ3BCLENBQUM7SUFFRCxZQUNzQixTQUFvQyxFQUNoRCxLQUF3QjtRQURaLGNBQVMsR0FBVCxTQUFTLENBQTJCO1FBQ2hELFVBQUssR0FBTCxLQUFLLENBQW1CO1FBUmxDLFdBQU0sR0FBVyxFQUFFLENBQUM7UUFzQnBCLFlBQU8sR0FBWSxLQUFLLENBQUM7UUFtQnpCLGNBQVMsR0FBWSxLQUFLLENBQUM7UUFhM0IsYUFBUSxHQUFZLEtBQUssQ0FBQztJQTdDdkIsQ0FBQztJQUVKOzs7T0FHRztJQUNILElBQ0ksTUFBTTtRQUNSLE9BQU8sSUFBSSxDQUFDLE9BQU8sQ0FBQztJQUN0QixDQUFDO0lBQ0QsSUFBSSxNQUFNLENBQUMsS0FBbUI7UUFDNUIsSUFBSSxDQUFDLE9BQU8sR0FBRyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUM5QyxDQUFDO0lBRUQsSUFDSSxlQUFlO1FBQ2pCLElBQUksSUFBSSxDQUFDLE1BQU0sRUFBRSxDQUFDO1lBQ2hCLE9BQU8sTUFBTSxDQUFDO1FBQ2hCLENBQUM7SUFDSCxDQUFDO0lBRUQ7OztPQUdHO0lBQ0gsSUFDSSxRQUFRO1FBQ1YsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDO0lBQ3hCLENBQUM7SUFDRCxJQUFJLFFBQVEsQ0FBQyxLQUFtQjtRQUM5QixJQUFJLENBQUMsU0FBUyxHQUFHLHFCQUFxQixDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ2hELENBQUM7SUFHRDs7O09BR0c7SUFDSCxJQUNJLE9BQU87UUFDVCxPQUFPLElBQUksQ0FBQyxRQUFRLENBQUM7SUFDdkIsQ0FBQztJQUNELElBQUksT0FBTyxDQUFDLEtBQW1CO1FBQzdCLElBQUksQ0FBQyxRQUFRLEdBQUcscUJBQXFCLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDL0MsQ0FBQztJQUdELGtCQUFrQjtRQUNoQixJQUFJLElBQUksQ0FBQyxTQUFTLEVBQUUsQ0FBQztZQUNuQixJQUFJLENBQUMsTUFBTSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsUUFBUSxDQUFDO1lBRXRDLElBQUksQ0FBQyxTQUFTLENBQUMsT0FBTyxDQUFDLFNBQVMsQ0FBQyxDQUFDLFFBQVEsRUFBRSxFQUFFO2dCQUM1QyxJQUFJLENBQUMsTUFBTSxHQUFHLFFBQVEsQ0FBQztZQUN6QixDQUFDLENBQUMsQ0FBQztRQUNMLENBQUM7UUFFRCxJQUFJLElBQUksQ0FBQyxPQUFPLEVBQUUsQ0FBQztZQUNqQixJQUFJLENBQUMsT0FBTyxDQUFDLE9BQU8sQ0FBQyxDQUFDLE1BQU0sRUFBRSxFQUFFLENBQUMsQ0FBQyxNQUFNLENBQUMsS0FBSyxHQUFHLENBQUMsTUFBTSxDQUFDLEtBQUssRUFBRSxlQUFlLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUMsQ0FBQyxDQUFDO1lBRTdGLElBQUksQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLFNBQVMsQ0FBQyxHQUFHLEVBQUU7Z0JBQ2xDLElBQUksQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUMsTUFBTSxFQUFFLEVBQUUsQ0FBQyxDQUFDLE1BQU0sQ0FBQyxLQUFLLEdBQUcsQ0FBQyxNQUFNLENBQUMsS0FBSyxFQUFFLGVBQWUsQ0FBQyxDQUFDLElBQUksQ0FBQyxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUM7Z0JBQzdGLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxFQUFFLENBQUM7WUFDN0IsQ0FBQyxDQUFDLENBQUM7UUFDTCxDQUFDO0lBQ0gsQ0FBQzsrR0F0RlUsbUJBQW1CO21HQUFuQixtQkFBbUIsOFJBQ2IsZUFBZTs7NEZBRHJCLG1CQUFtQjtrQkFKL0IsU0FBUzttQkFBQztvQkFDVCxVQUFVLEVBQUUsSUFBSTtvQkFDaEIsUUFBUSxFQUFFLGtCQUFrQjtpQkFDN0I7OzBCQXFCSSxRQUFRO3lFQW5CdUIsT0FBTztzQkFBeEMsZUFBZTt1QkFBQyxlQUFlO2dCQU01QixLQUFLO3NCQURSLEtBQUs7Z0JBU0YsU0FBUztzQkFEWixXQUFXO3VCQUFDLE9BQU87Z0JBZWhCLE1BQU07c0JBRFQsS0FBSztnQkFTRixlQUFlO3NCQURsQixXQUFXO3VCQUFDLG1CQUFtQjtnQkFZNUIsUUFBUTtzQkFEWCxLQUFLO2dCQWNGLE9BQU87c0JBRFYsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogICAgICAgICAgICAgIENvcHlyaWdodCAoYykgMjAyNSBWaXNhLCBJbmMuXG4gKlxuICogTGljZW5zZWQgdW5kZXIgdGhlIEFwYWNoZSBMaWNlbnNlLCBWZXJzaW9uIDIuMCAodGhlIFwiTGljZW5zZVwiKTtcbiAqIHlvdSBtYXkgbm90IHVzZSB0aGlzIGZpbGUgZXhjZXB0IGluIGNvbXBsaWFuY2Ugd2l0aCB0aGUgTGljZW5zZS5cbiAqIFlvdSBtYXkgb2J0YWluIGEgY29weSBvZiB0aGUgTGljZW5zZSBhdFxuICpcbiAqICAgICAgICAgaHR0cDovL3d3dy5hcGFjaGUub3JnL2xpY2Vuc2VzL0xJQ0VOU0UtMi4wXG4gKlxuICogVW5sZXNzIHJlcXVpcmVkIGJ5IGFwcGxpY2FibGUgbGF3IG9yIGFncmVlZCB0byBpbiB3cml0aW5nLCBzb2Z0d2FyZVxuICogZGlzdHJpYnV0ZWQgdW5kZXIgdGhlIExpY2Vuc2UgaXMgZGlzdHJpYnV0ZWQgb24gYW4gXCJBUyBJU1wiIEJBU0lTLFxuICogV0lUSE9VVCBXQVJSQU5USUVTIE9SIENPTkRJVElPTlMgT0YgQU5ZIEtJTkQsIGVpdGhlciBleHByZXNzIG9yIGltcGxpZWQuXG4gKiBTZWUgdGhlIExpY2Vuc2UgZm9yIHRoZSBzcGVjaWZpYyBsYW5ndWFnZSBnb3Zlcm5pbmcgcGVybWlzc2lvbnMgYW5kXG4gKiBsaW1pdGF0aW9ucyB1bmRlciB0aGUgTGljZW5zZS5cbiAqXG4gKiovXG5pbXBvcnQgeyBCb29sZWFuSW5wdXQsIGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9jb2VyY2lvbic7XG5pbXBvcnQge1xuICBEaXJlY3RpdmUsXG4gIElucHV0LFxuICBIb3N0QmluZGluZyxcbiAgT3B0aW9uYWwsXG4gIEFmdGVyQ29udGVudEluaXQsXG4gIENvbnRlbnRDaGlsZCxcbiAgQ29udGVudENoaWxkcmVuLFxuICBRdWVyeUxpc3QsXG4gIENoYW5nZURldGVjdG9yUmVmXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQWNjb3JkaW9uRGV0YWlsc0RpcmVjdGl2ZSB9IGZyb20gJy4uL2FjY29yZGlvbi1pdGVtL2FjY29yZGlvbi1pdGVtLmRpcmVjdGl2ZSc7XG5pbXBvcnQgeyBCdXR0b25EaXJlY3RpdmUgfSBmcm9tICcuLi9idXR0b24vYnV0dG9uLmRpcmVjdGl2ZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzdGFuZGFsb25lOiB0cnVlLFxuICBzZWxlY3RvcjogJ1t2LXdpemFyZC1zdGVwXSAnXG59KVxuZXhwb3J0IGNsYXNzIFdpemFyZFN0ZXBEaXJlY3RpdmUgaW1wbGVtZW50cyBBZnRlckNvbnRlbnRJbml0IHtcbiAgQENvbnRlbnRDaGlsZHJlbihCdXR0b25EaXJlY3RpdmUpIGJ1dHRvbnM6IFF1ZXJ5TGlzdDxCdXR0b25EaXJlY3RpdmU+O1xuICAvKipcbiAgICogUHJvdmlkZXMgY3VzdG9tIGNsYXNzJiM0MDtlcyYjNDE7IGZvciBjdXN0b20gc3R5bGluZy5cbiAgICogQGRlZmF1bHQgLnYtd2l6YXJkLXN0ZXBcbiAgICovXG4gIEBJbnB1dCgpXG4gIGdldCBjbGFzcygpOiBzdHJpbmcge1xuICAgIHJldHVybiBbdGhpcy5fY2xhc3MsICd2LXdpemFyZC1zdGVwJ10uam9pbignICcpO1xuICB9XG4gIHNldCBjbGFzcyh2YWx1ZTogc3RyaW5nKSB7XG4gICAgdGhpcy5fY2xhc3MgPSB2YWx1ZTtcbiAgfVxuICBfY2xhc3M6IHN0cmluZyA9ICcnO1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzJylcbiAgZ2V0IGhvc3RDbGFzcygpOiBzdHJpbmcge1xuICAgIHJldHVybiB0aGlzLmNsYXNzO1xuICB9XG5cbiAgY29uc3RydWN0b3IoXG4gICAgQE9wdGlvbmFsKCkgcHJpdmF0ZSBhY2NvcmRpb246IEFjY29yZGlvbkRldGFpbHNEaXJlY3RpdmUsXG4gICAgcHJpdmF0ZSBjZFJlZjogQ2hhbmdlRGV0ZWN0b3JSZWZcbiAgKSB7fVxuXG4gIC8qKlxuICAgKiBNYXJrcyB0aGUgc3RlcCBhcyBjdXJyZW50IHN0ZXAgd2hlbiB0cnVlLlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgQElucHV0KClcbiAgZ2V0IGFjdGl2ZSgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5fYWN0aXZlO1xuICB9XG4gIHNldCBhY3RpdmUodmFsdWU6IEJvb2xlYW5JbnB1dCkge1xuICAgIHRoaXMuX2FjdGl2ZSA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSh2YWx1ZSk7XG4gIH1cbiAgX2FjdGl2ZTogYm9vbGVhbiA9IGZhbHNlO1xuICBASG9zdEJpbmRpbmcoJ2F0dHIuYXJpYS1jdXJyZW50JylcbiAgZ2V0IGhvc3RBcmlhQ3VycmVudCgpOiBzdHJpbmcgfCB2b2lkIHtcbiAgICBpZiAodGhpcy5hY3RpdmUpIHtcbiAgICAgIHJldHVybiAnc3RlcCc7XG4gICAgfVxuICB9XG5cbiAgLyoqXG4gICAqIE1hcmtzIHRoZSBzdGVwIGFzIGNvbXBsZXRlZCB3aGVuIHRydWUuXG4gICAqIEBkZWZhdWx0IGZhbHNlXG4gICAqL1xuICBASW5wdXQoKVxuICBnZXQgY29tcGxldGUoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuX2NvbXBsZXRlO1xuICB9XG4gIHNldCBjb21wbGV0ZSh2YWx1ZTogQm9vbGVhbklucHV0KSB7XG4gICAgdGhpcy5fY29tcGxldGUgPSBjb2VyY2VCb29sZWFuUHJvcGVydHkodmFsdWUpO1xuICB9XG4gIF9jb21wbGV0ZTogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIC8qKlxuICAgKiBNYXJrcyB0aGUgc3RlcCBhcyBpbnZhbGlkIHdoZW4gdHJ1ZS5cbiAgICogQGRlZmF1bHQgZmFsc2VcbiAgICovXG4gIEBJbnB1dCgpXG4gIGdldCBpbnZhbGlkKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiB0aGlzLl9pbnZhbGlkO1xuICB9XG4gIHNldCBpbnZhbGlkKHZhbHVlOiBCb29sZWFuSW5wdXQpIHtcbiAgICB0aGlzLl9pbnZhbGlkID0gY29lcmNlQm9vbGVhblByb3BlcnR5KHZhbHVlKTtcbiAgfVxuICBfaW52YWxpZDogYm9vbGVhbiA9IGZhbHNlO1xuXG4gIG5nQWZ0ZXJDb250ZW50SW5pdCgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5hY2NvcmRpb24pIHtcbiAgICAgIHRoaXMuYWN0aXZlID0gdGhpcy5hY2NvcmRpb24uZXhwYW5kZWQ7XG5cbiAgICAgIHRoaXMuYWNjb3JkaW9uLnRvZ2dsZWQuc3Vic2NyaWJlKChleHBhbmRlZCkgPT4ge1xuICAgICAgICB0aGlzLmFjdGl2ZSA9IGV4cGFuZGVkO1xuICAgICAgfSk7XG4gICAgfVxuXG4gICAgaWYgKHRoaXMuYnV0dG9ucykge1xuICAgICAgdGhpcy5idXR0b25zLmZvckVhY2goKGJ1dHRvbikgPT4gKGJ1dHRvbi5jbGFzcyA9IFtidXR0b24uY2xhc3MsICd2LXdpemFyZC1zdGVwJ10uam9pbignICcpKSk7XG5cbiAgICAgIHRoaXMuYnV0dG9ucy5jaGFuZ2VzLnN1YnNjcmliZSgoKSA9PiB7XG4gICAgICAgIHRoaXMuYnV0dG9ucy5mb3JFYWNoKChidXR0b24pID0+IChidXR0b24uY2xhc3MgPSBbYnV0dG9uLmNsYXNzLCAndi13aXphcmQtc3RlcCddLmpvaW4oJyAnKSkpO1xuICAgICAgICB0aGlzLmNkUmVmLmRldGVjdENoYW5nZXMoKTtcbiAgICAgIH0pO1xuICAgIH1cbiAgfVxufVxuIl19