@alauda-fe/common
Version:
Alauda frontend team common codes.
137 lines (136 loc) • 13.6 kB
JavaScript
import { NgIf, NgTemplateOutlet } from '@angular/common';
import { Component, ElementRef, ChangeDetectionStrategy, Directive, ContentChild, TemplateRef, signal, Input, } from '@angular/core';
import { LoadingMaskComponent } from '../widget/loading-mask/loading-mask.component';
import { VisibilityService } from './visibility.service';
import * as i0 from "@angular/core";
import * as i1 from "./visibility.service";
function LazyComponent_ng_container_0_ng_container_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementContainer(0, 4);
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext(2);
i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.template);
} }
function LazyComponent_ng_container_0_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementContainerStart(0);
i0.ɵɵtemplate(1, LazyComponent_ng_container_0_ng_container_1_Template, 1, 1, "ng-container", 3);
i0.ɵɵelementContainerEnd();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵadvance();
i0.ɵɵproperty("ngIf", ctx_r0.template);
} }
function LazyComponent_ng_template_1_ng_container_0_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementContainerStart(0);
i0.ɵɵelementContainer(1, 4);
i0.ɵɵelementContainerEnd();
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext(2);
i0.ɵɵadvance();
i0.ɵɵproperty("ngTemplateOutlet", ctx_r0.placeholder);
} }
function LazyComponent_ng_template_1_ng_template_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelement(0, "acl-loading-mask", 5);
} if (rf & 2) {
const ctx_r0 = i0.ɵɵnextContext(2);
i0.ɵɵproperty("loading", !ctx_r0.$$isVisible());
} }
function LazyComponent_ng_template_1_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵtemplate(0, LazyComponent_ng_template_1_ng_container_0_Template, 2, 1, "ng-container", 2)(1, LazyComponent_ng_template_1_ng_template_1_Template, 1, 1, "ng-template", null, 1, i0.ɵɵtemplateRefExtractor);
} if (rf & 2) {
const defaultLoadingTemplate_r2 = i0.ɵɵreference(2);
const ctx_r0 = i0.ɵɵnextContext();
i0.ɵɵproperty("ngIf", ctx_r0.placeholder)("ngIfElse", defaultLoadingTemplate_r2);
} }
export class LazyContentDirective {
static { this.ɵfac = function LazyContentDirective_Factory(t) { return new (t || LazyContentDirective)(); }; }
static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: LazyContentDirective, selectors: [["", "aclLazyContent", ""]], standalone: true }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LazyContentDirective, [{
type: Directive,
args: [{
selector: '[aclLazyContent]',
standalone: true,
}]
}], null, null); })();
export class LazyPlaceholderDirective {
static { this.ɵfac = function LazyPlaceholderDirective_Factory(t) { return new (t || LazyPlaceholderDirective)(); }; }
static { this.ɵdir = /*@__PURE__*/ i0.ɵɵdefineDirective({ type: LazyPlaceholderDirective, selectors: [["", "aclLazyPlaceholder", ""]], standalone: true }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LazyPlaceholderDirective, [{
type: Directive,
args: [{
selector: '[aclLazyPlaceholder]',
standalone: true,
}]
}], null, null); })();
export class LazyComponent {
constructor(el, visibilityService) {
this.el = el;
this.visibilityService = visibilityService;
this.$$isVisible = signal(false);
this.destroyOnHide = false;
}
ngOnInit() {
this.subscription = this.visibilityService
.observe(this.el)
.subscribe(isVisible => {
this.$$isVisible.set(isVisible);
if (!isVisible && this.destroyOnHide) {
this.template = null;
this.placeholder = null;
}
});
}
ngOnDestroy() {
if (this.subscription) {
this.subscription.unsubscribe();
}
this.visibilityService.unobserve(this.el);
}
static { this.ɵfac = function LazyComponent_Factory(t) { return new (t || LazyComponent)(i0.ɵɵdirectiveInject(i0.ElementRef), i0.ɵɵdirectiveInject(i1.VisibilityService)); }; }
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LazyComponent, selectors: [["acl-lazy-component"]], contentQueries: function LazyComponent_ContentQueries(rf, ctx, dirIndex) { if (rf & 1) {
i0.ɵɵcontentQuery(dirIndex, LazyContentDirective, 5, TemplateRef);
i0.ɵɵcontentQuery(dirIndex, LazyPlaceholderDirective, 5, TemplateRef);
} if (rf & 2) {
let _t;
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.template = _t.first);
i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.placeholder = _t.first);
} }, inputs: { destroyOnHide: "destroyOnHide" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 3, vars: 2, consts: [["loadingTemplate", ""], ["defaultLoadingTemplate", ""], [4, "ngIf", "ngIfElse"], [3, "ngTemplateOutlet", 4, "ngIf"], [3, "ngTemplateOutlet"], [1, "!tw-flex", "tw-h-full", "tw-items-center", "tw-justify-center", 3, "loading"]], template: function LazyComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵtemplate(0, LazyComponent_ng_container_0_Template, 2, 1, "ng-container", 2)(1, LazyComponent_ng_template_1_Template, 3, 2, "ng-template", null, 0, i0.ɵɵtemplateRefExtractor);
} if (rf & 2) {
const loadingTemplate_r3 = i0.ɵɵreference(2);
i0.ɵɵproperty("ngIf", ctx.$$isVisible())("ngIfElse", loadingTemplate_r3);
} }, dependencies: [NgIf, LoadingMaskComponent, NgTemplateOutlet], styles: ["[_nghost-%COMP%]{width:100%;height:100%}"], changeDetection: 0 }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LazyComponent, [{
type: Component,
args: [{ selector: 'acl-lazy-component', template: `
<ng-container *ngIf="$$isVisible(); else loadingTemplate">
<ng-container
*ngIf="template"
[ngTemplateOutlet]="template"
></ng-container>
</ng-container>
<ng-template #loadingTemplate>
<ng-container *ngIf="placeholder; else defaultLoadingTemplate">
<ng-container [ngTemplateOutlet]="placeholder"></ng-container>
</ng-container>
<ng-template #defaultLoadingTemplate>
<acl-loading-mask
class="!tw-flex tw-h-full tw-items-center tw-justify-center"
[loading]="!$$isVisible()"
></acl-loading-mask>
</ng-template>
</ng-template>
`, standalone: true, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgIf, LoadingMaskComponent, NgTemplateOutlet], styles: [":host{width:100%;height:100%}\n"] }]
}], () => [{ type: i0.ElementRef }, { type: i1.VisibilityService }], { template: [{
type: ContentChild,
args: [LazyContentDirective, { read: TemplateRef }]
}], placeholder: [{
type: ContentChild,
args: [LazyPlaceholderDirective, { read: TemplateRef }]
}], destroyOnHide: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LazyComponent, { className: "LazyComponent" }); })();
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGF6eS1sb2FkLWNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL2xpYnMvY29tbW9uL3NyYy9sYXp5LWNvbXBvbmVudC9sYXp5LWxvYWQtY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxJQUFJLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUN6RCxPQUFPLEVBQ0wsU0FBUyxFQUNULFVBQVUsRUFHVix1QkFBdUIsRUFDdkIsU0FBUyxFQUNULFlBQVksRUFDWixXQUFXLEVBQ1gsTUFBTSxFQUNOLEtBQUssR0FDTixNQUFNLGVBQWUsQ0FBQztBQUd2QixPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSwrQ0FBK0MsQ0FBQztBQUVyRixPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxzQkFBc0IsQ0FBQzs7OztJQWtCbkQsMkJBR2dCOzs7SUFEZCxrREFBNkI7OztJQUhqQyw2QkFBMEQ7SUFDeEQsK0ZBR0M7Ozs7SUFGRSxjQUFjO0lBQWQsc0NBQWM7OztJQU1qQiw2QkFBK0Q7SUFDN0QsMkJBQThEOzs7O0lBQWhELGNBQWdDO0lBQWhDLHFEQUFnQzs7O0lBRzlDLHNDQUdvQjs7O0lBRGxCLCtDQUEwQjs7O0lBSDlCLEFBSEEsOEZBQStELGdIQUcxQjs7OztJQUhILEFBQW5CLHlDQUFtQix1Q0FBMkI7O0FBbkJuRSxNQUFNLE9BQU8sb0JBQW9CO3FGQUFwQixvQkFBb0I7b0VBQXBCLG9CQUFvQjs7aUZBQXBCLG9CQUFvQjtjQUpoQyxTQUFTO2VBQUM7Z0JBQ1QsUUFBUSxFQUFFLGtCQUFrQjtnQkFDNUIsVUFBVSxFQUFFLElBQUk7YUFDakI7O0FBT0QsTUFBTSxPQUFPLHdCQUF3Qjt5RkFBeEIsd0JBQXdCO29FQUF4Qix3QkFBd0I7O2lGQUF4Qix3QkFBd0I7Y0FKcEMsU0FBUztlQUFDO2dCQUNULFFBQVEsRUFBRSxzQkFBc0I7Z0JBQ2hDLFVBQVUsRUFBRSxJQUFJO2FBQ2pCOztBQXFDRCxNQUFNLE9BQU8sYUFBYTtJQWF4QixZQUNtQixFQUFjLEVBQ2QsaUJBQW9DO1FBRHBDLE9BQUUsR0FBRixFQUFFLENBQVk7UUFDZCxzQkFBaUIsR0FBakIsaUJBQWlCLENBQW1CO1FBZHZELGdCQUFXLEdBQUcsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDO1FBUW5CLGtCQUFhLEdBQUcsS0FBSyxDQUFDO0lBTzVCLENBQUM7SUFFSixRQUFRO1FBQ04sSUFBSSxDQUFDLFlBQVksR0FBRyxJQUFJLENBQUMsaUJBQWlCO2FBQ3ZDLE9BQU8sQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDO2FBQ2hCLFNBQVMsQ0FBQyxTQUFTLENBQUMsRUFBRTtZQUNyQixJQUFJLENBQUMsV0FBVyxDQUFDLEdBQUcsQ0FBQyxTQUFTLENBQUMsQ0FBQztZQUNoQyxJQUFJLENBQUMsU0FBUyxJQUFJLElBQUksQ0FBQyxhQUFhLEVBQUUsQ0FBQztnQkFDckMsSUFBSSxDQUFDLFFBQVEsR0FBRyxJQUFJLENBQUM7Z0JBQ3JCLElBQUksQ0FBQyxXQUFXLEdBQUcsSUFBSSxDQUFDO1lBQzFCLENBQUM7UUFDSCxDQUFDLENBQUMsQ0FBQztJQUNQLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxJQUFJLENBQUMsWUFBWSxFQUFFLENBQUM7WUFDdEIsSUFBSSxDQUFDLFlBQVksQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUNsQyxDQUFDO1FBQ0QsSUFBSSxDQUFDLGlCQUFpQixDQUFDLFNBQVMsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDLENBQUM7SUFDNUMsQ0FBQzs4RUFuQ1UsYUFBYTtvRUFBYixhQUFhO3dDQUdWLG9CQUFvQixLQUFVLFdBQVc7d0NBR3pDLHdCQUF3QixLQUFVLFdBQVc7Ozs7OztZQTlCekQsQUFQQSxnRkFBMEQsa0dBTzVCOzs7WUFQTSxBQUFyQix3Q0FBcUIsZ0NBQW9COzRCQTZCaEQsSUFBSSxFQUFFLG9CQUFvQixFQUFFLGdCQUFnQjs7aUZBRTNDLGFBQWE7Y0FsQ3pCLFNBQVM7MkJBQ0Usb0JBQW9CLFlBQ3BCOzs7Ozs7Ozs7Ozs7Ozs7Ozs7O0dBbUJULGNBU1csSUFBSSxtQkFDQyx1QkFBdUIsQ0FBQyxNQUFNLFdBQ3RDLENBQUMsSUFBSSxFQUFFLG9CQUFvQixFQUFFLGdCQUFnQixDQUFDOzJFQU12RCxRQUFRO2tCQURQLFlBQVk7bUJBQUMsb0JBQW9CLEVBQUUsRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFO1lBSXpELFdBQVc7a0JBRFYsWUFBWTttQkFBQyx3QkFBd0IsRUFBRSxFQUFFLElBQUksRUFBRSxXQUFXLEVBQUU7WUFHcEQsYUFBYTtrQkFBckIsS0FBSzs7a0ZBVEssYUFBYSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nSWYsIE5nVGVtcGxhdGVPdXRsZXQgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBFbGVtZW50UmVmLFxuICBPbkluaXQsXG4gIE9uRGVzdHJveSxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIERpcmVjdGl2ZSxcbiAgQ29udGVudENoaWxkLFxuICBUZW1wbGF0ZVJlZixcbiAgc2lnbmFsLFxuICBJbnB1dCxcbn0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBTdWJzY3JpcHRpb24gfSBmcm9tICdyeGpzJztcblxuaW1wb3J0IHsgTG9hZGluZ01hc2tDb21wb25lbnQgfSBmcm9tICcuLi93aWRnZXQvbG9hZGluZy1tYXNrL2xvYWRpbmctbWFzay5jb21wb25lbnQnO1xuXG5pbXBvcnQgeyBWaXNpYmlsaXR5U2VydmljZSB9IGZyb20gJy4vdmlzaWJpbGl0eS5zZXJ2aWNlJztcblxuQERpcmVjdGl2ZSh7XG4gIHNlbGVjdG9yOiAnW2FjbExhenlDb250ZW50XScsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG59KVxuZXhwb3J0IGNsYXNzIExhenlDb250ZW50RGlyZWN0aXZlIHt9XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ1thY2xMYXp5UGxhY2Vob2xkZXJdJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbn0pXG5leHBvcnQgY2xhc3MgTGF6eVBsYWNlaG9sZGVyRGlyZWN0aXZlIHt9XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ2FjbC1sYXp5LWNvbXBvbmVudCcsXG4gIHRlbXBsYXRlOiBgXG4gICAgPG5nLWNvbnRhaW5lciAqbmdJZj1cIiQkaXNWaXNpYmxlKCk7IGVsc2UgbG9hZGluZ1RlbXBsYXRlXCI+XG4gICAgICA8bmctY29udGFpbmVyXG4gICAgICAgICpuZ0lmPVwidGVtcGxhdGVcIlxuICAgICAgICBbbmdUZW1wbGF0ZU91dGxldF09XCJ0ZW1wbGF0ZVwiXG4gICAgICA+PC9uZy1jb250YWluZXI+XG4gICAgPC9uZy1jb250YWluZXI+XG5cbiAgICA8bmctdGVtcGxhdGUgI2xvYWRpbmdUZW1wbGF0ZT5cbiAgICAgIDxuZy1jb250YWluZXIgKm5nSWY9XCJwbGFjZWhvbGRlcjsgZWxzZSBkZWZhdWx0TG9hZGluZ1RlbXBsYXRlXCI+XG4gICAgICAgIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwicGxhY2Vob2xkZXJcIj48L25nLWNvbnRhaW5lcj5cbiAgICAgIDwvbmctY29udGFpbmVyPlxuICAgICAgPG5nLXRlbXBsYXRlICNkZWZhdWx0TG9hZGluZ1RlbXBsYXRlPlxuICAgICAgICA8YWNsLWxvYWRpbmctbWFza1xuICAgICAgICAgIGNsYXNzPVwiIXR3LWZsZXggdHctaC1mdWxsIHR3LWl0ZW1zLWNlbnRlciB0dy1qdXN0aWZ5LWNlbnRlclwiXG4gICAgICAgICAgW2xvYWRpbmddPVwiISQkaXNWaXNpYmxlKClcIlxuICAgICAgICA+PC9hY2wtbG9hZGluZy1tYXNrPlxuICAgICAgPC9uZy10ZW1wbGF0ZT5cbiAgICA8L25nLXRlbXBsYXRlPlxuICBgLFxuICBzdHlsZXM6IFtcbiAgICBgXG4gICAgICA6aG9zdCB7XG4gICAgICAgIHdpZHRoOiAxMDAlO1xuICAgICAgICBoZWlnaHQ6IDEwMCU7XG4gICAgICB9XG4gICAgYCxcbiAgXSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIGltcG9ydHM6IFtOZ0lmLCBMb2FkaW5nTWFza0NvbXBvbmVudCwgTmdUZW1wbGF0ZU91dGxldF0sXG59KVxuZXhwb3J0IGNsYXNzIExhenlDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQsIE9uRGVzdHJveSB7XG4gICQkaXNWaXNpYmxlID0gc2lnbmFsKGZhbHNlKTtcblxuICBAQ29udGVudENoaWxkKExhenlDb250ZW50RGlyZWN0aXZlLCB7IHJlYWQ6IFRlbXBsYXRlUmVmIH0pXG4gIHRlbXBsYXRlOiBUZW1wbGF0ZVJlZjx1bmtub3duPjtcblxuICBAQ29udGVudENoaWxkKExhenlQbGFjZWhvbGRlckRpcmVjdGl2ZSwgeyByZWFkOiBUZW1wbGF0ZVJlZiB9KVxuICBwbGFjZWhvbGRlcjogVGVtcGxhdGVSZWY8dW5rbm93bj47XG5cbiAgQElucHV0KCkgZGVzdHJveU9uSGlkZSA9IGZhbHNlO1xuXG4gIHByaXZhdGUgc3Vic2NyaXB0aW9uOiBTdWJzY3JpcHRpb247XG5cbiAgY29uc3RydWN0b3IoXG4gICAgcHJpdmF0ZSByZWFkb25seSBlbDogRWxlbWVudFJlZixcbiAgICBwcml2YXRlIHJlYWRvbmx5IHZpc2liaWxpdHlTZXJ2aWNlOiBWaXNpYmlsaXR5U2VydmljZSxcbiAgKSB7fVxuXG4gIG5nT25Jbml0KCkge1xuICAgIHRoaXMuc3Vic2NyaXB0aW9uID0gdGhpcy52aXNpYmlsaXR5U2VydmljZVxuICAgICAgLm9ic2VydmUodGhpcy5lbClcbiAgICAgIC5zdWJzY3JpYmUoaXNWaXNpYmxlID0+IHtcbiAgICAgICAgdGhpcy4kJGlzVmlzaWJsZS5zZXQoaXNWaXNpYmxlKTtcbiAgICAgICAgaWYgKCFpc1Zpc2libGUgJiYgdGhpcy5kZXN0cm95T25IaWRlKSB7XG4gICAgICAgICAgdGhpcy50ZW1wbGF0ZSA9IG51bGw7XG4gICAgICAgICAgdGhpcy5wbGFjZWhvbGRlciA9IG51bGw7XG4gICAgICAgIH1cbiAgICAgIH0pO1xuICB9XG5cbiAgbmdPbkRlc3Ryb3koKSB7XG4gICAgaWYgKHRoaXMuc3Vic2NyaXB0aW9uKSB7XG4gICAgICB0aGlzLnN1YnNjcmlwdGlvbi51bnN1YnNjcmliZSgpO1xuICAgIH1cbiAgICB0aGlzLnZpc2liaWxpdHlTZXJ2aWNlLnVub2JzZXJ2ZSh0aGlzLmVsKTtcbiAgfVxufVxuIl19