Skip to content

Commit

Permalink
actually add component
Browse files Browse the repository at this point in the history
  • Loading branch information
seiyria committed Apr 24, 2024
1 parent 5065c7c commit 7d357f9
Show file tree
Hide file tree
Showing 3 changed files with 42 additions and 0 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<p [innerHtml]="html">{{ text() }}</p>
Empty file.
41 changes: 41 additions & 0 deletions src/app/_shared/components/card-text/card-text.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,41 @@
import { Component, effect, input } from '@angular/core';
import { marked } from 'marked';
import { environment } from '../../../../environments/environment';

@Component({
selector: 'app-card-text',
templateUrl: './card-text.component.html',
styleUrls: ['./card-text.component.scss'],
})
export class CardTextComponent {
public text = input.required<string>();

public html = '';

constructor() {
const renderer = this.getCustomRenderer();
effect(() => {
this.html = marked(this.text(), { renderer });
});
}

private getCustomRenderer(): marked.Renderer {
const renderer = new marked.Renderer();

// custom inline image formatter
renderer.codespan = (text: string) => {
if (text.includes(':')) {
const [type, subtype] = text.split(':');

return `<img src="${environment.baseUrl}/symbols/${type}-${subtype}.webp" class="inline-icon" title="${subtype}" />`;
}

return `<pre>${text}</pre>`;
};

// no paragraphs
renderer.paragraph = (text: string) => text;

return renderer;
}
}

0 comments on commit 7d357f9

Please sign in to comment.