mirror of
https://github.com/discourse/discourse.git
synced 2024-12-30 11:23:42 +08:00
26 lines
723 B
Plaintext
26 lines
723 B
Plaintext
|
import Component from "@glimmer/component";
|
||
|
|
import { service } from "@ember/service";
|
||
|
|
import { modifier } from "ember-modifier";
|
||
|
|
import highlightSyntax from "discourse/lib/highlight-syntax";
|
||
|
|
|
||
|
|
export default class HighlightedCode extends Component {
|
||
|
|
@service session;
|
||
|
|
@service siteSettings;
|
||
|
|
|
||
|
|
highlight = modifier(async (element) => {
|
||
|
|
const code = document.createElement("code");
|
||
|
|
code.classList.add(`lang-${this.args.lang}`);
|
||
|
|
code.textContent = this.args.code;
|
||
|
|
|
||
|
|
const pre = document.createElement("pre");
|
||
|
|
pre.appendChild(code);
|
||
|
|
|
||
|
|
element.replaceChildren(pre);
|
||
|
|
await highlightSyntax(pre, this.siteSettings, this.session);
|
||
|
|
});
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div {{this.highlight}}></div>
|
||
|
|
</template>
|
||
|
|
}
|