@visa/nova-angular
Version:
Visa Product Design System Nova Angular library
95 lines • 9.06 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, Input, HostBinding, ElementRef } from '@angular/core';
import * as i0 from "@angular/core";
export class DropdownMenuDirective {
get hostClasses() {
return this.class;
}
get hostAriaHidden() {
return !this._isShown;
}
get hostInlineSize() {
return '180px';
}
get hostMaxInlineSize() {
return '100%';
}
// this is an angular-specific override. Spacing between dropdown-menu and button/trigger
// is handled within floating-ui.service
get hostMarginBlockStart() {
return '0';
}
get hostZIndex() {
return this.zIndex.toString();
}
get hostId() {
return this.id;
}
constructor(el) {
this.el = el;
// the following is determined by floating-ui-container and used to set aria attributes
this._isShown = false;
/**
* Provides custom class(es) for custom styling.
* @default .v-surface.v-dropdown-menu
*/
this.class = 'v-surface v-dropdown-menu'; // override the standard class attr with a new one.
/**
* Provides custom z-index to control stacking order.
* @default 200;
*/
this.zIndex = 200;
} // ElementRef needed for floating-ui-container
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DropdownMenuDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: DropdownMenuDirective, isStandalone: true, selector: "[v-menu], [v-dropdown-menu]", inputs: { class: "class", zIndex: "zIndex", id: "id" }, host: { properties: { "class": "this.hostClasses", "attr.aria-hidden": "this.hostAriaHidden", "style.inline-size": "this.hostInlineSize", "style.max-inline-size": "this.hostMaxInlineSize", "style.--v-dropdown-menu-surface-margin-block-start": "this.hostMarginBlockStart", "style.z-index": "this.hostZIndex", "attr.id": "this.hostId" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: DropdownMenuDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[v-menu], [v-dropdown-menu]'
}]
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { class: [{
type: Input
}], hostClasses: [{
type: HostBinding,
args: ['class']
}], hostAriaHidden: [{
type: HostBinding,
args: ['attr.aria-hidden']
}], hostInlineSize: [{
type: HostBinding,
args: ['style.inline-size']
}], hostMaxInlineSize: [{
type: HostBinding,
args: ['style.max-inline-size']
}], hostMarginBlockStart: [{
type: HostBinding,
args: ['style.--v-dropdown-menu-surface-margin-block-start']
}], zIndex: [{
type: Input
}], hostZIndex: [{
type: HostBinding,
args: ['style.z-index']
}], id: [{
type: Input
}], hostId: [{
type: HostBinding,
args: ['attr.id']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZHJvcGRvd24tbWVudS5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9saWJzL25vdmEtbGliL3NyYy9saWIvZHJvcGRvd24tbWVudS9kcm9wZG93bi1tZW51LmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7O0lBZUk7QUFDSixPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxXQUFXLEVBQUUsVUFBVSxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQU0xRSxNQUFNLE9BQU8scUJBQXFCO0lBU2hDLElBQ0ksV0FBVztRQUNiLE9BQU8sSUFBSSxDQUFDLEtBQUssQ0FBQztJQUNwQixDQUFDO0lBRUQsSUFDSSxjQUFjO1FBQ2hCLE9BQU8sQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDO0lBQ3hCLENBQUM7SUFFRCxJQUNJLGNBQWM7UUFDaEIsT0FBTyxPQUFPLENBQUM7SUFDakIsQ0FBQztJQUVELElBQ0ksaUJBQWlCO1FBQ25CLE9BQU8sTUFBTSxDQUFDO0lBQ2hCLENBQUM7SUFFRCx5RkFBeUY7SUFDekYsd0NBQXdDO0lBQ3hDLElBQ0ksb0JBQW9CO1FBQ3RCLE9BQU8sR0FBRyxDQUFDO0lBQ2IsQ0FBQztJQU9ELElBQ0ksVUFBVTtRQUNaLE9BQU8sSUFBSSxDQUFDLE1BQU0sQ0FBQyxRQUFRLEVBQUUsQ0FBQztJQUNoQyxDQUFDO0lBT0QsSUFDSSxNQUFNO1FBQ1IsT0FBTyxJQUFJLENBQUMsRUFBRSxDQUFDO0lBQ2pCLENBQUM7SUFFRCxZQUFtQixFQUFjO1FBQWQsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQXZEakMsdUZBQXVGO1FBQ3ZGLGFBQVEsR0FBRyxLQUFLLENBQUM7UUFFakI7OztXQUdHO1FBQ00sVUFBSyxHQUFXLDJCQUEyQixDQUFDLENBQUMsbURBQW1EO1FBNEJ6Rzs7O1dBR0c7UUFDTSxXQUFNLEdBQVcsR0FBRyxDQUFDO0lBZ0JNLENBQUMsQ0FBQyw4Q0FBOEM7K0dBeER6RSxxQkFBcUI7bUdBQXJCLHFCQUFxQjs7NEZBQXJCLHFCQUFxQjtrQkFKakMsU0FBUzttQkFBQztvQkFDVCxVQUFVLEVBQUUsSUFBSTtvQkFDaEIsUUFBUSxFQUFFLDZCQUE2QjtpQkFDeEM7K0VBU1UsS0FBSztzQkFBYixLQUFLO2dCQUVGLFdBQVc7c0JBRGQsV0FBVzt1QkFBQyxPQUFPO2dCQU1oQixjQUFjO3NCQURqQixXQUFXO3VCQUFDLGtCQUFrQjtnQkFNM0IsY0FBYztzQkFEakIsV0FBVzt1QkFBQyxtQkFBbUI7Z0JBTTVCLGlCQUFpQjtzQkFEcEIsV0FBVzt1QkFBQyx1QkFBdUI7Z0JBUWhDLG9CQUFvQjtzQkFEdkIsV0FBVzt1QkFBQyxvREFBb0Q7Z0JBU3hELE1BQU07c0JBQWQsS0FBSztnQkFFRixVQUFVO3NCQURiLFdBQVc7dUJBQUMsZUFBZTtnQkFTNUIsRUFBRTtzQkFERCxLQUFLO2dCQUdGLE1BQU07c0JBRFQsV0FBVzt1QkFBQyxTQUFTIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiAgICAgICAgICAgICAgQ29weXJpZ2h0IChjKSAyMDI1IFZpc2EsIEluYy5cbiAqXG4gKiBMaWNlbnNlZCB1bmRlciB0aGUgQXBhY2hlIExpY2Vuc2UsIFZlcnNpb24gMi4wICh0aGUgXCJMaWNlbnNlXCIpO1xuICogeW91IG1heSBub3QgdXNlIHRoaXMgZmlsZSBleGNlcHQgaW4gY29tcGxpYW5jZSB3aXRoIHRoZSBMaWNlbnNlLlxuICogWW91IG1heSBvYnRhaW4gYSBjb3B5IG9mIHRoZSBMaWNlbnNlIGF0XG4gKlxuICogICAgICAgICBodHRwOi8vd3d3LmFwYWNoZS5vcmcvbGljZW5zZXMvTElDRU5TRS0yLjBcbiAqXG4gKiBVbmxlc3MgcmVxdWlyZWQgYnkgYXBwbGljYWJsZSBsYXcgb3IgYWdyZWVkIHRvIGluIHdyaXRpbmcsIHNvZnR3YXJlXG4gKiBkaXN0cmlidXRlZCB1bmRlciB0aGUgTGljZW5zZSBpcyBkaXN0cmlidXRlZCBvbiBhbiBcIkFTIElTXCIgQkFTSVMsXG4gKiBXSVRIT1VUIFdBUlJBTlRJRVMgT1IgQ09ORElUSU9OUyBPRiBBTlkgS0lORCwgZWl0aGVyIGV4cHJlc3Mgb3IgaW1wbGllZC5cbiAqIFNlZSB0aGUgTGljZW5zZSBmb3IgdGhlIHNwZWNpZmljIGxhbmd1YWdlIGdvdmVybmluZyBwZXJtaXNzaW9ucyBhbmRcbiAqIGxpbWl0YXRpb25zIHVuZGVyIHRoZSBMaWNlbnNlLlxuICpcbiAqKi9cbmltcG9ydCB7IERpcmVjdGl2ZSwgSW5wdXQsIEhvc3RCaW5kaW5nLCBFbGVtZW50UmVmIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzdGFuZGFsb25lOiB0cnVlLFxuICBzZWxlY3RvcjogJ1t2LW1lbnVdLCBbdi1kcm9wZG93bi1tZW51XSdcbn0pXG5leHBvcnQgY2xhc3MgRHJvcGRvd25NZW51RGlyZWN0aXZlIHtcbiAgLy8gdGhlIGZvbGxvd2luZyBpcyBkZXRlcm1pbmVkIGJ5IGZsb2F0aW5nLXVpLWNvbnRhaW5lciBhbmQgdXNlZCB0byBzZXQgYXJpYSBhdHRyaWJ1dGVzXG4gIF9pc1Nob3duID0gZmFsc2U7XG5cbiAgLyoqXG4gICAqIFByb3ZpZGVzIGN1c3RvbSBjbGFzcyYjNDA7ZXMmIzQxOyBmb3IgY3VzdG9tIHN0eWxpbmcuXG4gICAqIEBkZWZhdWx0IC52LXN1cmZhY2Uudi1kcm9wZG93bi1tZW51XG4gICAqL1xuICBASW5wdXQoKSBjbGFzczogc3RyaW5nID0gJ3Ytc3VyZmFjZSB2LWRyb3Bkb3duLW1lbnUnOyAvLyBvdmVycmlkZSB0aGUgc3RhbmRhcmQgY2xhc3MgYXR0ciB3aXRoIGEgbmV3IG9uZS5cbiAgQEhvc3RCaW5kaW5nKCdjbGFzcycpXG4gIGdldCBob3N0Q2xhc3NlcygpOiBzdHJpbmcge1xuICAgIHJldHVybiB0aGlzLmNsYXNzO1xuICB9XG5cbiAgQEhvc3RCaW5kaW5nKCdhdHRyLmFyaWEtaGlkZGVuJylcbiAgZ2V0IGhvc3RBcmlhSGlkZGVuKCk6IGJvb2xlYW4gfCBudWxsIHwgdm9pZCB7XG4gICAgcmV0dXJuICF0aGlzLl9pc1Nob3duO1xuICB9XG5cbiAgQEhvc3RCaW5kaW5nKCdzdHlsZS5pbmxpbmUtc2l6ZScpXG4gIGdldCBob3N0SW5saW5lU2l6ZSgpOiBzdHJpbmcge1xuICAgIHJldHVybiAnMTgwcHgnO1xuICB9XG5cbiAgQEhvc3RCaW5kaW5nKCdzdHlsZS5tYXgtaW5saW5lLXNpemUnKVxuICBnZXQgaG9zdE1heElubGluZVNpemUoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gJzEwMCUnO1xuICB9XG5cbiAgLy8gdGhpcyBpcyBhbiBhbmd1bGFyLXNwZWNpZmljIG92ZXJyaWRlLiBTcGFjaW5nIGJldHdlZW4gZHJvcGRvd24tbWVudSBhbmQgYnV0dG9uL3RyaWdnZXJcbiAgLy8gaXMgaGFuZGxlZCB3aXRoaW4gZmxvYXRpbmctdWkuc2VydmljZVxuICBASG9zdEJpbmRpbmcoJ3N0eWxlLi0tdi1kcm9wZG93bi1tZW51LXN1cmZhY2UtbWFyZ2luLWJsb2NrLXN0YXJ0JylcbiAgZ2V0IGhvc3RNYXJnaW5CbG9ja1N0YXJ0KCk6IHN0cmluZyB7XG4gICAgcmV0dXJuICcwJztcbiAgfVxuXG4gIC8qKlxuICAgKiBQcm92aWRlcyBjdXN0b20gei1pbmRleCB0byBjb250cm9sIHN0YWNraW5nIG9yZGVyLlxuICAgKiBAZGVmYXVsdCAyMDA7XG4gICAqL1xuICBASW5wdXQoKSB6SW5kZXg6IG51bWJlciA9IDIwMDtcbiAgQEhvc3RCaW5kaW5nKCdzdHlsZS56LWluZGV4JylcbiAgZ2V0IGhvc3RaSW5kZXgoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy56SW5kZXgudG9TdHJpbmcoKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBTZXRzIGN1c3RvbSBJRC5cbiAgICovXG4gIEBJbnB1dCgpXG4gIGlkOiBzdHJpbmc7XG4gIEBIb3N0QmluZGluZygnYXR0ci5pZCcpXG4gIGdldCBob3N0SWQoKTogc3RyaW5nIHtcbiAgICByZXR1cm4gdGhpcy5pZDtcbiAgfVxuXG4gIGNvbnN0cnVjdG9yKHB1YmxpYyBlbDogRWxlbWVudFJlZikge30gLy8gRWxlbWVudFJlZiBuZWVkZWQgZm9yIGZsb2F0aW5nLXVpLWNvbnRhaW5lclxufVxuIl19