@visa/nova-angular
Version:
Visa Product Design System Nova Angular library
107 lines • 10.8 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, ElementRef, HostListener } from '@angular/core';
import { UUIDService } from '../_utilities/services/uuid.service';
import * as i0 from "@angular/core";
import * as i1 from "../_utilities/services/uuid.service";
export class LabelDirective {
/**
* Attribute set to the id of the element it's labeling. <br />
* This property is set by default for radio and checkbox components when used within <code>v-input-container</code> as directed.
*/
get for() {
return this._for;
}
set for(value) {
this._for = value;
}
get labelFor() {
return this._for;
}
get hostId() {
return this.id;
}
get hostClasses() {
this.class = [this.progressLabel ? 'v-progress-label' : 'v-label'].join(' ');
return this.class;
}
/**
* Swaps <code>v-label</code> class for <code>v-progress-label</code> when true. <br />
* Intended for use when label is describing a progress component. <br />
* Automatically set to true when used within a Circular Progress component.
* @default false
*/
get progressLabel() {
return this._progressLabel;
}
set progressLabel(value) {
this._progressLabel = coerceBooleanProperty(value);
}
constructor(el, uuidService) {
this.el = el;
this.uuidService = uuidService;
/**
* Sets custom id.
* @default uuidService.getUUID('v-label-')
* @builtin true
*/
this.id = this.uuidService.getUUID('v-label-');
/**
* Provides custom class(es) for custom styling.
* @default .v-label - when <code>progressLabel</code> is false and not used within a Circular Progress component.
* @default .v-progress-label when <code>progressLabel</code> is true or when used within a Circular Progress component.
*/
this.class = '';
this._progressLabel = false;
} // needed for vdsChip styling
onClick(event) {
// stops click event for firing for label **and** input.
// event will still fire for input
event.stopPropagation();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LabelDirective, deps: [{ token: i0.ElementRef }, { token: i1.UUIDService }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: LabelDirective, isStandalone: true, selector: "[v-label]", inputs: { for: "for", id: "id", class: "class", progressLabel: "progressLabel" }, host: { listeners: { "click": "onClick($event)" }, properties: { "attr.for": "this.labelFor", "attr.id": "this.hostId", "class": "this.hostClasses" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: LabelDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[v-label]'
}]
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1.UUIDService }], propDecorators: { for: [{
type: Input
}], labelFor: [{
type: HostBinding,
args: ['attr.for']
}], id: [{
type: Input
}], hostId: [{
type: HostBinding,
args: ['attr.id']
}], class: [{
type: Input
}], hostClasses: [{
type: HostBinding,
args: ['class']
}], progressLabel: [{
type: Input
}], onClick: [{
type: HostListener,
args: ['click', ['$event']]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFiZWwuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9ub3ZhLWxpYi9zcmMvbGliL2xhYmVsL2xhYmVsLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7O0lBZUk7QUFDSixPQUFPLEVBQWdCLHFCQUFxQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDNUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFFLFVBQVUsRUFBRSxZQUFZLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDeEYsT0FBTyxFQUFFLFdBQVcsRUFBRSxNQUFNLHFDQUFxQyxDQUFDOzs7QUFNbEUsTUFBTSxPQUFPLGNBQWM7SUFDekI7OztPQUdHO0lBQ0gsSUFDSSxHQUFHO1FBQ0wsT0FBTyxJQUFJLENBQUMsSUFBSSxDQUFDO0lBQ25CLENBQUM7SUFDRCxJQUFJLEdBQUcsQ0FBQyxLQUFhO1FBQ25CLElBQUksQ0FBQyxJQUFJLEdBQUcsS0FBSyxDQUFDO0lBQ3BCLENBQUM7SUFHRCxJQUNJLFFBQVE7UUFDVixPQUFPLElBQUksQ0FBQyxJQUFJLENBQUM7SUFDbkIsQ0FBQztJQVFELElBQ0ksTUFBTTtRQUNSLE9BQU8sSUFBSSxDQUFDLEVBQUUsQ0FBQztJQUNqQixDQUFDO0lBUUQsSUFDSSxXQUFXO1FBQ2IsSUFBSSxDQUFDLEtBQUssR0FBRyxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDLGtCQUFrQixDQUFDLENBQUMsQ0FBQyxTQUFTLENBQUMsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7UUFDN0UsT0FBTyxJQUFJLENBQUMsS0FBSyxDQUFDO0lBQ3BCLENBQUM7SUFFRDs7Ozs7T0FLRztJQUNILElBQ0ksYUFBYTtRQUNmLE9BQU8sSUFBSSxDQUFDLGNBQWMsQ0FBQztJQUM3QixDQUFDO0lBQ0QsSUFBSSxhQUFhLENBQUMsS0FBbUI7UUFDbkMsSUFBSSxDQUFDLGNBQWMsR0FBRyxxQkFBcUIsQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUNyRCxDQUFDO0lBR0QsWUFDUyxFQUFjLEVBQ2IsV0FBd0I7UUFEekIsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQUNiLGdCQUFXLEdBQVgsV0FBVyxDQUFhO1FBeENsQzs7OztXQUlHO1FBQ00sT0FBRSxHQUFXLElBQUksQ0FBQyxXQUFXLENBQUMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDO1FBTTNEOzs7O1dBSUc7UUFDTSxVQUFLLEdBQVcsRUFBRSxDQUFDO1FBb0JwQixtQkFBYyxHQUFZLEtBQUssQ0FBQztJQUtyQyxDQUFDLENBQUMsNkJBQTZCO0lBR2xDLE9BQU8sQ0FBQyxLQUFZO1FBQ2xCLHdEQUF3RDtRQUN4RCxrQ0FBa0M7UUFDbEMsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQzFCLENBQUM7K0dBbkVVLGNBQWM7bUdBQWQsY0FBYzs7NEZBQWQsY0FBYztrQkFKMUIsU0FBUzttQkFBQztvQkFDVCxVQUFVLEVBQUUsSUFBSTtvQkFDaEIsUUFBUSxFQUFFLFdBQVc7aUJBQ3RCO3lHQU9LLEdBQUc7c0JBRE4sS0FBSztnQkFVRixRQUFRO3NCQURYLFdBQVc7dUJBQUMsVUFBVTtnQkFVZCxFQUFFO3NCQUFWLEtBQUs7Z0JBRUYsTUFBTTtzQkFEVCxXQUFXO3VCQUFDLFNBQVM7Z0JBVWIsS0FBSztzQkFBYixLQUFLO2dCQUVGLFdBQVc7c0JBRGQsV0FBVzt1QkFBQyxPQUFPO2dCQWFoQixhQUFhO3NCQURoQixLQUFLO2dCQWVOLE9BQU87c0JBRE4sWUFBWTt1QkFBQyxPQUFPLEVBQUUsQ0FBQyxRQUFRLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyIvKipcbiAqICAgICAgICAgICAgICBDb3B5cmlnaHQgKGMpIDIwMjUgVmlzYSwgSW5jLlxuICpcbiAqIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKlxuICoqL1xuaW1wb3J0IHsgQm9vbGVhbklucHV0LCBjb2VyY2VCb29sZWFuUHJvcGVydHkgfSBmcm9tICdAYW5ndWxhci9jZGsvY29lcmNpb24nO1xuaW1wb3J0IHsgRGlyZWN0aXZlLCBJbnB1dCwgSG9zdEJpbmRpbmcsIEVsZW1lbnRSZWYsIEhvc3RMaXN0ZW5lciB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgVVVJRFNlcnZpY2UgfSBmcm9tICcuLi9fdXRpbGl0aWVzL3NlcnZpY2VzL3V1aWQuc2VydmljZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzdGFuZGFsb25lOiB0cnVlLFxuICBzZWxlY3RvcjogJ1t2LWxhYmVsXSdcbn0pXG5leHBvcnQgY2xhc3MgTGFiZWxEaXJlY3RpdmUge1xuICAvKipcbiAgICogQXR0cmlidXRlIHNldCB0byB0aGUgaWQgb2YgdGhlIGVsZW1lbnQgaXQncyBsYWJlbGluZy4gPGJyIC8+XG4gICAqIFRoaXMgcHJvcGVydHkgaXMgc2V0IGJ5IGRlZmF1bHQgZm9yIHJhZGlvIGFuZCBjaGVja2JveCBjb21wb25lbnRzIHdoZW4gdXNlZCB3aXRoaW4gPGNvZGU+di1pbnB1dC1jb250YWluZXI8L2NvZGU+IGFzIGRpcmVjdGVkLlxuICAgKi9cbiAgQElucHV0KClcbiAgZ2V0IGZvcigpOiBzdHJpbmcge1xuICAgIHJldHVybiB0aGlzLl9mb3I7XG4gIH1cbiAgc2V0IGZvcih2YWx1ZTogc3RyaW5nKSB7XG4gICAgdGhpcy5fZm9yID0gdmFsdWU7XG4gIH1cbiAgcHJpdmF0ZSBfZm9yOiBzdHJpbmc7XG5cbiAgQEhvc3RCaW5kaW5nKCdhdHRyLmZvcicpXG4gIGdldCBsYWJlbEZvcigpOiBzdHJpbmcge1xuICAgIHJldHVybiB0aGlzLl9mb3I7XG4gIH1cblxuICAvKipcbiAgICogU2V0cyBjdXN0b20gaWQuXG4gICAqIEBkZWZhdWx0IHV1aWRTZXJ2aWNlLmdldFVVSUQoJ3YtbGFiZWwtJylcbiAgICogQGJ1aWx0aW4gdHJ1ZVxuICAgKi9cbiAgQElucHV0KCkgaWQ6IHN0cmluZyA9IHRoaXMudXVpZFNlcnZpY2UuZ2V0VVVJRCgndi1sYWJlbC0nKTtcbiAgQEhvc3RCaW5kaW5nKCdhdHRyLmlkJylcbiAgZ2V0IGhvc3RJZCgpOiBzdHJpbmcge1xuICAgIHJldHVybiB0aGlzLmlkO1xuICB9XG5cbiAgLyoqXG4gICAqIFByb3ZpZGVzIGN1c3RvbSBjbGFzcyYjNDA7ZXMmIzQxOyBmb3IgY3VzdG9tIHN0eWxpbmcuXG4gICAqIEBkZWZhdWx0IC52LWxhYmVsIC0gd2hlbiA8Y29kZT5wcm9ncmVzc0xhYmVsPC9jb2RlPiBpcyBmYWxzZSBhbmQgbm90IHVzZWQgd2l0aGluIGEgQ2lyY3VsYXIgUHJvZ3Jlc3MgY29tcG9uZW50LlxuICAgKiBAZGVmYXVsdCAudi1wcm9ncmVzcy1sYWJlbCB3aGVuIDxjb2RlPnByb2dyZXNzTGFiZWw8L2NvZGU+IGlzIHRydWUgb3Igd2hlbiB1c2VkIHdpdGhpbiBhIENpcmN1bGFyIFByb2dyZXNzIGNvbXBvbmVudC5cbiAgICovXG4gIEBJbnB1dCgpIGNsYXNzOiBzdHJpbmcgPSAnJztcbiAgQEhvc3RCaW5kaW5nKCdjbGFzcycpXG4gIGdldCBob3N0Q2xhc3NlcygpOiBzdHJpbmcge1xuICAgIHRoaXMuY2xhc3MgPSBbdGhpcy5wcm9ncmVzc0xhYmVsID8gJ3YtcHJvZ3Jlc3MtbGFiZWwnIDogJ3YtbGFiZWwnXS5qb2luKCcgJyk7XG4gICAgcmV0dXJuIHRoaXMuY2xhc3M7XG4gIH1cblxuICAvKipcbiAgICogU3dhcHMgPGNvZGU+di1sYWJlbDwvY29kZT4gY2xhc3MgZm9yIDxjb2RlPnYtcHJvZ3Jlc3MtbGFiZWw8L2NvZGU+IHdoZW4gdHJ1ZS4gPGJyIC8+XG4gICAqIEludGVuZGVkIGZvciB1c2Ugd2hlbiBsYWJlbCBpcyBkZXNjcmliaW5nIGEgcHJvZ3Jlc3MgY29tcG9uZW50LiA8YnIgLz5cbiAgICogQXV0b21hdGljYWxseSBzZXQgdG8gdHJ1ZSB3aGVuIHVzZWQgd2l0aGluIGEgQ2lyY3VsYXIgUHJvZ3Jlc3MgY29tcG9uZW50LlxuICAgKiBAZGVmYXVsdCBmYWxzZVxuICAgKi9cbiAgQElucHV0KClcbiAgZ2V0IHByb2dyZXNzTGFiZWwoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuX3Byb2dyZXNzTGFiZWw7XG4gIH1cbiAgc2V0IHByb2dyZXNzTGFiZWwodmFsdWU6IEJvb2xlYW5JbnB1dCkge1xuICAgIHRoaXMuX3Byb2dyZXNzTGFiZWwgPSBjb2VyY2VCb29sZWFuUHJvcGVydHkodmFsdWUpO1xuICB9XG4gIHByaXZhdGUgX3Byb2dyZXNzTGFiZWw6IGJvb2xlYW4gPSBmYWxzZTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBwdWJsaWMgZWw6IEVsZW1lbnRSZWYsXG4gICAgcHJpdmF0ZSB1dWlkU2VydmljZTogVVVJRFNlcnZpY2VcbiAgKSB7fSAvLyBuZWVkZWQgZm9yIHZkc0NoaXAgc3R5bGluZ1xuXG4gIEBIb3N0TGlzdGVuZXIoJ2NsaWNrJywgWyckZXZlbnQnXSlcbiAgb25DbGljayhldmVudDogRXZlbnQpIHtcbiAgICAvLyBzdG9wcyBjbGljayBldmVudCBmb3IgZmlyaW5nIGZvciBsYWJlbCAqKmFuZCoqIGlucHV0LlxuICAgIC8vIGV2ZW50IHdpbGwgc3RpbGwgZmlyZSBmb3IgaW5wdXRcbiAgICBldmVudC5zdG9wUHJvcGFnYXRpb24oKTtcbiAgfVxufVxuIl19