@omnedia/ngx-shiny-text/fesm2022/omnedia-ngx-shiny-text.mjs

A simple component library to animate text.

import * as i1 from '@angular/common';
import { CommonModule } from '@angular/common';
import * as i0 from '@angular/core';
import { Component, Input } from '@angular/core';

class NgxShinyTextComponent {
    constructor() {
        this.style = {};
    }
    set shimmerColor(color) {
        this.style["--shimmer-color"] = color;
    }
    set textColor(color) {
        this.style["--text-color"] = color;
    }
    set shimmerWidth(width) {
        this.style["--shimmer-width"] = width;
    }
    ngOnInit() {
        if (!this.text) {
            throw new Error("om-shiny-text: no text was given to the component!");
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgxShinyTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.0.3", type: NgxShinyTextComponent, isStandalone: true, selector: "om-shiny-text", inputs: { styleClass: "styleClass", shimmerColor: "shimmerColor", textColor: "textColor", shimmerWidth: "shimmerWidth", text: "text" }, ngImport: i0, template: "<span class=\"om-shiny-text\" [ngStyle]=\"style\" [ngClass]=\"styleClass\">{{\n  text\n}}</span>\n", styles: [".om-shiny-text{--shimmer-width: 100px;--shimmer-color: rgba(0, 0, 0, .8);--text-color: rgba(82, 82, 82, .7);display:inline-flex;position:relative;background:linear-gradient(90deg,transparent,var(--shimmer-color) 50%,transparent);background-size:var(--shimmer-width) 100%;background-position:0 0;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;color:var(--text-color);animation:om-shimmer 8s infinite}@keyframes om-shimmer{0%,90%,to{background-position:calc(-100% - var(--shimmer-width)) 0}30%,60%{background-position:calc(100% + var(--shimmer-width)) 0}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.3", ngImport: i0, type: NgxShinyTextComponent, decorators: [{
            type: Component,
            args: [{ selector: "om-shiny-text", standalone: true, imports: [CommonModule], template: "<span class=\"om-shiny-text\" [ngStyle]=\"style\" [ngClass]=\"styleClass\">{{\n  text\n}}</span>\n", styles: [".om-shiny-text{--shimmer-width: 100px;--shimmer-color: rgba(0, 0, 0, .8);--text-color: rgba(82, 82, 82, .7);display:inline-flex;position:relative;background:linear-gradient(90deg,transparent,var(--shimmer-color) 50%,transparent);background-size:var(--shimmer-width) 100%;background-position:0 0;background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;color:var(--text-color);animation:om-shimmer 8s infinite}@keyframes om-shimmer{0%,90%,to{background-position:calc(-100% - var(--shimmer-width)) 0}30%,60%{background-position:calc(100% + var(--shimmer-width)) 0}}\n"] }]
        }], propDecorators: { styleClass: [{
                type: Input,
                args: ["styleClass"]
            }], shimmerColor: [{
                type: Input,
                args: ["shimmerColor"]
            }], textColor: [{
                type: Input,
                args: ["textColor"]
            }], shimmerWidth: [{
                type: Input,
                args: ["shimmerWidth"]
            }], text: [{
                type: Input,
                args: ["text"]
            }] } });

/*
 * Public API Surface of ngx-shiny-text
 */

/**
 * Generated bundle index. Do not edit.
 */

export { NgxShinyTextComponent };
//# sourceMappingURL=omnedia-ngx-shiny-text.mjs.map