@visa/nova-angular
Version:
Visa Product Design System Nova Angular library
99 lines • 10.2 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 { Directive, HostBinding, Input } from '@angular/core';
import { IconComponent } from '../icon/icon.component';
import { IconToggle } from '../icon/icon.constants';
import * as i0 from "@angular/core";
import * as i1 from "../icon/icon.component";
export class IconToggleDirective {
/**
* Provides custom class(es) for custom styling.
* @default .v-accordion-toggle-icon
*/
get class() {
return [this._class].join(' ');
}
set class(value) {
this._class = value;
}
get hostClass() {
return this.class;
}
/**
* Icon to show when item is expanded / shown. <br>
* Will render this icon when no <code>icon</code> or <code>customIcon</code> is provided to <code>v-icon</code>. <br>
* Should refer to an icon in VPDS' [Icon Library](https://design.visa.com/icons).
* @default 'chevron-down' / IconToggle.EXPANDED <br>
* @builtin true
*/
get expandedIcon() {
return this._expandedIcon;
}
set expandedIcon(value) {
this._expandedIcon = value;
this._expandedSet = true;
}
/**
* Icon to show when item is collapsed / hidden. <br>
* Will render this icon when no <code>icon</code> or <code>customIcon</code> is provided to <code>v-icon</code>. <br>
* Should refer to an icon in VPDS' [Icon Library](https://design.visa.com/icons).
* @default 'chevron-right' / IconToggle.COLLAPSED <br>
* @builtin true
*/
get collapsedIcon() {
return this._collapsedIcon;
}
set collapsedIcon(value) {
this._collapsedIcon = value;
this._collapsedSet = true;
}
constructor(icon) {
this.icon = icon;
this._expanded = false;
this._iconSet = false;
this._expandedSet = false;
this._collapsedSet = false;
this._class = '';
this._expandedIcon = IconToggle.EXPANDED;
this._collapsedIcon = IconToggle.COLLAPSED;
} // used in floating-ui or accordion service
ngOnInit() {
if (this.icon && (this.icon.icon || this.icon.customIcon)) {
this._iconSet = true;
}
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: IconToggleDirective, deps: [{ token: i1.IconComponent }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: IconToggleDirective, isStandalone: true, selector: "[v-icon-toggle]", inputs: { class: "class", expandedIcon: "expandedIcon", collapsedIcon: "collapsedIcon" }, host: { properties: { "class": "this.hostClass" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: IconToggleDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
// tslint:disable-next-line:directive-selector
selector: '[v-icon-toggle]'
}]
}], ctorParameters: () => [{ type: i1.IconComponent }], propDecorators: { class: [{
type: Input
}], hostClass: [{
type: HostBinding,
args: ['class']
}], expandedIcon: [{
type: Input
}], collapsedIcon: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaWNvbi10b2dnbGUuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9ub3ZhLWxpYi9zcmMvbGliL2ljb24tdG9nZ2xlL2ljb24tdG9nZ2xlLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7O0lBZUk7QUFDSixPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDdEUsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLHdCQUF3QixDQUFDO0FBQ3ZELE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQzs7O0FBT3BELE1BQU0sT0FBTyxtQkFBbUI7SUFLOUI7OztPQUdHO0lBQ0gsSUFDSSxLQUFLO1FBQ1AsT0FBTyxDQUFDLElBQUksQ0FBQyxNQUFNLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7SUFDakMsQ0FBQztJQUNELElBQUksS0FBSyxDQUFDLEtBQWE7UUFDckIsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7SUFDdEIsQ0FBQztJQUVELElBQ0ksU0FBUztRQUNYLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQztJQUNwQixDQUFDO0lBRUQ7Ozs7OztPQU1HO0lBQ0gsSUFDSSxZQUFZO1FBQ2QsT0FBTyxJQUFJLENBQUMsYUFBYSxDQUFDO0lBQzVCLENBQUM7SUFDRCxJQUFJLFlBQVksQ0FBQyxLQUFhO1FBQzVCLElBQUksQ0FBQyxhQUFhLEdBQUcsS0FBSyxDQUFDO1FBQzNCLElBQUksQ0FBQyxZQUFZLEdBQUcsSUFBSSxDQUFDO0lBQzNCLENBQUM7SUFHRDs7Ozs7O09BTUc7SUFDSCxJQUNJLGFBQWE7UUFDZixPQUFPLElBQUksQ0FBQyxjQUFjLENBQUM7SUFDN0IsQ0FBQztJQUNELElBQUksYUFBYSxDQUFDLEtBQWE7UUFDN0IsSUFBSSxDQUFDLGNBQWMsR0FBRyxLQUFLLENBQUM7UUFDNUIsSUFBSSxDQUFDLGFBQWEsR0FBRyxJQUFJLENBQUM7SUFDNUIsQ0FBQztJQUdELFlBQW1CLElBQW1CO1FBQW5CLFNBQUksR0FBSixJQUFJLENBQWU7UUF2RHRDLGNBQVMsR0FBWSxLQUFLLENBQUM7UUFDM0IsYUFBUSxHQUFZLEtBQUssQ0FBQztRQUMxQixpQkFBWSxHQUFZLEtBQUssQ0FBQztRQUM5QixrQkFBYSxHQUFZLEtBQUssQ0FBQztRQVkvQixXQUFNLEdBQVcsRUFBRSxDQUFDO1FBcUJwQixrQkFBYSxHQUFXLFVBQVUsQ0FBQyxRQUFRLENBQUM7UUFpQjVDLG1CQUFjLEdBQVcsVUFBVSxDQUFDLFNBQVMsQ0FBQztJQUVMLENBQUMsQ0FBQywyQ0FBMkM7SUFFdEYsUUFBUTtRQUNOLElBQUksSUFBSSxDQUFDLElBQUksSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsSUFBSSxJQUFJLElBQUksQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEVBQUUsQ0FBQztZQUMxRCxJQUFJLENBQUMsUUFBUSxHQUFHLElBQUksQ0FBQztRQUN2QixDQUFDO0lBQ0gsQ0FBQzsrR0E5RFUsbUJBQW1CO21HQUFuQixtQkFBbUI7OzRGQUFuQixtQkFBbUI7a0JBTC9CLFNBQVM7bUJBQUM7b0JBQ1QsVUFBVSxFQUFFLElBQUk7b0JBQ2hCLDhDQUE4QztvQkFDOUMsUUFBUSxFQUFFLGlCQUFpQjtpQkFDNUI7a0ZBV0ssS0FBSztzQkFEUixLQUFLO2dCQVNGLFNBQVM7c0JBRFosV0FBVzt1QkFBQyxPQUFPO2dCQWFoQixZQUFZO3NCQURmLEtBQUs7Z0JBa0JGLGFBQWE7c0JBRGhCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqICAgICAgICAgICAgICBDb3B5cmlnaHQgKGMpIDIwMjUgVmlzYSwgSW5jLlxuICpcbiAqIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKlxuICoqL1xuaW1wb3J0IHsgRGlyZWN0aXZlLCBIb3N0QmluZGluZywgSW5wdXQsIE9uSW5pdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgSWNvbkNvbXBvbmVudCB9IGZyb20gJy4uL2ljb24vaWNvbi5jb21wb25lbnQnO1xuaW1wb3J0IHsgSWNvblRvZ2dsZSB9IGZyb20gJy4uL2ljb24vaWNvbi5jb25zdGFudHMnO1xuXG5ARGlyZWN0aXZlKHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgLy8gdHNsaW50OmRpc2FibGUtbmV4dC1saW5lOmRpcmVjdGl2ZS1zZWxlY3RvclxuICBzZWxlY3RvcjogJ1t2LWljb24tdG9nZ2xlXSdcbn0pXG5leHBvcnQgY2xhc3MgSWNvblRvZ2dsZURpcmVjdGl2ZSBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIF9leHBhbmRlZDogYm9vbGVhbiA9IGZhbHNlO1xuICBfaWNvblNldDogYm9vbGVhbiA9IGZhbHNlO1xuICBfZXhwYW5kZWRTZXQ6IGJvb2xlYW4gPSBmYWxzZTtcbiAgX2NvbGxhcHNlZFNldDogYm9vbGVhbiA9IGZhbHNlO1xuICAvKipcbiAgICogUHJvdmlkZXMgY3VzdG9tIGNsYXNzJiM0MDtlcyYjNDE7IGZvciBjdXN0b20gc3R5bGluZy5cbiAgICogQGRlZmF1bHQgLnYtYWNjb3JkaW9uLXRvZ2dsZS1pY29uXG4gICAqL1xuICBASW5wdXQoKVxuICBnZXQgY2xhc3MoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gW3RoaXMuX2NsYXNzXS5qb2luKCcgJyk7XG4gIH1cbiAgc2V0IGNsYXNzKHZhbHVlOiBzdHJpbmcpIHtcbiAgICB0aGlzLl9jbGFzcyA9IHZhbHVlO1xuICB9XG4gIF9jbGFzczogc3RyaW5nID0gJyc7XG4gIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICBnZXQgaG9zdENsYXNzKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHRoaXMuY2xhc3M7XG4gIH1cblxuICAvKipcbiAgICogSWNvbiB0byBzaG93IHdoZW4gaXRlbSBpcyBleHBhbmRlZCAvIHNob3duLiA8YnI+XG4gICAqIFdpbGwgcmVuZGVyIHRoaXMgaWNvbiB3aGVuIG5vIDxjb2RlPmljb248L2NvZGU+IG9yIDxjb2RlPmN1c3RvbUljb248L2NvZGU+IGlzIHByb3ZpZGVkIHRvIDxjb2RlPnYtaWNvbjwvY29kZT4uIDxicj5cbiAgICogU2hvdWxkIHJlZmVyIHRvIGFuIGljb24gaW4gVlBEUycgW0ljb24gTGlicmFyeV0oaHR0cHM6Ly9kZXNpZ24udmlzYS5jb20vaWNvbnMpLlxuICAgKiBAZGVmYXVsdCAnY2hldnJvbi1kb3duJyAvIEljb25Ub2dnbGUuRVhQQU5ERUQgPGJyPlxuICAgKiBAYnVpbHRpbiB0cnVlXG4gICAqL1xuICBASW5wdXQoKVxuICBnZXQgZXhwYW5kZWRJY29uKCk6IHN0cmluZyB7XG4gICAgcmV0dXJuIHRoaXMuX2V4cGFuZGVkSWNvbjtcbiAgfVxuICBzZXQgZXhwYW5kZWRJY29uKHZhbHVlOiBzdHJpbmcpIHtcbiAgICB0aGlzLl9leHBhbmRlZEljb24gPSB2YWx1ZTtcbiAgICB0aGlzLl9leHBhbmRlZFNldCA9IHRydWU7XG4gIH1cbiAgX2V4cGFuZGVkSWNvbjogc3RyaW5nID0gSWNvblRvZ2dsZS5FWFBBTkRFRDtcblxuICAvKipcbiAgICogSWNvbiB0byBzaG93IHdoZW4gaXRlbSBpcyBjb2xsYXBzZWQgLyBoaWRkZW4uIDxicj5cbiAgICogV2lsbCByZW5kZXIgdGhpcyBpY29uIHdoZW4gbm8gPGNvZGU+aWNvbjwvY29kZT4gb3IgPGNvZGU+Y3VzdG9tSWNvbjwvY29kZT4gaXMgcHJvdmlkZWQgdG8gPGNvZGU+di1pY29uPC9jb2RlPi4gPGJyPlxuICAgKiBTaG91bGQgcmVmZXIgdG8gYW4gaWNvbiBpbiBWUERTJyBbSWNvbiBMaWJyYXJ5XShodHRwczovL2Rlc2lnbi52aXNhLmNvbS9pY29ucykuXG4gICAqIEBkZWZhdWx0ICdjaGV2cm9uLXJpZ2h0JyAvIEljb25Ub2dnbGUuQ09MTEFQU0VEIDxicj5cbiAgICogQGJ1aWx0aW4gdHJ1ZVxuICAgKi9cbiAgQElucHV0KClcbiAgZ2V0IGNvbGxhcHNlZEljb24oKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5fY29sbGFwc2VkSWNvbjtcbiAgfVxuICBzZXQgY29sbGFwc2VkSWNvbih2YWx1ZTogc3RyaW5nKSB7XG4gICAgdGhpcy5fY29sbGFwc2VkSWNvbiA9IHZhbHVlO1xuICAgIHRoaXMuX2NvbGxhcHNlZFNldCA9IHRydWU7XG4gIH1cbiAgX2NvbGxhcHNlZEljb246IHN0cmluZyA9IEljb25Ub2dnbGUuQ09MTEFQU0VEO1xuXG4gIGNvbnN0cnVjdG9yKHB1YmxpYyBpY29uOiBJY29uQ29tcG9uZW50KSB7fSAvLyB1c2VkIGluIGZsb2F0aW5nLXVpIG9yIGFjY29yZGlvbiBzZXJ2aWNlXG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuaWNvbiAmJiAodGhpcy5pY29uLmljb24gfHwgdGhpcy5pY29uLmN1c3RvbUljb24pKSB7XG4gICAgICB0aGlzLl9pY29uU2V0ID0gdHJ1ZTtcbiAgICB9XG4gIH1cbn1cbiJdfQ==