Bump Playwright version to remove vulnerability

The GitHub action workflow determined that Playwright needed to be
updated in order to reduce vulnerabilities. See:

https://github.com/chocolatey/choco-theme/actions/runs/9131946165/job/25112241220?pr=404

build/data/repository-config.ts

@@ -65,6 +65,7 @@ export const astroRepositoryConfig = {
             'src/**/*.html',
             'src/**/*.txt',
             'src/**/*.md',
+            'src/**/*.mdx',
             'src/**/*.js',
             'src/**/*.ts',
             'public/**/*.js'

dist/css/boxstarter.css

@@ -5,6 +5,7 @@
 * Licensed under MIT (https://github.com/chocolatey/choco-theme/blob/main/LICENSE)
 */
 :root {
+  color-scheme: unset !important;
   --bs-blue-rgb: 0, 141, 156;
   --bs-indigo-rgb: 102, 16, 242;
   --bs-purple-rgb: 157, 58, 116;
@@ -58324,6 +58325,44 @@ li.task-list-item .anchorjs-link {
   overflow: hidden;
 }
 
+/* stylelint-disable selector-class-pattern */
+/* stylelint-disable selector-id-pattern */
+/*! purgecss start ignore */
+[id^=mermaid-] {
+  background-color: var(--bs-body-bg) !important;
+  fill: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .edgeLabel {
+  color: var(--bs-body-color) !important;
+  background-color: var(--bs-body-bg) !important;
+}
+[id^=mermaid-] .marker.cross,
+[id^=mermaid-] .edgePath .path,
+[id^=mermaid-] .flowchart-link,
+[id^=mermaid-] .marker,
+[id^=mermaid-] [class^=messageLine] {
+  stroke: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .pieTitleText,
+[id^=mermaid-] .legend text,
+[id^=mermaid-] .loopText,
+[id^=mermaid-] .loopText > tspan,
+[id^=mermaid-] .messageText,
+[id^=mermaid-] .marker {
+  fill: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .pieCircle {
+  stroke: #000f07;
+}
+[id^=mermaid-] .slice:nth-child(3n) {
+  fill: #fff !important;
+}
+
+:root[data-bs-theme=dark] [id^=mermaid-] .pieOuterCircle {
+  stroke: #fff !important;
+}
+
+/*! purgecss end ignore */
 .btn-collapse::before {
   display: inline-block;
   text-rendering: auto;

dist/css/chocolatey.css

@@ -62208,6 +62208,44 @@ li.task-list-item .anchorjs-link {
   overflow: hidden;
 }
 
+/* stylelint-disable selector-class-pattern */
+/* stylelint-disable selector-id-pattern */
+/*! purgecss start ignore */
+[id^=mermaid-] {
+  background-color: var(--bs-body-bg) !important;
+  fill: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .edgeLabel {
+  color: var(--bs-body-color) !important;
+  background-color: var(--bs-body-bg) !important;
+}
+[id^=mermaid-] .marker.cross,
+[id^=mermaid-] .edgePath .path,
+[id^=mermaid-] .flowchart-link,
+[id^=mermaid-] .marker,
+[id^=mermaid-] [class^=messageLine] {
+  stroke: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .pieTitleText,
+[id^=mermaid-] .legend text,
+[id^=mermaid-] .loopText,
+[id^=mermaid-] .loopText > tspan,
+[id^=mermaid-] .messageText,
+[id^=mermaid-] .marker {
+  fill: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .pieCircle {
+  stroke: #091016;
+}
+[id^=mermaid-] .slice:nth-child(3n) {
+  fill: #fff !important;
+}
+
+:root[data-bs-theme=dark] [id^=mermaid-] .pieOuterCircle {
+  stroke: #fff !important;
+}
+
+/*! purgecss end ignore */
 .btn-collapse::before {
   display: inline-block;
   text-rendering: auto;

dist/css/mermaid.css

@@ -0,0 +1,7 @@
+/* stylelint-disable selector-class-pattern */
+/* stylelint-disable selector-id-pattern */
+:root[data-bs-theme=dark] #mermaid-0 .label text,
+:root[data-bs-theme=dark] #mermaid-0 span,
+:root[data-bs-theme=dark] #mermaid-0 p {
+  filter: invert(1);
+}

dist/css/zendesk.css

@@ -47301,6 +47301,44 @@ li.task-list-item .anchorjs-link {
   overflow: hidden;
 }
 
+/* stylelint-disable selector-class-pattern */
+/* stylelint-disable selector-id-pattern */
+/*! purgecss start ignore */
+[id^=mermaid-] {
+  background-color: var(--bs-body-bg) !important;
+  fill: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .edgeLabel {
+  color: var(--bs-body-color) !important;
+  background-color: var(--bs-body-bg) !important;
+}
+[id^=mermaid-] .marker.cross,
+[id^=mermaid-] .edgePath .path,
+[id^=mermaid-] .flowchart-link,
+[id^=mermaid-] .marker,
+[id^=mermaid-] [class^=messageLine] {
+  stroke: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .pieTitleText,
+[id^=mermaid-] .legend text,
+[id^=mermaid-] .loopText,
+[id^=mermaid-] .loopText > tspan,
+[id^=mermaid-] .messageText,
+[id^=mermaid-] .marker {
+  fill: var(--bs-body-color) !important;
+}
+[id^=mermaid-] .pieCircle {
+  stroke: #091016;
+}
+[id^=mermaid-] .slice:nth-child(3n) {
+  fill: #fff !important;
+}
+
+:root[data-bs-theme=dark] [id^=mermaid-] .pieOuterCircle {
+  stroke: #fff !important;
+}
+
+/*! purgecss end ignore */
 .dropdown-theme .dropdown-toggle {
   text-decoration: none !important;
 }

dist/js/design.js

@@ -18694,9 +18694,11 @@
     codeForView.forEach((el) => {
       const codeOriginal = el;
       const codeLanguage = codeOriginal.getAttribute("data-language");
+      const codeReplace = codeOriginal.getAttribute("data-replace");
       let codeHighlight = "";
       switch (codeLanguage) {
         case "HTML":
+        case "Astro":
           codeHighlight = "markup";
           break;
         case "Markdown":
@@ -18711,8 +18713,27 @@
         default:
           codeHighlight = "none";
       }
-      const codeContainer = `<p class="border-top border-bottom py-2 px-3 mb-0">${codeLanguage}</p><pre class="border-0 my-0 code-static-toolbar"><code class="language-${codeHighlight} line-numbers">${escapeHTML(codeOriginal.innerHTML.trim())}</code></pre>`;
-      codeOriginal.insertAdjacentHTML("afterend", codeContainer);
+      let codeEscaped = escapeHTML(codeOriginal.innerHTML.trim());
+      const start2 = "&lt;";
+      const startSlash = `${start2}/`;
+      const end2 = "&gt;";
+      const endSlash = `/${end2}`;
+      const contentQuotes = /content=&quot;([^&]*)&quot;/g;
+      codeEscaped = codeEscaped.replaceAll(`${start2}callout`, `${start2}Callout`).replaceAll(`${startSlash}callout`, `${startSlash}Callout`).replaceAll(`${start2}collapsebutton`, `${start2}CollapseButton`).replaceAll(`${startSlash}collapsebutton`, `${startSlash}CollapseButton`).replaceAll(`${start2}iframe ratio`, `${start2}Iframe ratio`).replaceAll(`${start2}tabspanecontainer`, `${start2}TabsPaneContainer`).replaceAll(`${startSlash}tabspanecontainer`, `${startSlash}TabsPaneContainer`).replaceAll(`${start2}tabstabcontainer`, `${start2}TabsTabContainer`).replaceAll(`${start2}tabspane`, `${start2}TabsPane`).replaceAll(`${start2}xref`, `${start2}Xref`).replaceAll(`value=&quot;example-define&quot;${end2}`, `value=&quot;example-define&quot; ${endSlash}`).replaceAll(`anchor=&quot;why&quot;${end2}`, `anchor=&quot;why&quot; ${endSlash}`).replaceAll(`${startSlash}tabspane`, `${startSlash}TabsPane`).replaceAll(`content=&quot;{tabs1}&quot;${end2}`, `content=&quot;{tabs1}&quot; ${endSlash}`).replaceAll(`content=&quot;{tabs2}&quot;${end2}`, `content=&quot;{tabs2}&quot; ${endSlash}`).replaceAll(`content=&quot;{tabs3}&quot;${end2}`, `content=&quot;{tabs3}&quot; ${endSlash}`).replaceAll(`multi=&quot;version&quot;${end2}`, `multi=&quot;version&quot; ${endSlash}`).replaceAll(`${startSlash}tabstabcontainer${end2}`, "").replaceAll(`${startSlash}xref${end2}`, "").replaceAll(`${startSlash}iframe${end2}`, "").replace(contentQuotes, (match2, p1) => `content=${p1}`);
+      if (codeReplace !== "true") {
+        if (codeLanguage === "Astro") {
+          const codeContainer = `<p class="border-top border-bottom py-2 px-3 mb-0">${codeLanguage}</p><pre class="border-0 mx-3 mb-3 mt-0 code-static-toolbar"><code class="language-${codeHighlight} line-numbers">${codeEscaped}</code></pre>`;
+          console.log("Astro");
+          codeOriginal.innerHTML = codeContainer;
+        } else {
+          const codeContainer = `<p class="border-top border-bottom py-2 px-3 mb-0">${codeLanguage}</p><pre class="border-0 my-0 code-static-toolbar"><code class="language-${codeHighlight} line-numbers">${codeEscaped}</code></pre>`;
+          console.log("Not Astro");
+          codeOriginal.insertAdjacentHTML("afterend", codeContainer);
+        }
+      } else {
+        const codeContainer = `<pre><code class="language-${codeHighlight} line-numbers">${codeEscaped}</code></pre>`;
+        codeOriginal.innerHTML = codeContainer;
+      }
     });
   })();