dynamic-theme-lib
Version:
A flexible and powerful theme management library for Angular applications that allows dynamic color management and theme switching.
51 lines • 6.29 kB
JavaScript
import { Directive, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "../services/colour.service";
export class BackgroundColorDirective {
constructor(el, colorService) {
this.el = el;
this.colorService = colorService;
this.libBackgroundColour = '';
this.currentColor = '';
}
ngOnInit() {
// Subscribe to color changes and update dynamically
this.colorSubscription = this.colorService.colors$.subscribe(() => {
this.applyColor();
});
// Initial color application
this.applyColor();
}
ngOnChanges(changes) {
if (changes['libBackgroundColour'] && !changes['libBackgroundColour'].firstChange) {
this.applyColor();
}
}
applyColor() {
if (!this.libBackgroundColour) {
console.warn('No background color variable specified');
return;
}
const newColor = this.colorService.getColor(this.libBackgroundColour);
if (newColor && newColor !== this.currentColor) {
this.currentColor = newColor;
this.el.nativeElement.style.backgroundColor = newColor;
}
}
ngOnDestroy() {
if (this.colorSubscription) {
this.colorSubscription.unsubscribe();
}
}
}
BackgroundColorDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: BackgroundColorDirective, deps: [{ token: i0.ElementRef }, { token: i1.ColourService }], target: i0.ɵɵFactoryTarget.Directive });
BackgroundColorDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "12.2.17", type: BackgroundColorDirective, selector: "[libBackgroundColour]", inputs: { libBackgroundColour: "libBackgroundColour" }, usesOnChanges: true, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.2.17", ngImport: i0, type: BackgroundColorDirective, decorators: [{
type: Directive,
args: [{
selector: '[libBackgroundColour]'
}]
}], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i1.ColourService }]; }, propDecorators: { libBackgroundColour: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFja2dyb3VuZC1jb2xvdXIuZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvZHluYW1pYy10aGVtZS1saWIvc3JjL2xpYi9kaXJlY3RpdmVzL2JhY2tncm91bmQtY29sb3VyLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFjLEtBQUssRUFBK0MsTUFBTSxlQUFlLENBQUM7OztBQU8xRyxNQUFNLE9BQU8sd0JBQXdCO0lBS25DLFlBQ1UsRUFBYyxFQUNkLFlBQTJCO1FBRDNCLE9BQUUsR0FBRixFQUFFLENBQVk7UUFDZCxpQkFBWSxHQUFaLFlBQVksQ0FBZTtRQU41Qix3QkFBbUIsR0FBVyxFQUFFLENBQUM7UUFFbEMsaUJBQVksR0FBVyxFQUFFLENBQUM7SUFLL0IsQ0FBQztJQUVKLFFBQVE7UUFDTixvREFBb0Q7UUFDcEQsSUFBSSxDQUFDLGlCQUFpQixHQUFHLElBQUksQ0FBQyxZQUFZLENBQUMsT0FBTyxDQUFDLFNBQVMsQ0FBQyxHQUFHLEVBQUU7WUFDaEUsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1FBQ3BCLENBQUMsQ0FBQyxDQUFDO1FBRUgsNEJBQTRCO1FBQzVCLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztJQUNwQixDQUFDO0lBRUQsV0FBVyxDQUFDLE9BQXNCO1FBQ2hDLElBQUksT0FBTyxDQUFDLHFCQUFxQixDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMscUJBQXFCLENBQUMsQ0FBQyxXQUFXLEVBQUU7WUFDakYsSUFBSSxDQUFDLFVBQVUsRUFBRSxDQUFDO1NBQ25CO0lBQ0gsQ0FBQztJQUVPLFVBQVU7UUFDaEIsSUFBSSxDQUFDLElBQUksQ0FBQyxtQkFBbUIsRUFBRTtZQUM3QixPQUFPLENBQUMsSUFBSSxDQUFDLHdDQUF3QyxDQUFDLENBQUM7WUFDdkQsT0FBTztTQUNSO1FBRUQsTUFBTSxRQUFRLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxRQUFRLENBQUMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLENBQUM7UUFDdEUsSUFBSSxRQUFRLElBQUksUUFBUSxLQUFLLElBQUksQ0FBQyxZQUFZLEVBQUU7WUFDOUMsSUFBSSxDQUFDLFlBQVksR0FBRyxRQUFRLENBQUM7WUFDN0IsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUMsS0FBSyxDQUFDLGVBQWUsR0FBRyxRQUFRLENBQUM7U0FDeEQ7SUFDSCxDQUFDO0lBRUQsV0FBVztRQUNULElBQUksSUFBSSxDQUFDLGlCQUFpQixFQUFFO1lBQzFCLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxXQUFXLEVBQUUsQ0FBQztTQUN0QztJQUNILENBQUM7O3NIQTNDVSx3QkFBd0I7MEdBQXhCLHdCQUF3Qjs0RkFBeEIsd0JBQXdCO2tCQUhwQyxTQUFTO21CQUFDO29CQUNULFFBQVEsRUFBRSx1QkFBdUI7aUJBQ2xDOzZIQUVVLG1CQUFtQjtzQkFBM0IsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IERpcmVjdGl2ZSwgRWxlbWVudFJlZiwgSW5wdXQsIE9uQ2hhbmdlcywgT25EZXN0cm95LCBPbkluaXQsIFNpbXBsZUNoYW5nZXMgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFN1YnNjcmlwdGlvbiB9IGZyb20gJ3J4anMnO1xuaW1wb3J0IHsgQ29sb3VyU2VydmljZSB9IGZyb20gJy4uL3NlcnZpY2VzL2NvbG91ci5zZXJ2aWNlJztcblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW2xpYkJhY2tncm91bmRDb2xvdXJdJ1xufSlcbmV4cG9ydCBjbGFzcyBCYWNrZ3JvdW5kQ29sb3JEaXJlY3RpdmUgaW1wbGVtZW50cyBPbkluaXQsIE9uQ2hhbmdlcywgT25EZXN0cm95IHtcbiAgQElucHV0KCkgbGliQmFja2dyb3VuZENvbG91cjogc3RyaW5nID0gJyc7XG4gIHByaXZhdGUgY29sb3JTdWJzY3JpcHRpb246IFN1YnNjcmlwdGlvbiB8IHVuZGVmaW5lZDtcbiAgcHJpdmF0ZSBjdXJyZW50Q29sb3I6IHN0cmluZyA9ICcnO1xuXG4gIGNvbnN0cnVjdG9yKFxuICAgIHByaXZhdGUgZWw6IEVsZW1lbnRSZWYsXG4gICAgcHJpdmF0ZSBjb2xvclNlcnZpY2U6IENvbG91clNlcnZpY2VcbiAgKSB7fVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIC8vIFN1YnNjcmliZSB0byBjb2xvciBjaGFuZ2VzIGFuZCB1cGRhdGUgZHluYW1pY2FsbHlcbiAgICB0aGlzLmNvbG9yU3Vic2NyaXB0aW9uID0gdGhpcy5jb2xvclNlcnZpY2UuY29sb3JzJC5zdWJzY3JpYmUoKCkgPT4ge1xuICAgICAgdGhpcy5hcHBseUNvbG9yKCk7XG4gICAgfSk7XG4gICAgXG4gICAgLy8gSW5pdGlhbCBjb2xvciBhcHBsaWNhdGlvblxuICAgIHRoaXMuYXBwbHlDb2xvcigpO1xuICB9XG5cbiAgbmdPbkNoYW5nZXMoY2hhbmdlczogU2ltcGxlQ2hhbmdlcyk6IHZvaWQge1xuICAgIGlmIChjaGFuZ2VzWydsaWJCYWNrZ3JvdW5kQ29sb3VyJ10gJiYgIWNoYW5nZXNbJ2xpYkJhY2tncm91bmRDb2xvdXInXS5maXJzdENoYW5nZSkge1xuICAgICAgdGhpcy5hcHBseUNvbG9yKCk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBhcHBseUNvbG9yKCk6IHZvaWQge1xuICAgIGlmICghdGhpcy5saWJCYWNrZ3JvdW5kQ29sb3VyKSB7XG4gICAgICBjb25zb2xlLndhcm4oJ05vIGJhY2tncm91bmQgY29sb3IgdmFyaWFibGUgc3BlY2lmaWVkJyk7XG4gICAgICByZXR1cm47XG4gICAgfVxuXG4gICAgY29uc3QgbmV3Q29sb3IgPSB0aGlzLmNvbG9yU2VydmljZS5nZXRDb2xvcih0aGlzLmxpYkJhY2tncm91bmRDb2xvdXIpO1xuICAgIGlmIChuZXdDb2xvciAmJiBuZXdDb2xvciAhPT0gdGhpcy5jdXJyZW50Q29sb3IpIHtcbiAgICAgIHRoaXMuY3VycmVudENvbG9yID0gbmV3Q29sb3I7XG4gICAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuc3R5bGUuYmFja2dyb3VuZENvbG9yID0gbmV3Q29sb3I7XG4gICAgfVxuICB9XG5cbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuY29sb3JTdWJzY3JpcHRpb24pIHtcbiAgICAgIHRoaXMuY29sb3JTdWJzY3JpcHRpb24udW5zdWJzY3JpYmUoKTtcbiAgICB9XG4gIH1cbn1cbiJdfQ==