Add support for new GitHub alerts (#19470)

This commit is contained in:
Joakim Sørensen 2024-01-19 17:10:46 +01:00 committed by GitHub
parent 809df848ef
commit 51059e99a5
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 36 additions and 17 deletions

View File

@ -65,15 +65,20 @@ const CONFIGS = [
>> ...by using additional greater-than signs right next to each other...
> > > ...or with spaces between arrows.
> **Warning** Hey there
> This is a warning with a title
> [!NOTE]
> This is a GitHub note alert
> **Note**
> This is a note
> [!TIP]
> This is a GitHub tip alert
> **Note**
> This is a multiline note
> Lorem ipsum...
> [!IMPORTANT]
> This is a GitHub important alert
> [!WARNING]
> This is a GitHub warning alert
> [!CAUTION]
> This is a GitHub caution alert
## Lists

View File

@ -3,7 +3,14 @@ import { customElement, property } from "lit/decorators";
import { fireEvent } from "../common/dom/fire_event";
import { renderMarkdown } from "../resources/render-markdown";
const _blockQuoteToAlert = { Note: "info", Warning: "warning" };
const _legacyGitHubBlockQuoteToAlert = { Note: "info", Warning: "warning" };
const _gitHubBlockQuoteToAlert = {
"[!NOTE]": "info",
"[!TIP]": "success",
"[!IMPORTANT]": "info",
"[!WARNING]": "warning",
"[!CAUTION]": "error",
};
@customElement("ha-markdown-element")
class HaMarkdownElement extends ReactiveElement {
@ -71,18 +78,25 @@ class HaMarkdownElement extends ReactiveElement {
// Map GitHub blockquote elements to our ha-alert element
const firstElementChild = node.firstElementChild;
const quoteTitleElement = firstElementChild?.firstElementChild;
const quoteType =
const blockQuoteType =
firstElementChild?.firstChild?.textContent &&
_gitHubBlockQuoteToAlert[firstElementChild.firstChild.textContent];
const legacyBlockQuoteType =
!blockQuoteType &&
quoteTitleElement?.textContent &&
_blockQuoteToAlert[quoteTitleElement.textContent];
_legacyGitHubBlockQuoteToAlert[quoteTitleElement.textContent];
// GitHub is strict on how these are defined, we need to make sure we know what we have before starting to replace it
if (quoteTitleElement?.nodeName === "STRONG" && quoteType) {
if (
blockQuoteType ||
(quoteTitleElement?.nodeName === "STRONG" && legacyBlockQuoteType)
) {
const alertNote = document.createElement("ha-alert");
alertNote.alertType = quoteType;
alertNote.title =
(firstElementChild!.childNodes[1].nodeName === "#text" &&
firstElementChild!.childNodes[1].textContent?.trimStart()) ||
"";
alertNote.alertType = blockQuoteType || legacyBlockQuoteType;
alertNote.title = blockQuoteType
? ""
: (firstElementChild!.childNodes[1].nodeName === "#text" &&
firstElementChild!.childNodes[1].textContent?.trimStart()) ||
"";
const childNodes = Array.from(firstElementChild!.childNodes);
for (const child of childNodes.slice(