@ux-aspects/ux-aspects
Version:
Open source user interface framework for building modern, responsive, mobile big data applications
60 lines • 7.61 kB
JavaScript
import { Directive, HostBinding, inject, Input } from '@angular/core';
import { ColorService, ThemeColor } from '../../../services/color/index';
import { ContrastService } from './contrast.service';
import * as i0 from "@angular/core";
export class ColorContrastDirective {
constructor() {
this._colorService = inject(ColorService);
this._contrastService = inject(ContrastService);
/** Store the light color as a ThemeColor object */
this._lightColor = ThemeColor.parse('#fff');
/** Store the light color as a ThemeColor object */
this._darkColor = ThemeColor.parse('#000');
}
/**
* Define the background color for contrast comparison.
* This can be a CSS color value or the name of a
* color from the color palette.
*/
set uxColorContrast(backgroundColor) {
this._backgroundColor = ThemeColor.parse(this._colorService.resolve(backgroundColor));
}
/**
* Define the light color for contrast comparison.
* This can be a CSS color value or the name of a
* color from the color palette.
*/
set lightColor(lightColor) {
this._lightColor = ThemeColor.parse(this._colorService.resolve(lightColor));
}
/**
* Define the dark color for contrast comparison.
* This can be a CSS color value or the name of a
* color from the color palette.
*/
set darkColor(darkColor) {
this._darkColor = ThemeColor.parse(this._colorService.resolve(darkColor));
}
/** Determine the color to set based on the supplied parameters */
get _color() {
return this._backgroundColor ? this._contrastService.getContrastColor(this._backgroundColor, this._lightColor, this._darkColor).toRgba() : null;
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ColorContrastDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "18.2.12", type: ColorContrastDirective, selector: "[uxColorContrast]", inputs: { uxColorContrast: "uxColorContrast", lightColor: "lightColor", darkColor: "darkColor" }, host: { properties: { "style.color": "this._color" } }, ngImport: i0 }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.12", ngImport: i0, type: ColorContrastDirective, decorators: [{
type: Directive,
args: [{
selector: '[uxColorContrast]'
}]
}], propDecorators: { uxColorContrast: [{
type: Input
}], lightColor: [{
type: Input
}], darkColor: [{
type: Input
}], _color: [{
type: HostBinding,
args: ['style.color']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29sb3ItY29udHJhc3QuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2RpcmVjdGl2ZXMvYWNjZXNzaWJpbGl0eS9jb250cmFzdC1yYXRpby9jb2xvci1jb250cmFzdC5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxXQUFXLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN0RSxPQUFPLEVBQUUsWUFBWSxFQUFFLFVBQVUsRUFBRSxNQUFNLCtCQUErQixDQUFDO0FBQ3pFLE9BQU8sRUFBRSxlQUFlLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQzs7QUFLckQsTUFBTSxPQUFPLHNCQUFzQjtJQUhuQztRQUlxQixrQkFBYSxHQUFHLE1BQU0sQ0FBQyxZQUFZLENBQUMsQ0FBQztRQUVyQyxxQkFBZ0IsR0FBRyxNQUFNLENBQUMsZUFBZSxDQUFDLENBQUM7UUFzQzVELG1EQUFtRDtRQUMzQyxnQkFBVyxHQUFlLFVBQVUsQ0FBQyxLQUFLLENBQUMsTUFBTSxDQUFDLENBQUM7UUFFM0QsbURBQW1EO1FBQzNDLGVBQVUsR0FBZSxVQUFVLENBQUMsS0FBSyxDQUFDLE1BQU0sQ0FBQyxDQUFDO0tBRTdEO0lBMUNHOzs7O09BSUc7SUFDSCxJQUFhLGVBQWUsQ0FBQyxlQUF1QjtRQUNoRCxJQUFJLENBQUMsZ0JBQWdCLEdBQUcsVUFBVSxDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLE9BQU8sQ0FBQyxlQUFlLENBQUMsQ0FBQyxDQUFDO0lBQzFGLENBQUM7SUFFRDs7OztPQUlHO0lBQ0gsSUFBYSxVQUFVLENBQUMsVUFBa0I7UUFDdEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxVQUFVLENBQUMsS0FBSyxDQUFDLElBQUksQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLFVBQVUsQ0FBQyxDQUFDLENBQUM7SUFDaEYsQ0FBQztJQUVEOzs7O09BSUc7SUFDSCxJQUFhLFNBQVMsQ0FBQyxTQUFpQjtRQUNwQyxJQUFJLENBQUMsVUFBVSxHQUFHLFVBQVUsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsU0FBUyxDQUFDLENBQUMsQ0FBQztJQUM5RSxDQUFDO0lBRUQsa0VBQWtFO0lBQ2xFLElBQ0ksTUFBTTtRQUNOLE9BQU8sSUFBSSxDQUFDLGdCQUFnQixDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsZ0JBQWdCLENBQUMsSUFBSSxDQUFDLGdCQUFnQixFQUFFLElBQUksQ0FBQyxXQUFXLEVBQUUsSUFBSSxDQUFDLFVBQVUsQ0FBQyxDQUFDLE1BQU0sRUFBRSxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUM7SUFDcEosQ0FBQzsrR0FwQ1Esc0JBQXNCO21HQUF0QixzQkFBc0I7OzRGQUF0QixzQkFBc0I7a0JBSGxDLFNBQVM7bUJBQUM7b0JBQ1AsUUFBUSxFQUFFLG1CQUFtQjtpQkFDaEM7OEJBV2dCLGVBQWU7c0JBQTNCLEtBQUs7Z0JBU08sVUFBVTtzQkFBdEIsS0FBSztnQkFTTyxTQUFTO3NCQUFyQixLQUFLO2dCQU1GLE1BQU07c0JBRFQsV0FBVzt1QkFBQyxhQUFhIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBIb3N0QmluZGluZywgaW5qZWN0LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29sb3JTZXJ2aWNlLCBUaGVtZUNvbG9yIH0gZnJvbSAnLi4vLi4vLi4vc2VydmljZXMvY29sb3IvaW5kZXgnO1xuaW1wb3J0IHsgQ29udHJhc3RTZXJ2aWNlIH0gZnJvbSAnLi9jb250cmFzdC5zZXJ2aWNlJztcblxuQERpcmVjdGl2ZSh7XG4gICAgc2VsZWN0b3I6ICdbdXhDb2xvckNvbnRyYXN0XSdcbn0pXG5leHBvcnQgY2xhc3MgQ29sb3JDb250cmFzdERpcmVjdGl2ZSB7XG4gICAgcHJpdmF0ZSByZWFkb25seSBfY29sb3JTZXJ2aWNlID0gaW5qZWN0KENvbG9yU2VydmljZSk7XG5cbiAgICBwcml2YXRlIHJlYWRvbmx5IF9jb250cmFzdFNlcnZpY2UgPSBpbmplY3QoQ29udHJhc3RTZXJ2aWNlKTtcblxuICAgIC8qKlxuICAgICAqIERlZmluZSB0aGUgYmFja2dyb3VuZCBjb2xvciBmb3IgY29udHJhc3QgY29tcGFyaXNvbi5cbiAgICAgKiBUaGlzIGNhbiBiZSBhIENTUyBjb2xvciB2YWx1ZSBvciB0aGUgbmFtZSBvZiBhXG4gICAgICogY29sb3IgZnJvbSB0aGUgY29sb3IgcGFsZXR0ZS5cbiAgICAgKi9cbiAgICBASW5wdXQoKSBzZXQgdXhDb2xvckNvbnRyYXN0KGJhY2tncm91bmRDb2xvcjogc3RyaW5nKSB7XG4gICAgICAgIHRoaXMuX2JhY2tncm91bmRDb2xvciA9IFRoZW1lQ29sb3IucGFyc2UodGhpcy5fY29sb3JTZXJ2aWNlLnJlc29sdmUoYmFja2dyb3VuZENvbG9yKSk7XG4gICAgfVxuXG4gICAgLyoqXG4gICAgICogRGVmaW5lIHRoZSBsaWdodCBjb2xvciBmb3IgY29udHJhc3QgY29tcGFyaXNvbi5cbiAgICAgKiBUaGlzIGNhbiBiZSBhIENTUyBjb2xvciB2YWx1ZSBvciB0aGUgbmFtZSBvZiBhXG4gICAgICogY29sb3IgZnJvbSB0aGUgY29sb3IgcGFsZXR0ZS5cbiAgICAgKi9cbiAgICBASW5wdXQoKSBzZXQgbGlnaHRDb2xvcihsaWdodENvbG9yOiBzdHJpbmcpIHtcbiAgICAgICAgdGhpcy5fbGlnaHRDb2xvciA9IFRoZW1lQ29sb3IucGFyc2UodGhpcy5fY29sb3JTZXJ2aWNlLnJlc29sdmUobGlnaHRDb2xvcikpO1xuICAgIH1cblxuICAgIC8qKlxuICAgICAqIERlZmluZSB0aGUgZGFyayBjb2xvciBmb3IgY29udHJhc3QgY29tcGFyaXNvbi5cbiAgICAgKiBUaGlzIGNhbiBiZSBhIENTUyBjb2xvciB2YWx1ZSBvciB0aGUgbmFtZSBvZiBhXG4gICAgICogY29sb3IgZnJvbSB0aGUgY29sb3IgcGFsZXR0ZS5cbiAgICAgKi9cbiAgICBASW5wdXQoKSBzZXQgZGFya0NvbG9yKGRhcmtDb2xvcjogc3RyaW5nKSB7XG4gICAgICAgIHRoaXMuX2RhcmtDb2xvciA9IFRoZW1lQ29sb3IucGFyc2UodGhpcy5fY29sb3JTZXJ2aWNlLnJlc29sdmUoZGFya0NvbG9yKSk7XG4gICAgfVxuXG4gICAgLyoqIERldGVybWluZSB0aGUgY29sb3IgdG8gc2V0IGJhc2VkIG9uIHRoZSBzdXBwbGllZCBwYXJhbWV0ZXJzICovXG4gICAgQEhvc3RCaW5kaW5nKCdzdHlsZS5jb2xvcicpXG4gICAgZ2V0IF9jb2xvcigpOiBzdHJpbmcgfCBudWxsIHtcbiAgICAgICAgcmV0dXJuIHRoaXMuX2JhY2tncm91bmRDb2xvciA/IHRoaXMuX2NvbnRyYXN0U2VydmljZS5nZXRDb250cmFzdENvbG9yKHRoaXMuX2JhY2tncm91bmRDb2xvciwgdGhpcy5fbGlnaHRDb2xvciwgdGhpcy5fZGFya0NvbG9yKS50b1JnYmEoKSA6IG51bGw7XG4gICAgfVxuXG4gICAgLyoqIFN0b3JlIHRoZSBiYWNrZ3JvdW5kIGNvbG9yIGFzIGEgVGhlbWVDb2xvciBvYmplY3QgKi9cbiAgICBwcml2YXRlIF9iYWNrZ3JvdW5kQ29sb3I6IFRoZW1lQ29sb3I7XG5cbiAgICAvKiogU3RvcmUgdGhlIGxpZ2h0IGNvbG9yIGFzIGEgVGhlbWVDb2xvciBvYmplY3QgKi9cbiAgICBwcml2YXRlIF9saWdodENvbG9yOiBUaGVtZUNvbG9yID0gVGhlbWVDb2xvci5wYXJzZSgnI2ZmZicpO1xuXG4gICAgLyoqIFN0b3JlIHRoZSBsaWdodCBjb2xvciBhcyBhIFRoZW1lQ29sb3Igb2JqZWN0ICovXG4gICAgcHJpdmF0ZSBfZGFya0NvbG9yOiBUaGVtZUNvbG9yID0gVGhlbWVDb2xvci5wYXJzZSgnIzAwMCcpO1xuXG59XG4iXX0=