Skeleton
Use to show a placeholder while content is loading.
import { Component } from '@angular/core';
import { HlmSkeletonComponent } from '@spartan-ng/ui-skeleton-helm';
@Component({
selector: 'spartan-skeleton-preview',
standalone: true,
imports: [HlmSkeletonComponent],
template: `
<div class='flex items-center p-4 m-4 w-fit space-x-4'>
<hlm-skeleton class='w-12 h-12 rounded-full' />
<div class='space-y-2'>
<hlm-skeleton class='h-4 w-[250px]' />
<hlm-skeleton class='h-4 w-[200px]' />
</div>
</div>
`,
})
export class SkeletonPreviewComponent {}
Installation
npx nx g @spartan-ng/cli:ui skeleton
ng g @spartan-ng/cli:ui skeleton
Usage
import { HlmSkeletonComponent } from '@spartan-ng/ui-skeleton-helm';
<hlm-skeleton class='h-4 w-[250px]' />