24 lines
1.0 KiB
TypeScript
24 lines
1.0 KiB
TypeScript
import { Component, Input } from '@angular/core';
|
|
import { NgIf } from '@angular/common';
|
|
|
|
@Component({
|
|
selector: 'app-heading-renderer',
|
|
standalone: true,
|
|
imports: [NgIf],
|
|
template: `
|
|
<h1 *ngIf="config['level'] === 'h1'" [style]="styleStr">{{ config['text'] }}</h1>
|
|
<h2 *ngIf="config['level'] === 'h2' || !config['level']" [style]="styleStr">{{ config['text'] }}</h2>
|
|
<h3 *ngIf="config['level'] === 'h3'" [style]="styleStr">{{ config['text'] }}</h3>
|
|
<h4 *ngIf="config['level'] === 'h4'" [style]="styleStr">{{ config['text'] }}</h4>
|
|
<h5 *ngIf="config['level'] === 'h5'" [style]="styleStr">{{ config['text'] }}</h5>
|
|
<h6 *ngIf="config['level'] === 'h6'" [style]="styleStr">{{ config['text'] }}</h6>
|
|
`,
|
|
})
|
|
export class HeadingRenderer {
|
|
@Input() config: Record<string, unknown> = {};
|
|
@Input() styles: Record<string, unknown> = {};
|
|
get styleStr(): string {
|
|
return Object.entries(this.styles).map(([k, v]) => `${k.replace(/[A-Z]/g, c => '-' + c.toLowerCase())}: ${v}`).join('; ');
|
|
}
|
|
}
|