@visa/nova-angular
Version:
Visa Product Design System Nova Angular library
99 lines • 11.2 kB
JavaScript
/**
* © 2025 Visa
*
* 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, HostBinding, Input } from '@angular/core';
import * as i0 from "@angular/core";
export const BreakpointType = {
XS: 'xs',
SM: 'sm',
MD: 'md',
LG: 'lg',
XL: 'xl',
XXL: 'xxl',
MOBILE: 'mobile',
DESKTOP: 'desktop'
};
export class BreakpointsDirective {
get hostClasses() {
const containerClasses = this.getClasses('container');
const mediaClasses = this.getClasses('media');
return [
this.vHide ? 'v-hide' : null,
this.vContainerHide && !(this.vContainerHide instanceof Array) ? `v-${this.vContainerHide}-container-hide` : null,
this.vMediaHide && !(this.vMediaHide instanceof Array) ? `v-${this.vMediaHide}-media-hide` : null,
containerClasses && containerClasses.length > 0 ? containerClasses : null,
mediaClasses && mediaClasses.length > 0 ? mediaClasses : null
].join(' ');
}
/**
* Hides element when true.
*/
get vHide() {
return this._vHide;
}
set vHide(value) {
this._vHide = coerceBooleanProperty(value);
}
/**
* Hides element when within given _container_ breakpoint.
*/
get vContainerHide() {
return this._vContainerHide;
}
set vContainerHide(value) {
this._vContainerHide = value;
}
/**
* Hides element when within given _media_ breakpoint.
*/
get vMediaHide() {
return this._vMediaHide;
}
set vMediaHide(value) {
this._vMediaHide = value;
}
getClasses(type) {
let classes = [];
if (type === 'container' && this.vContainerHide instanceof Array) {
this.vContainerHide.forEach((bp) => classes.push(`v-${bp}-container-hide`));
}
else if (type === 'media' && this.vMediaHide instanceof Array) {
this.vMediaHide.forEach((bp) => classes.push(`v-${bp}-media-hide`));
}
if (classes.length > 0)
return classes.join(' ');
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreakpointsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.3.12", type: BreakpointsDirective, isStandalone: true, selector: "[vContainerHide], [vMediaHide], [vHide], ", inputs: { vHide: "vHide", vContainerHide: "vContainerHide", vMediaHide: "vMediaHide" }, host: { properties: { "class": "this.hostClasses" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: BreakpointsDirective, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[vContainerHide], [vMediaHide], [vHide], '
}]
}], propDecorators: { hostClasses: [{
type: HostBinding,
args: ['class']
}], vHide: [{
type: Input
}], vContainerHide: [{
type: Input
}], vMediaHide: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnJlYWtwb2ludHMuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9ub3ZhLWxpYi9zcmMvbGliL2JyZWFrcG9pbnRzL2JyZWFrcG9pbnRzLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7Ozs7Ozs7Ozs7Ozs7O0lBZUk7QUFDSixPQUFPLEVBQUUscUJBQXFCLEVBQWdCLE1BQU0sdUJBQXVCLENBQUM7QUFDNUUsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQUU5RCxNQUFNLENBQUMsTUFBTSxjQUFjLEdBQUc7SUFDNUIsRUFBRSxFQUFFLElBQUk7SUFDUixFQUFFLEVBQUUsSUFBSTtJQUNSLEVBQUUsRUFBRSxJQUFJO0lBQ1IsRUFBRSxFQUFFLElBQUk7SUFDUixFQUFFLEVBQUUsSUFBSTtJQUNSLEdBQUcsRUFBRSxLQUFLO0lBQ1YsTUFBTSxFQUFFLFFBQVE7SUFDaEIsT0FBTyxFQUFFLFNBQVM7Q0FDVixDQUFDO0FBUVgsTUFBTSxPQUFPLG9CQUFvQjtJQUMvQixJQUNJLFdBQVc7UUFDYixNQUFNLGdCQUFnQixHQUFHLElBQUksQ0FBQyxVQUFVLENBQUMsV0FBVyxDQUFDLENBQUM7UUFDdEQsTUFBTSxZQUFZLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxPQUFPLENBQUMsQ0FBQztRQUM5QyxPQUFPO1lBQ0wsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsUUFBUSxDQUFDLENBQUMsQ0FBQyxJQUFJO1lBQzVCLElBQUksQ0FBQyxjQUFjLElBQUksQ0FBQyxDQUFDLElBQUksQ0FBQyxjQUFjLFlBQVksS0FBSyxDQUFDLENBQUMsQ0FBQyxDQUFDLEtBQUssSUFBSSxDQUFDLGNBQWMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLElBQUk7WUFDakgsSUFBSSxDQUFDLFVBQVUsSUFBSSxDQUFDLENBQUMsSUFBSSxDQUFDLFVBQVUsWUFBWSxLQUFLLENBQUMsQ0FBQyxDQUFDLENBQUMsS0FBSyxJQUFJLENBQUMsVUFBVSxhQUFhLENBQUMsQ0FBQyxDQUFDLElBQUk7WUFDakcsZ0JBQWdCLElBQUksZ0JBQWdCLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUMsZ0JBQWdCLENBQUMsQ0FBQyxDQUFDLElBQUk7WUFDekUsWUFBWSxJQUFJLFlBQVksQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDLElBQUk7U0FDOUQsQ0FBQyxJQUFJLENBQUMsR0FBRyxDQUFDLENBQUM7SUFDZCxDQUFDO0lBRUQ7O09BRUc7SUFDSCxJQUNJLEtBQUs7UUFDUCxPQUFPLElBQUksQ0FBQyxNQUFNLENBQUM7SUFDckIsQ0FBQztJQUNELElBQUksS0FBSyxDQUFDLEtBQW1CO1FBQzNCLElBQUksQ0FBQyxNQUFNLEdBQUcscUJBQXFCLENBQUMsS0FBSyxDQUFDLENBQUM7SUFDN0MsQ0FBQztJQUdEOztPQUVHO0lBQ0gsSUFDSSxjQUFjO1FBQ2hCLE9BQU8sSUFBSSxDQUFDLGVBQWUsQ0FBQztJQUM5QixDQUFDO0lBQ0QsSUFBSSxjQUFjLENBQUMsS0FBSztRQUN0QixJQUFJLENBQUMsZUFBZSxHQUFHLEtBQUssQ0FBQztJQUMvQixDQUFDO0lBR0Q7O09BRUc7SUFDSCxJQUNJLFVBQVU7UUFDWixPQUFPLElBQUksQ0FBQyxXQUFXLENBQUM7SUFDMUIsQ0FBQztJQUNELElBQUksVUFBVSxDQUFDLEtBQUs7UUFDbEIsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLENBQUM7SUFDM0IsQ0FBQztJQUdELFVBQVUsQ0FBQyxJQUEyQjtRQUNwQyxJQUFJLE9BQU8sR0FBYSxFQUFFLENBQUM7UUFDM0IsSUFBSSxJQUFJLEtBQUssV0FBVyxJQUFJLElBQUksQ0FBQyxjQUFjLFlBQVksS0FBSyxFQUFFLENBQUM7WUFDakUsSUFBSSxDQUFDLGNBQWMsQ0FBQyxPQUFPLENBQUMsQ0FBQyxFQUFFLEVBQUUsRUFBRSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLGlCQUFpQixDQUFDLENBQUMsQ0FBQztRQUM5RSxDQUFDO2FBQU0sSUFBSSxJQUFJLEtBQUssT0FBTyxJQUFJLElBQUksQ0FBQyxVQUFVLFlBQVksS0FBSyxFQUFFLENBQUM7WUFDaEUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxPQUFPLENBQUMsQ0FBQyxFQUFFLEVBQUUsRUFBRSxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLGFBQWEsQ0FBQyxDQUFDLENBQUM7UUFDdEUsQ0FBQztRQUNELElBQUksT0FBTyxDQUFDLE1BQU0sR0FBRyxDQUFDO1lBQUUsT0FBTyxPQUFPLENBQUMsSUFBSSxDQUFDLEdBQUcsQ0FBQyxDQUFDO0lBQ25ELENBQUM7K0dBMURVLG9CQUFvQjttR0FBcEIsb0JBQW9COzs0RkFBcEIsb0JBQW9CO2tCQUpoQyxTQUFTO21CQUFDO29CQUNULFVBQVUsRUFBRSxJQUFJO29CQUNoQixRQUFRLEVBQUUsMkNBQTJDO2lCQUN0RDs4QkFHSyxXQUFXO3NCQURkLFdBQVc7dUJBQUMsT0FBTztnQkFpQmhCLEtBQUs7c0JBRFIsS0FBSztnQkFhRixjQUFjO3NCQURqQixLQUFLO2dCQWFGLFVBQVU7c0JBRGIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbIi8qKlxuICogICAgICAgICAgICAgIMKpIDIwMjUgVmlzYVxuICpcbiAqIExpY2Vuc2VkIHVuZGVyIHRoZSBBcGFjaGUgTGljZW5zZSwgVmVyc2lvbiAyLjAgKHRoZSBcIkxpY2Vuc2VcIik7XG4gKiB5b3UgbWF5IG5vdCB1c2UgdGhpcyBmaWxlIGV4Y2VwdCBpbiBjb21wbGlhbmNlIHdpdGggdGhlIExpY2Vuc2UuXG4gKiBZb3UgbWF5IG9idGFpbiBhIGNvcHkgb2YgdGhlIExpY2Vuc2UgYXRcbiAqXG4gKiAgICAgICAgIGh0dHA6Ly93d3cuYXBhY2hlLm9yZy9saWNlbnNlcy9MSUNFTlNFLTIuMFxuICpcbiAqIFVubGVzcyByZXF1aXJlZCBieSBhcHBsaWNhYmxlIGxhdyBvciBhZ3JlZWQgdG8gaW4gd3JpdGluZywgc29mdHdhcmVcbiAqIGRpc3RyaWJ1dGVkIHVuZGVyIHRoZSBMaWNlbnNlIGlzIGRpc3RyaWJ1dGVkIG9uIGFuIFwiQVMgSVNcIiBCQVNJUyxcbiAqIFdJVEhPVVQgV0FSUkFOVElFUyBPUiBDT05ESVRJT05TIE9GIEFOWSBLSU5ELCBlaXRoZXIgZXhwcmVzcyBvciBpbXBsaWVkLlxuICogU2VlIHRoZSBMaWNlbnNlIGZvciB0aGUgc3BlY2lmaWMgbGFuZ3VhZ2UgZ292ZXJuaW5nIHBlcm1pc3Npb25zIGFuZFxuICogbGltaXRhdGlvbnMgdW5kZXIgdGhlIExpY2Vuc2UuXG4gKlxuICoqL1xuaW1wb3J0IHsgY29lcmNlQm9vbGVhblByb3BlcnR5LCBCb29sZWFuSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jZGsvY29lcmNpb24nO1xuaW1wb3J0IHsgRGlyZWN0aXZlLCBIb3N0QmluZGluZywgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuZXhwb3J0IGNvbnN0IEJyZWFrcG9pbnRUeXBlID0ge1xuICBYUzogJ3hzJyxcbiAgU006ICdzbScsXG4gIE1EOiAnbWQnLFxuICBMRzogJ2xnJyxcbiAgWEw6ICd4bCcsXG4gIFhYTDogJ3h4bCcsXG4gIE1PQklMRTogJ21vYmlsZScsXG4gIERFU0tUT1A6ICdkZXNrdG9wJ1xufSBhcyBjb25zdDtcblxuZXhwb3J0IHR5cGUgQnJlYWtwb2ludFR5cGUgPSAodHlwZW9mIEJyZWFrcG9pbnRUeXBlKVtrZXlvZiB0eXBlb2YgQnJlYWtwb2ludFR5cGVdO1xuXG5ARGlyZWN0aXZlKHtcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgc2VsZWN0b3I6ICdbdkNvbnRhaW5lckhpZGVdLCBbdk1lZGlhSGlkZV0sIFt2SGlkZV0sICdcbn0pXG5leHBvcnQgY2xhc3MgQnJlYWtwb2ludHNEaXJlY3RpdmUge1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzJylcbiAgZ2V0IGhvc3RDbGFzc2VzKCk6IHN0cmluZyB7XG4gICAgY29uc3QgY29udGFpbmVyQ2xhc3NlcyA9IHRoaXMuZ2V0Q2xhc3NlcygnY29udGFpbmVyJyk7XG4gICAgY29uc3QgbWVkaWFDbGFzc2VzID0gdGhpcy5nZXRDbGFzc2VzKCdtZWRpYScpO1xuICAgIHJldHVybiBbXG4gICAgICB0aGlzLnZIaWRlID8gJ3YtaGlkZScgOiBudWxsLFxuICAgICAgdGhpcy52Q29udGFpbmVySGlkZSAmJiAhKHRoaXMudkNvbnRhaW5lckhpZGUgaW5zdGFuY2VvZiBBcnJheSkgPyBgdi0ke3RoaXMudkNvbnRhaW5lckhpZGV9LWNvbnRhaW5lci1oaWRlYCA6IG51bGwsXG4gICAgICB0aGlzLnZNZWRpYUhpZGUgJiYgISh0aGlzLnZNZWRpYUhpZGUgaW5zdGFuY2VvZiBBcnJheSkgPyBgdi0ke3RoaXMudk1lZGlhSGlkZX0tbWVkaWEtaGlkZWAgOiBudWxsLFxuICAgICAgY29udGFpbmVyQ2xhc3NlcyAmJiBjb250YWluZXJDbGFzc2VzLmxlbmd0aCA+IDAgPyBjb250YWluZXJDbGFzc2VzIDogbnVsbCxcbiAgICAgIG1lZGlhQ2xhc3NlcyAmJiBtZWRpYUNsYXNzZXMubGVuZ3RoID4gMCA/IG1lZGlhQ2xhc3NlcyA6IG51bGxcbiAgICBdLmpvaW4oJyAnKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBIaWRlcyBlbGVtZW50IHdoZW4gdHJ1ZS5cbiAgICovXG4gIEBJbnB1dCgpXG4gIGdldCB2SGlkZSgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5fdkhpZGU7XG4gIH1cbiAgc2V0IHZIaWRlKHZhbHVlOiBCb29sZWFuSW5wdXQpIHtcbiAgICB0aGlzLl92SGlkZSA9IGNvZXJjZUJvb2xlYW5Qcm9wZXJ0eSh2YWx1ZSk7XG4gIH1cbiAgX3ZIaWRlOiBib29sZWFuO1xuXG4gIC8qKlxuICAgKiBIaWRlcyBlbGVtZW50IHdoZW4gd2l0aGluIGdpdmVuIF9jb250YWluZXJfIGJyZWFrcG9pbnQuXG4gICAqL1xuICBASW5wdXQoKVxuICBnZXQgdkNvbnRhaW5lckhpZGUoKTogQnJlYWtwb2ludFR5cGUgfCBCcmVha3BvaW50VHlwZVtdIHwgbnVsbCB7XG4gICAgcmV0dXJuIHRoaXMuX3ZDb250YWluZXJIaWRlO1xuICB9XG4gIHNldCB2Q29udGFpbmVySGlkZSh2YWx1ZSkge1xuICAgIHRoaXMuX3ZDb250YWluZXJIaWRlID0gdmFsdWU7XG4gIH1cbiAgX3ZDb250YWluZXJIaWRlOiBCcmVha3BvaW50VHlwZSB8IEJyZWFrcG9pbnRUeXBlW10gfCBudWxsO1xuXG4gIC8qKlxuICAgKiBIaWRlcyBlbGVtZW50IHdoZW4gd2l0aGluIGdpdmVuIF9tZWRpYV8gYnJlYWtwb2ludC5cbiAgICovXG4gIEBJbnB1dCgpXG4gIGdldCB2TWVkaWFIaWRlKCk6IEJyZWFrcG9pbnRUeXBlIHwgQnJlYWtwb2ludFR5cGVbXSB8IG51bGwge1xuICAgIHJldHVybiB0aGlzLl92TWVkaWFIaWRlO1xuICB9XG4gIHNldCB2TWVkaWFIaWRlKHZhbHVlKSB7XG4gICAgdGhpcy5fdk1lZGlhSGlkZSA9IHZhbHVlO1xuICB9XG4gIF92TWVkaWFIaWRlOiBCcmVha3BvaW50VHlwZSB8IEJyZWFrcG9pbnRUeXBlW10gfCBudWxsO1xuXG4gIGdldENsYXNzZXModHlwZTogJ2NvbnRhaW5lcicgfCAnbWVkaWEnKTogc3RyaW5nIHwgdm9pZCB7XG4gICAgbGV0IGNsYXNzZXM6IHN0cmluZ1tdID0gW107XG4gICAgaWYgKHR5cGUgPT09ICdjb250YWluZXInICYmIHRoaXMudkNvbnRhaW5lckhpZGUgaW5zdGFuY2VvZiBBcnJheSkge1xuICAgICAgdGhpcy52Q29udGFpbmVySGlkZS5mb3JFYWNoKChicCkgPT4gY2xhc3Nlcy5wdXNoKGB2LSR7YnB9LWNvbnRhaW5lci1oaWRlYCkpO1xuICAgIH0gZWxzZSBpZiAodHlwZSA9PT0gJ21lZGlhJyAmJiB0aGlzLnZNZWRpYUhpZGUgaW5zdGFuY2VvZiBBcnJheSkge1xuICAgICAgdGhpcy52TWVkaWFIaWRlLmZvckVhY2goKGJwKSA9PiBjbGFzc2VzLnB1c2goYHYtJHticH0tbWVkaWEtaGlkZWApKTtcbiAgICB9XG4gICAgaWYgKGNsYXNzZXMubGVuZ3RoID4gMCkgcmV0dXJuIGNsYXNzZXMuam9pbignICcpO1xuICB9XG59XG4iXX0=