web/elements: pass full Markdown object to ak-markdown, get title from metadata

Signed-off-by: Jens Langhammer <jens.langhammer@beryju.org>
This commit is contained in:
Jens Langhammer
2021-12-16 12:18:43 +01:00
parent 83089b47d3
commit 59493c02c4
3 changed files with 23 additions and 20 deletions

View File

@ -6,10 +6,16 @@ import AKGlobal from "../authentik.css";
import PFContent from "@patternfly/patternfly/components/Content/content.css";
import PFList from "@patternfly/patternfly/components/List/list.css";
export interface MarkdownDocument {
html: string;
metadata: { [key: string]: string };
filename: string;
}
@customElement("ak-markdown")
export class Markdown extends LitElement {
@property()
md?: string;
@property({ attribute: false })
md?: MarkdownDocument;
static get styles(): CSSResult[] {
return [PFList, PFContent, AKGlobal];
@ -19,7 +25,8 @@ export class Markdown extends LitElement {
if (!this.md) {
return html``;
}
const finalHTML = this.md.replace("<ul>", `<ul class="pf-c-list">`);
return html`${unsafeHTML(finalHTML)}`;
const finalHTML = this.md?.html.replace("<ul>", "<ul class=\"pf-c-list\">");
return html`${this.md?.metadata.title ? html`<h2>${this.md.metadata.title}</h2>` : html``}
${unsafeHTML(finalHTML)}`;
}
}