@ngx-easy-i18n-js/bootstrap
Version:
Bootstrap for ngx-easy-i18n-js
95 lines (90 loc) • 13.8 kB
JavaScript
import * as i0 from '@angular/core';
import { InjectionToken, Injector, ViewChild, Inject, Component, NgModule } from '@angular/core';
import * as i2 from '@angular/cdk/portal';
import { ComponentPortal, CdkPortalOutlet, PortalModule } from '@angular/cdk/portal';
import { tap } from 'rxjs/operators';
import * as i1 from '@ngx-easy-i18n-js/core';
import * as i3 from '@angular/common';
import { CommonModule } from '@angular/common';
const BOOTSTRAP = new InjectionToken('BOOTSTRAP');
const LOADING_COMPONENT = new InjectionToken('LOADING_COMPONENT');
class EasyI18nBootstrapComponent {
constructor(injector, bootstrap, loadingComponent, easyI18nService) {
this.injector = injector;
this.bootstrap = bootstrap;
this.loadingComponent = loadingComponent;
this.easyI18nService = easyI18nService;
}
ngOnInit() {
const injector = Injector.create({
providers: [],
parent: this.injector
});
this.loadingPortal = this.loadingComponent != null ?
new ComponentPortal(this.loadingComponent, undefined, injector) : null;
const bootstrapPortal = new ComponentPortal(this.bootstrap, undefined, injector);
this.localeStatus$ = this.easyI18nService.localeStatus$.pipe(tap(res => {
if (res === 'ready') {
if (this.containerRef != null) {
this.portalOutlet?.detach();
this.containerRef = null;
}
this.containerRef = this.portalOutlet?.attachComponentPortal(bootstrapPortal);
}
}));
}
ngOnDestroy() {
this.portalOutlet?.dispose();
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EasyI18nBootstrapComponent, deps: [{ token: i0.Injector }, { token: BOOTSTRAP }, { token: LOADING_COMPONENT }, { token: i1.EasyI18nService }], target: i0.ɵɵFactoryTarget.Component }); }
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: EasyI18nBootstrapComponent, isStandalone: false, selector: "ngx-easy-i18n", viewQueries: [{ propertyName: "portalOutlet", first: true, predicate: CdkPortalOutlet, descendants: true, static: true }], ngImport: i0, template: "<ng-template cdkPortalOutlet></ng-template>\n@let localeStatus = localeStatus$ | async;\n@if (localeStatus) {\n @if (localeStatus === 'loading') {\n <div style=\"pointer-events: all; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 10000;\">\n @if (loadingPortal) {\n <ng-template [cdkPortalOutlet]=\"loadingPortal\"></ng-template>\n } @else {\n <div style=\"display: grid; height: 100vh; place-content: center; background-color: #FFFFFF77\">\n <div style=\"font-weight: 300; font-size: 3.5rem; line-height: 1.2;\">Loading languages...</div>\n <div style=\"text-align: center;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n style=\"margin: auto; background: rgba(0, 0, 0, 0); display: block; shape-rendering: auto;\" width=\"100px\"\n height=\"100px\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"xMidYMid\">\n <rect x=\"19\" y=\"19\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"40\" y=\"19\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.125s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"61\" y=\"19\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.25s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"19\" y=\"40\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.875s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"61\" y=\"40\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.375s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"19\" y=\"61\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.75s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"40\" y=\"61\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.625s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"61\" y=\"61\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.5s\" calcMode=\"discrete\"></animate>\n </rect>\n </svg>\n </div>\n </div>\n }\n </div>\n }\n}", dependencies: [{ kind: "directive", type: i2.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "pipe", type: i3.AsyncPipe, name: "async" }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EasyI18nBootstrapComponent, decorators: [{
type: Component,
args: [{ selector: 'ngx-easy-i18n', standalone: false, template: "<ng-template cdkPortalOutlet></ng-template>\n@let localeStatus = localeStatus$ | async;\n@if (localeStatus) {\n @if (localeStatus === 'loading') {\n <div style=\"pointer-events: all; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 10000;\">\n @if (loadingPortal) {\n <ng-template [cdkPortalOutlet]=\"loadingPortal\"></ng-template>\n } @else {\n <div style=\"display: grid; height: 100vh; place-content: center; background-color: #FFFFFF77\">\n <div style=\"font-weight: 300; font-size: 3.5rem; line-height: 1.2;\">Loading languages...</div>\n <div style=\"text-align: center;\">\n <svg xmlns=\"http://www.w3.org/2000/svg\"\n style=\"margin: auto; background: rgba(0, 0, 0, 0); display: block; shape-rendering: auto;\" width=\"100px\"\n height=\"100px\" viewBox=\"0 0 100 100\" preserveAspectRatio=\"xMidYMid\">\n <rect x=\"19\" y=\"19\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"40\" y=\"19\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.125s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"61\" y=\"19\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.25s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"19\" y=\"40\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.875s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"61\" y=\"40\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.375s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"19\" y=\"61\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.75s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"40\" y=\"61\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.625s\" calcMode=\"discrete\"></animate>\n </rect>\n <rect x=\"61\" y=\"61\" width=\"20\" height=\"20\" rx=\"5\" ry=\"5\" fill=\"#1d3f72\">\n <animate attributeName=\"fill\" values=\"#5699d2;#1d3f72;#1d3f72\" keyTimes=\"0;0.125;1\" dur=\"1s\"\n repeatCount=\"indefinite\" begin=\"0.5s\" calcMode=\"discrete\"></animate>\n </rect>\n </svg>\n </div>\n </div>\n }\n </div>\n }\n}" }]
}], ctorParameters: () => [{ type: i0.Injector }, { type: undefined, decorators: [{
type: Inject,
args: [BOOTSTRAP]
}] }, { type: undefined, decorators: [{
type: Inject,
args: [LOADING_COMPONENT]
}] }, { type: i1.EasyI18nService }], propDecorators: { portalOutlet: [{
type: ViewChild,
args: [CdkPortalOutlet, { static: true }]
}] } });
class EasyI18nBootstrapModule {
static forRoot(config) {
return {
ngModule: EasyI18nBootstrapModule,
providers: [
{ provide: BOOTSTRAP, useValue: config.bootstrap },
{ provide: LOADING_COMPONENT, useValue: config.loadingComponent }
]
};
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EasyI18nBootstrapModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.7", ngImport: i0, type: EasyI18nBootstrapModule, declarations: [EasyI18nBootstrapComponent], imports: [CommonModule,
PortalModule], exports: [EasyI18nBootstrapComponent] }); }
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EasyI18nBootstrapModule, imports: [CommonModule,
PortalModule] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: EasyI18nBootstrapModule, decorators: [{
type: NgModule,
args: [{
imports: [
CommonModule,
PortalModule
],
declarations: [
EasyI18nBootstrapComponent
],
exports: [
EasyI18nBootstrapComponent
]
}]
}] });
/**
* Generated bundle index. Do not edit.
*/
export { BOOTSTRAP, EasyI18nBootstrapComponent, EasyI18nBootstrapModule, LOADING_COMPONENT };
//# sourceMappingURL=ngx-easy-i18n-js-bootstrap.mjs.map