Skip to content

Commit

Permalink
fix(kit): TuiImgLazyLoading compat with SSR (#9184)
Browse files Browse the repository at this point in the history
  • Loading branch information
splincode authored Sep 25, 2024
1 parent e8f2859 commit 710166f
Showing 1 changed file with 10 additions and 3 deletions.
13 changes: 10 additions & 3 deletions projects/kit/directives/lazy-loading/lazy-loading.directive.ts
Original file line number Diff line number Diff line change
@@ -1,11 +1,15 @@
import {Directive, inject, Input, signal} from '@angular/core';
import {isPlatformServer} from '@angular/common';
import {Directive, inject, Input, PLATFORM_ID, signal} from '@angular/core';
import {takeUntilDestroyed} from '@angular/core/rxjs-interop';
import type {SafeResourceUrl} from '@angular/platform-browser';
import {IntersectionObserverService} from '@ng-web-apis/intersection-observer';
import {tuiInjectElement} from '@taiga-ui/cdk/utils/dom';

import {TuiLazyLoadingService} from './lazy-loading.service';

/**
* @deprecated: Drop in v5.0
*/
@Directive({
standalone: true,
selector: 'img[loading="lazy"],img[tuiLoading="lazy"]',
Expand All @@ -20,11 +24,14 @@ import {TuiLazyLoadingService} from './lazy-loading.service';
},
})
export class TuiImgLazyLoading {
private readonly isServer = isPlatformServer(inject(PLATFORM_ID));
private readonly loading$ = inject(TuiLazyLoadingService);
protected readonly supported = 'loading' in tuiInjectElement<HTMLImageElement>();
protected src = signal<SafeResourceUrl | string | null>(null);
protected animation = signal('tuiSkeletonVibe ease-in-out 1s infinite alternate');
protected background = signal('var(--tui-background-neutral-2)');
protected background = signal(this.isServer ? '' : 'var(--tui-background-neutral-2)');
protected animation = signal(
this.isServer ? '' : 'tuiSkeletonVibe ease-in-out 1s infinite alternate',
);

protected readonly $ =
!this.supported &&
Expand Down

0 comments on commit 710166f

Please sign in to comment.