@taiga-ui/kit
Version:
Taiga UI Angular main components kit
63 lines • 8.97 kB
JavaScript
import { Directive, inject, Input } from '@angular/core';
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
import { WaMutationObserverService, WA_MUTATION_OBSERVER_INIT, } from '@ng-web-apis/mutation-observer';
import { WaResizeObserverService } from '@ng-web-apis/resize-observer';
import { tuiZonefree } from '@taiga-ui/cdk/observables';
import { tuiInjectElement } from '@taiga-ui/cdk/utils/dom';
import { fromEvent, merge, Subject } from 'rxjs';
import { TUI_FLUID_TYPOGRAPHY_OPTIONS } from './fluid-typography.options';
import * as i0 from "@angular/core";
const STEP = 1 / 16;
class TuiFluidTypography {
constructor() {
// TODO: refactor to signal inputs after Angular update
this.changes$ = new Subject();
this.el = tuiInjectElement();
this.options = inject(TUI_FLUID_TYPOGRAPHY_OPTIONS);
this.sub = merge(this.changes$, inject(WaResizeObserverService, { self: true }), inject(WaMutationObserverService, { self: true }), fromEvent(this.el, 'input'))
.pipe(tuiZonefree(), takeUntilDestroyed())
.subscribe(() => {
const min = Number(this.tuiFluidTypography[0] || this.options.min);
const max = Number(this.tuiFluidTypography[1] || this.options.max);
for (let i = max; i >= min; i -= STEP) {
this.el.style.fontSize = `calc(${i}rem + var(--tui-font-offset))`;
if (this.el.scrollWidth <= this.el.clientWidth) {
break;
}
}
});
this.tuiFluidTypography = '';
}
ngOnChanges() {
this.changes$.next();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiFluidTypography, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.12", type: TuiFluidTypography, isStandalone: true, selector: "[tuiFluidTypography]", inputs: { tuiFluidTypography: "tuiFluidTypography" }, host: { attributes: { "tuiFluidTypography": "" } }, providers: [
WaResizeObserverService,
WaMutationObserverService,
{
provide: WA_MUTATION_OBSERVER_INIT,
useValue: { characterData: true, subtree: true },
},
], usesOnChanges: true, ngImport: i0 }); }
}
export { TuiFluidTypography };
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.12", ngImport: i0, type: TuiFluidTypography, decorators: [{
type: Directive,
args: [{
standalone: true,
selector: '[tuiFluidTypography]',
providers: [
WaResizeObserverService,
WaMutationObserverService,
{
provide: WA_MUTATION_OBSERVER_INIT,
useValue: { characterData: true, subtree: true },
},
],
host: { tuiFluidTypography: '' },
}]
}], propDecorators: { tuiFluidTypography: [{
type: Input
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmx1aWQtdHlwb2dyYXBoeS5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9raXQvZGlyZWN0aXZlcy9mbHVpZC10eXBvZ3JhcGh5L2ZsdWlkLXR5cG9ncmFwaHkuZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBQyxTQUFTLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBaUIsTUFBTSxlQUFlLENBQUM7QUFDdkUsT0FBTyxFQUFDLGtCQUFrQixFQUFDLE1BQU0sNEJBQTRCLENBQUM7QUFDOUQsT0FBTyxFQUNILHlCQUF5QixFQUN6Qix5QkFBeUIsR0FDNUIsTUFBTSxnQ0FBZ0MsQ0FBQztBQUN4QyxPQUFPLEVBQUMsdUJBQXVCLEVBQUMsTUFBTSw4QkFBOEIsQ0FBQztBQUNyRSxPQUFPLEVBQUMsV0FBVyxFQUFDLE1BQU0sMkJBQTJCLENBQUM7QUFDdEQsT0FBTyxFQUFDLGdCQUFnQixFQUFDLE1BQU0seUJBQXlCLENBQUM7QUFDekQsT0FBTyxFQUFDLFNBQVMsRUFBRSxLQUFLLEVBQUUsT0FBTyxFQUFDLE1BQU0sTUFBTSxDQUFDO0FBRS9DLE9BQU8sRUFBQyw0QkFBNEIsRUFBQyxNQUFNLDRCQUE0QixDQUFDOztBQUV4RSxNQUFNLElBQUksR0FBRyxDQUFDLEdBQUcsRUFBRSxDQUFDO0FBRXBCLE1BYWEsa0JBQWtCO0lBYi9CO1FBY0ksdURBQXVEO1FBQ3RDLGFBQVEsR0FBRyxJQUFJLE9BQU8sRUFBUSxDQUFDO1FBQy9CLE9BQUUsR0FBRyxnQkFBZ0IsRUFBRSxDQUFDO1FBQ3hCLFlBQU8sR0FBRyxNQUFNLENBQUMsNEJBQTRCLENBQUMsQ0FBQztRQUU3QyxRQUFHLEdBQUcsS0FBSyxDQUMxQixJQUFJLENBQUMsUUFBUSxFQUNiLE1BQU0sQ0FBQyx1QkFBdUIsRUFBRSxFQUFDLElBQUksRUFBRSxJQUFJLEVBQUMsQ0FBQyxFQUM3QyxNQUFNLENBQUMseUJBQXlCLEVBQUUsRUFBQyxJQUFJLEVBQUUsSUFBSSxFQUFDLENBQUMsRUFDL0MsU0FBUyxDQUFDLElBQUksQ0FBQyxFQUFFLEVBQUUsT0FBTyxDQUFDLENBQzlCO2FBQ0ksSUFBSSxDQUFDLFdBQVcsRUFBRSxFQUFFLGtCQUFrQixFQUFFLENBQUM7YUFDekMsU0FBUyxDQUFDLEdBQUcsRUFBRTtZQUNaLE1BQU0sR0FBRyxHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUMsa0JBQWtCLENBQUMsQ0FBQyxDQUFDLElBQUksSUFBSSxDQUFDLE9BQU8sQ0FBQyxHQUFHLENBQUMsQ0FBQztZQUNuRSxNQUFNLEdBQUcsR0FBRyxNQUFNLENBQUMsSUFBSSxDQUFDLGtCQUFrQixDQUFDLENBQUMsQ0FBQyxJQUFJLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLENBQUM7WUFFbkUsS0FBSyxJQUFJLENBQUMsR0FBRyxHQUFHLEVBQUUsQ0FBQyxJQUFJLEdBQUcsRUFBRSxDQUFDLElBQUksSUFBSSxFQUFFO2dCQUNuQyxJQUFJLENBQUMsRUFBRSxDQUFDLEtBQUssQ0FBQyxRQUFRLEdBQUcsUUFBUSxDQUFDLCtCQUErQixDQUFDO2dCQUVsRSxJQUFJLElBQUksQ0FBQyxFQUFFLENBQUMsV0FBVyxJQUFJLElBQUksQ0FBQyxFQUFFLENBQUMsV0FBVyxFQUFFO29CQUM1QyxNQUFNO2lCQUNUO2FBQ0o7UUFDTCxDQUFDLENBQUMsQ0FBQztRQUdBLHVCQUFrQixHQUE2QyxFQUFFLENBQUM7S0FLNUU7SUFIVSxXQUFXO1FBQ2QsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLEVBQUUsQ0FBQztJQUN6QixDQUFDOytHQS9CUSxrQkFBa0I7bUdBQWxCLGtCQUFrQiw2S0FWaEI7WUFDUCx1QkFBdUI7WUFDdkIseUJBQXlCO1lBQ3pCO2dCQUNJLE9BQU8sRUFBRSx5QkFBeUI7Z0JBQ2xDLFFBQVEsRUFBRSxFQUFDLGFBQWEsRUFBRSxJQUFJLEVBQUUsT0FBTyxFQUFFLElBQUksRUFBQzthQUNqRDtTQUNKOztTQUdRLGtCQUFrQjs0RkFBbEIsa0JBQWtCO2tCQWI5QixTQUFTO21CQUFDO29CQUNQLFVBQVUsRUFBRSxJQUFJO29CQUNoQixRQUFRLEVBQUUsc0JBQXNCO29CQUNoQyxTQUFTLEVBQUU7d0JBQ1AsdUJBQXVCO3dCQUN2Qix5QkFBeUI7d0JBQ3pCOzRCQUNJLE9BQU8sRUFBRSx5QkFBeUI7NEJBQ2xDLFFBQVEsRUFBRSxFQUFDLGFBQWEsRUFBRSxJQUFJLEVBQUUsT0FBTyxFQUFFLElBQUksRUFBQzt5QkFDakQ7cUJBQ0o7b0JBQ0QsSUFBSSxFQUFFLEVBQUMsa0JBQWtCLEVBQUUsRUFBRSxFQUFDO2lCQUNqQzs4QkE0QlUsa0JBQWtCO3NCQUR4QixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtEaXJlY3RpdmUsIGluamVjdCwgSW5wdXQsIHR5cGUgT25DaGFuZ2VzfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7dGFrZVVudGlsRGVzdHJveWVkfSBmcm9tICdAYW5ndWxhci9jb3JlL3J4anMtaW50ZXJvcCc7XG5pbXBvcnQge1xuICAgIFdhTXV0YXRpb25PYnNlcnZlclNlcnZpY2UsXG4gICAgV0FfTVVUQVRJT05fT0JTRVJWRVJfSU5JVCxcbn0gZnJvbSAnQG5nLXdlYi1hcGlzL211dGF0aW9uLW9ic2VydmVyJztcbmltcG9ydCB7V2FSZXNpemVPYnNlcnZlclNlcnZpY2V9IGZyb20gJ0BuZy13ZWItYXBpcy9yZXNpemUtb2JzZXJ2ZXInO1xuaW1wb3J0IHt0dWlab25lZnJlZX0gZnJvbSAnQHRhaWdhLXVpL2Nkay9vYnNlcnZhYmxlcyc7XG5pbXBvcnQge3R1aUluamVjdEVsZW1lbnR9IGZyb20gJ0B0YWlnYS11aS9jZGsvdXRpbHMvZG9tJztcbmltcG9ydCB7ZnJvbUV2ZW50LCBtZXJnZSwgU3ViamVjdH0gZnJvbSAncnhqcyc7XG5cbmltcG9ydCB7VFVJX0ZMVUlEX1RZUE9HUkFQSFlfT1BUSU9OU30gZnJvbSAnLi9mbHVpZC10eXBvZ3JhcGh5Lm9wdGlvbnMnO1xuXG5jb25zdCBTVEVQID0gMSAvIDE2O1xuXG5ARGlyZWN0aXZlKHtcbiAgICBzdGFuZGFsb25lOiB0cnVlLFxuICAgIHNlbGVjdG9yOiAnW3R1aUZsdWlkVHlwb2dyYXBoeV0nLFxuICAgIHByb3ZpZGVyczogW1xuICAgICAgICBXYVJlc2l6ZU9ic2VydmVyU2VydmljZSxcbiAgICAgICAgV2FNdXRhdGlvbk9ic2VydmVyU2VydmljZSxcbiAgICAgICAge1xuICAgICAgICAgICAgcHJvdmlkZTogV0FfTVVUQVRJT05fT0JTRVJWRVJfSU5JVCxcbiAgICAgICAgICAgIHVzZVZhbHVlOiB7Y2hhcmFjdGVyRGF0YTogdHJ1ZSwgc3VidHJlZTogdHJ1ZX0sXG4gICAgICAgIH0sXG4gICAgXSxcbiAgICBob3N0OiB7dHVpRmx1aWRUeXBvZ3JhcGh5OiAnJ30sXG59KVxuZXhwb3J0IGNsYXNzIFR1aUZsdWlkVHlwb2dyYXBoeSBpbXBsZW1lbnRzIE9uQ2hhbmdlcyB7XG4gICAgLy8gVE9ETzogcmVmYWN0b3IgdG8gc2lnbmFsIGlucHV0cyBhZnRlciBBbmd1bGFyIHVwZGF0ZVxuICAgIHByaXZhdGUgcmVhZG9ubHkgY2hhbmdlcyQgPSBuZXcgU3ViamVjdDx2b2lkPigpO1xuICAgIHByaXZhdGUgcmVhZG9ubHkgZWwgPSB0dWlJbmplY3RFbGVtZW50KCk7XG4gICAgcHJpdmF0ZSByZWFkb25seSBvcHRpb25zID0gaW5qZWN0KFRVSV9GTFVJRF9UWVBPR1JBUEhZX09QVElPTlMpO1xuXG4gICAgcHJvdGVjdGVkIHJlYWRvbmx5IHN1YiA9IG1lcmdlKFxuICAgICAgICB0aGlzLmNoYW5nZXMkLFxuICAgICAgICBpbmplY3QoV2FSZXNpemVPYnNlcnZlclNlcnZpY2UsIHtzZWxmOiB0cnVlfSksXG4gICAgICAgIGluamVjdChXYU11dGF0aW9uT2JzZXJ2ZXJTZXJ2aWNlLCB7c2VsZjogdHJ1ZX0pLFxuICAgICAgICBmcm9tRXZlbnQodGhpcy5lbCwgJ2lucHV0JyksXG4gICAgKVxuICAgICAgICAucGlwZSh0dWlab25lZnJlZSgpLCB0YWtlVW50aWxEZXN0cm95ZWQoKSlcbiAgICAgICAgLnN1YnNjcmliZSgoKSA9PiB7XG4gICAgICAgICAgICBjb25zdCBtaW4gPSBOdW1iZXIodGhpcy50dWlGbHVpZFR5cG9ncmFwaHlbMF0gfHwgdGhpcy5vcHRpb25zLm1pbik7XG4gICAgICAgICAgICBjb25zdCBtYXggPSBOdW1iZXIodGhpcy50dWlGbHVpZFR5cG9ncmFwaHlbMV0gfHwgdGhpcy5vcHRpb25zLm1heCk7XG5cbiAgICAgICAgICAgIGZvciAobGV0IGkgPSBtYXg7IGkgPj0gbWluOyBpIC09IFNURVApIHtcbiAgICAgICAgICAgICAgICB0aGlzLmVsLnN0eWxlLmZvbnRTaXplID0gYGNhbGMoJHtpfXJlbSArIHZhcigtLXR1aS1mb250LW9mZnNldCkpYDtcblxuICAgICAgICAgICAgICAgIGlmICh0aGlzLmVsLnNjcm9sbFdpZHRoIDw9IHRoaXMuZWwuY2xpZW50V2lkdGgpIHtcbiAgICAgICAgICAgICAgICAgICAgYnJlYWs7XG4gICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgfVxuICAgICAgICB9KTtcblxuICAgIEBJbnB1dCgpXG4gICAgcHVibGljIHR1aUZsdWlkVHlwb2dyYXBoeTogcmVhZG9ubHkgW21pbjogbnVtYmVyLCBtYXg6IG51bWJlcl0gfCAnJyA9ICcnO1xuXG4gICAgcHVibGljIG5nT25DaGFuZ2VzKCk6IHZvaWQge1xuICAgICAgICB0aGlzLmNoYW5nZXMkLm5leHQoKTtcbiAgICB9XG59XG4iXX0=