@stats-organization/github-readme-stats-core 2.1.4 → 2.1.5

package/build/cards/top-languages.js

@@ -1,7 +1,8 @@
 import { Card } from "../common/Card.js";
 import { I18n } from "../common/I18n.js";
-import { fallbackColor, getCardColors } from "../common/color.js";
+import { fallbackColor, getCardColors, isPrefixedHexColor, } from "../common/color.js";
 import { formatBytes } from "../common/fmt.js";
+import { encodeHTML } from "../common/html.js";
 import { chunkArray, clampValue, lowercaseTrim } from "../common/ops.js";
 import { createProgressNode, flexLayout, measureText, } from "../common/render.js";
 import { langCardLocales } from "../translations.js";
@@ -201,8 +202,8 @@ const createProgressTextNode = ({ width, color, progBarBgColor, name, size, tota
     const displayValue = getDisplayValue(size, progress, statsFormat);
     return `
     <g class="stagger" style="animation-delay: ${staggerDelay}ms">
-      <text data-testid="lang-name" x="2" y="15" class="lang-name">${name}</text>
-      ${hideValues ? "" : `<text x="${progressTextX}" y="34" class="lang-name">${displayValue}</text>`}
+      <text data-testid="lang-name" x="2" y="15" class="lang-name">${encodeHTML(name)}</text>
+      ${hideValues ? "" : `<text x="${progressTextX}" y="34" class="lang-name">${encodeHTML(displayValue)}</text>`}
       ${createProgressNode({
         x: 0,
         y: 25,
@@ -232,11 +233,14 @@ const createCompactLangNode = ({ lang, totalSize, hideProgress, hideValues, stat
     const displayValue = getDisplayValue(lang.size, percentages, statsFormat);
     const staggerDelay = (index + 3) * 150;
     const color = lang.color || "#858585";
+    if (!isPrefixedHexColor(color)) {
+        throw new Error(`Invalid language color: "${color}"`);
+    }
     return `
     <g class="stagger" style="animation-delay: ${staggerDelay}ms">
       <circle cx="5" cy="6" r="5" fill="${color}" />
       <text data-testid="lang-name" x="15" y="10" class='lang-name'>
-        ${lang.name} ${hideProgress || hideValues ? "" : displayValue}
+        ${encodeHTML(lang.name)} ${hideProgress || hideValues ? "" : encodeHTML(displayValue)}
       </text>
     </g>
   `;
@@ -354,6 +358,10 @@ const renderCompactLayout = (langs, width, totalLanguageSize, hideProgress, stat
     let progressOffset = 0;
     const compactProgressBar = langs
         .map((lang) => {
+        const langColor = lang.color || DEFAULT_LANG_COLOR;
+        if (!isPrefixedHexColor(langColor)) {
+            throw new Error(`Invalid language color: "${langColor}"`);
+        }
         const percentage = parseFloat(((lang.size / totalLanguageSize) * offsetWidth).toFixed(2));
         const progress = percentage < 10 ? percentage + 10 : percentage;
         const output = `
@@ -364,7 +372,7 @@ const renderCompactLayout = (langs, width, totalLanguageSize, hideProgress, stat
           y="0"
           width="${progress}"
           height="8"
-          fill="${lang.color || "#858585"}"
+          fill="${langColor}"
         />
       `;
         progressOffset += percentage;
@@ -412,17 +420,21 @@ const renderDonutVerticalLayout = (langs, totalLanguageSize, statsFormat, hideVa
     let startDelayCoefficient = 1;
     // Generate each donut vertical chart part
     for (const lang of langs) {
+        const langColor = lang.color || DEFAULT_LANG_COLOR;
+        if (!isPrefixedHexColor(langColor)) {
+            throw new Error(`Invalid language color: "${langColor}"`);
+        }
         const percentage = (lang.size / totalLanguageSize) * 100;
         const circleLength = totalCircleLength * (percentage / 100);
         const delay = startDelayCoefficient * 100;
         circles.push(`
       <g class="stagger" style="animation-delay: ${delay}ms">
-        <circle 
+        <circle
           cx="150"
           cy="100"
           r="${radius}"
           fill="transparent"
-          stroke="${lang.color}"
+          stroke="${langColor}"
           stroke-width="25"
           stroke-dasharray="${totalCircleLength}"
           stroke-dashoffset="${indent}"
@@ -479,6 +491,10 @@ const renderPieLayout = (langs, totalLanguageSize, statsFormat, hideValues) => {
     const paths = [];
     // Generate each pie chart part
     for (const lang of langs) {
+        const langColor = lang.color || DEFAULT_LANG_COLOR;
+        if (!isPrefixedHexColor(langColor)) {
+            throw new Error(`Invalid language color: "${langColor}"`);
+        }
         if (langs.length === 1) {
             paths.push(`
         <circle
@@ -486,7 +502,7 @@ const renderPieLayout = (langs, totalLanguageSize, statsFormat, hideValues) => {
           cy="${centerY}"
           r="${radius}"
           stroke="none"
-          fill="${lang.color}"
+          fill="${langColor}"
           data-testid="lang-pie"
           size="100"
         />
@@ -513,7 +529,7 @@ const renderPieLayout = (langs, totalLanguageSize, statsFormat, hideValues) => {
           data-testid="lang-pie"
           size="${percentage}"
           d="M ${centerX} ${centerY} L ${startPoint.x} ${startPoint.y} A ${radius} ${radius} 0 ${largeArcFlag} 1 ${endPoint.x} ${endPoint.y} Z"
-          fill="${lang.color}"
+          fill="${langColor}"
         />
       </g>
     `);
@@ -582,11 +598,20 @@ const createDonutPaths = (cx, cy, radius, percentages) => {
  * @returns {string} Donut layout card SVG object.
  */
 const renderDonutLayout = (langs, width, totalLanguageSize, statsFormat, hideValues) => {
+    if (!Number.isFinite(width)) {
+        throw new Error(`Invalid width: "${width}"`);
+    }
     const centerX = width / 3;
     const centerY = width / 3;
     const radius = centerX - 60;
     const strokeWidth = 12;
-    const colors = langs.map((lang) => lang.color);
+    const colors = langs.map((lang) => {
+        const langColor = lang.color || DEFAULT_LANG_COLOR;
+        if (!isPrefixedHexColor(langColor)) {
+            throw new Error(`Invalid language color: "${langColor}"`);
+        }
+        return langColor;
+    });
     const langsPercents = langs.map((lang) => parseFloat(((lang.size / totalLanguageSize) * 100).toFixed(2)));
     const langPaths = createDonutPaths(centerX, centerY, radius, langsPercents);
     const donutPaths = langs.length === 1
@@ -637,8 +662,11 @@ const renderDonutLayout = (langs, width, totalLanguageSize, statsFormat, hideVal
  * @returns {string} No languages data SVG node string.
  */
 const noLanguagesDataNode = ({ color, text, layout }) => {
+    if (!isPrefixedHexColor(color)) {
+        throw new Error(`Invalid text color: "${color}"`);
+    }
     return `
-    <text x="${layout === "pie" || layout === "donut-vertical" ? CARD_PADDING : 0}" y="11" class="stat bold" fill="${color}">${text}</text>
+    <text x="${layout === "pie" || layout === "donut-vertical" ? CARD_PADDING : 0}" y="11" class="stat bold" fill="${color}">${encodeHTML(text)}</text>
   `;
 };
 /**

package/build/cards/wakatime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"wakatime.d.ts","sourceRoot":"","sources":["../../src/cards/wakatime.js"],"names":[],"mappings":";;;AA6NA;;;GAGG;AAEH;;;;;;GAMG;AACH,2CAJW,OAAO,CAAC,YAAY,CAAC,YACrB,OAAO,CAAC,eAAe,CAAC,GACtB,MAAM,CA2OlB"}
+{"version":3,"file":"wakatime.d.ts","sourceRoot":"","sources":["../../src/cards/wakatime.js"],"names":[],"mappings":";;;AAoPA;;;GAGG;AAEH;;;;;;GAMG;AACH,2CAJW,OAAO,CAAC,YAAY,CAAC,YACrB,OAAO,CAAC,eAAe,CAAC,GACtB,MAAM,CA6OlB"}

package/build/cards/wakatime.js

@@ -1,6 +1,7 @@
 import { Card } from "../common/Card.js";
 import { I18n } from "../common/I18n.js";
-import { getCardColors } from "../common/color.js";
+import { getCardColors, isPrefixedHexColor } from "../common/color.js";
+import { encodeHTML } from "../common/html.js";
 import languageColors from "../common/languageColors.json" with { type: "json" };
 import { clampValue, lowercaseTrim } from "../common/ops.js";
 import { createProgressNode, flexLayout } from "../common/render.js";
@@ -22,8 +23,11 @@ const TOTAL_TEXT_WIDTH = 275;
  * @returns {string} No coding activity SVG node string.
  */
 const noCodingActivityNode = ({ color, text }) => {
+    if (!isPrefixedHexColor(color)) {
+        throw new Error(`Invalid text color: "${color}"`);
+    }
     return `
-    <text x="25" y="11" class="stat bold" fill="${color}">${text}</text>
+    <text x="25" y="11" class="stat bold" fill="${color}">${encodeHTML(text)}</text>
   `;
 };
 /**
@@ -53,6 +57,12 @@ const formatLanguageValue = ({ display_format, lang }) => {
  * @returns {string} The compact layout language SVG node.
  */
 const createCompactLangNode = ({ lang, x, y, display_format }) => {
+    if (!Number.isFinite(x)) {
+        throw new Error(`Invalid x: "${x}"`);
+    }
+    if (!Number.isFinite(y)) {
+        throw new Error(`Invalid y: "${y}"`);
+    }
     // @ts-ignore
     const color = languageColors[lang.name] || "#858585";
     const value = formatLanguageValue({ display_format, lang });
@@ -60,7 +70,7 @@ const createCompactLangNode = ({ lang, x, y, display_format }) => {
     <g transform="translate(${x}, ${y})">
       <circle cx="5" cy="6" r="5" fill="${color}" />
       <text data-testid="lang-name" x="15" y="10" class='lang-name'>
-        ${lang.name} - ${value}
+        ${encodeHTML(lang.name)} - ${encodeHTML(value)}
       </text>
     </g>
   `;
@@ -106,6 +116,12 @@ const createLanguageTextNode = ({ langs, y, display_format, card_width }) => {
  * @returns {string} The text SVG node.
  */
 const createTextNode = ({ id, label, value, index, percent, hideProgress, progressBarColor, progressBarBackgroundColor, progressBarWidth, }) => {
+    if (!Number.isFinite(index)) {
+        throw new Error(`Invalid index: "${index}"`);
+    }
+    if (!Number.isFinite(progressBarWidth)) {
+        throw new Error(`Invalid progressBarWidth: "${progressBarWidth}"`);
+    }
     const staggerDelay = (index + 3) * 150;
     const cardProgress = hideProgress
         ? null
@@ -122,12 +138,12 @@ const createTextNode = ({ id, label, value, index, percent, hideProgress, progre
         });
     return `
     <g class="stagger" style="animation-delay: ${staggerDelay}ms" transform="translate(25, 0)">
-      <text class="stat bold" y="12.5" data-testid="${id}">${label}:</text>
+      <text class="stat bold" y="12.5" data-testid="${encodeHTML(id)}">${encodeHTML(label)}:</text>
       <text
         class="stat"
         x="${hideProgress ? HIDDEN_PROGRESSBAR_PADDING : PROGRESSBAR_PADDING + progressBarWidth}"
         y="12.5"
-      >${value}</text>
+      >${encodeHTML(value)}</text>
       ${cardProgress}
     </g>
   `;
@@ -154,9 +170,12 @@ const recalculatePercentages = (languages) => {
  * @param {string} colors.textColor The text color.
  * @returns {string} Card CSS styles.
  */
-const getStyles = ({ 
+const getStyles = function ({ 
 // eslint-disable-next-line no-unused-vars
-titleColor, textColor, }) => {
+titleColor, textColor, }) {
+    if (!isPrefixedHexColor(textColor)) {
+        throw new Error(`Invalid text color: "${textColor}"`);
+    }
     return `
     .stat {
       font: 600 14px 'Segoe UI', Ubuntu, "Helvetica Neue", Sans-Serif; fill: ${textColor};
@@ -302,7 +321,9 @@ const renderWakatimeCard = (stats = {}, options = { hide: [] }) => {
                         // @ts-ignore
                         progressBarColor: titleColor,
                         // @ts-ignore
-                        progressBarBackgroundColor: textColor === titleColor ? bgColor : textColor,
+                        progressBarBackgroundColor: textColor === titleColor
+                            ? "#fff0" // transparent
+                            : textColor,
                         hideProgress: hide_progress,
                         progressBarWidth: normalizedWidth - TOTAL_TEXT_WIDTH,
                     });

package/build/common/Card.d.ts

@@ -28,6 +28,8 @@ declare class Card {
     /**
      * Creates a new card instance.
      *
+     * The caller must ensure that the passed `titlePrefixIcon` is properly sanitized!
+     *
      * @param props Card arguments.
      * @param props.width Card width.
      * @param props.height Card height.
@@ -35,7 +37,7 @@ declare class Card {
      * @param props.colors Card colors arguments.
      * @param props.customTitle Card custom title.
      * @param props.defaultTitle Card default title.
-     * @param props.titlePrefixIcon Card title prefix icon.
+     * @param props.titlePrefixIcon Sanitized card title prefix icon.
      */
     constructor({ width, height, border_radius, colors, customTitle, defaultTitle, titlePrefixIcon, }: {
         width?: number;
@@ -57,7 +59,9 @@ declare class Card {
         desc: string;
     }): void;
     /**
-     * @param value The CSS to add to the card.
+     * The caller must ensure that the passed `css` string is properly sanitized!
+     *
+     * @param value The sanitized CSS to add to the card.
      */
     setCSS(value: string): void;
     /**
@@ -87,7 +91,9 @@ declare class Card {
      */
     getAnimations: () => string;
     /**
-     * @param body The inner body of the card.
+     * The caller must ensure that the passed `body` string is properly sanitized!
+     *
+     * @param body The sanitized inner body of the card.
      * @returns The rendered card.
      */
     render(body: string): string;

package/build/common/Card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/common/Card.ts"],"names":[],"mappings":"AAGA,UAAU,UAAU;IAClB,wBAAwB;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IACjC,yBAAyB;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,cAAM,IAAI;IACR,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;;;;;;;;OAWG;gBACS,EACV,KAAW,EACX,MAAY,EACZ,aAAmB,EACnB,MAAW,EACX,WAAW,EACX,YAAiB,EACjB,eAAe,GAChB,EAAE;QACD,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,MAAM,CAAC,EAAE,UAAU,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B;IAyBD,iBAAiB,IAAI,IAAI;IAIzB;;;;OAIG;IACH,qBAAqB,CAAC,EACpB,KAAK,EACL,IAAI,GACL,EAAE;QACD,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,GAAG,IAAI;IAKR;;OAEG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI3B;;OAEG;IACH,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAInC;;OAEG;IACH,YAAY,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAOlC;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAI5B;;OAEG;IACH,WAAW,IAAI,MAAM;IAoCrB;;OAEG;IACH,cAAc,IAAI,MAAM;IA0BxB;;;;OAIG;IACH,aAAa,QAAO,MAAM,CAoBxB;IAEF;;;OAGG;IACH,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;CAgE7B;AAED,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Card.d.ts","sourceRoot":"","sources":["../../src/common/Card.ts"],"names":[],"mappings":"AAIA,UAAU,UAAU;IAClB,wBAAwB;IACxB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uBAAuB;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,6BAA6B;IAC7B,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IACjC,yBAAyB;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED,cAAM,IAAI;IACR,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,OAAO,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,MAAM,EAAE,UAAU,CAAC;IACnB,KAAK,EAAE,MAAM,CAAC;IACd,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,eAAe,EAAE,MAAM,GAAG,SAAS,CAAC;IACpC,UAAU,EAAE,OAAO,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,QAAQ,EAAE,MAAM,CAAC;IAEjB;;;;;;;;;;;;;OAaG;gBACS,EACV,KAAW,EACX,MAAY,EACZ,aAAmB,EACnB,MAAW,EACX,WAAW,EACX,YAAiB,EACjB,eAAe,GAChB,EAAE;QACD,KAAK,CAAC,EAAE,MAAM,CAAC;QACf,MAAM,CAAC,EAAE,MAAM,CAAC;QAChB,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,MAAM,CAAC,EAAE,UAAU,CAAC;QACpB,WAAW,CAAC,EAAE,MAAM,CAAC;QACrB,YAAY,CAAC,EAAE,MAAM,CAAC;QACtB,eAAe,CAAC,EAAE,MAAM,CAAC;KAC1B;IAuBD,iBAAiB,IAAI,IAAI;IAIzB;;;;OAIG;IACH,qBAAqB,CAAC,EACpB,KAAK,EACL,IAAI,GACL,EAAE;QACD,KAAK,EAAE,MAAM,CAAC;QACd,IAAI,EAAE,MAAM,CAAC;KACd,GAAG,IAAI;IAKR;;;;OAIG;IACH,MAAM,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI;IAI3B;;OAEG;IACH,aAAa,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAInC;;OAEG;IACH,YAAY,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI;IAUlC;;OAEG;IACH,QAAQ,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI;IAI5B;;OAEG;IACH,WAAW,IAAI,MAAM;IAoCrB;;OAEG;IACH,cAAc,IAAI,MAAM;IA2BxB;;;;OAIG;IACH,aAAa,QAAO,MAAM,CAoBxB;IAEF;;;;;OAKG;IACH,MAAM,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM;CA0F7B;AAED,OAAO,EAAE,IAAI,EAAE,CAAC;AAChB,eAAe,IAAI,CAAC"}

package/build/common/Card.js

@@ -1,3 +1,4 @@
+import { isPrefixedHexColor, isValidGradient } from "./color.js";
 import { encodeHTML } from "./html.js";
 import { flexLayout } from "./render.js";
 class Card {
@@ -18,6 +19,8 @@ class Card {
     /**
      * Creates a new card instance.
      *
+     * The caller must ensure that the passed `titlePrefixIcon` is properly sanitized!
+     *
      * @param props Card arguments.
      * @param props.width Card width.
      * @param props.height Card height.
@@ -25,17 +28,17 @@ class Card {
      * @param props.colors Card colors arguments.
      * @param props.customTitle Card custom title.
      * @param props.defaultTitle Card default title.
-     * @param props.titlePrefixIcon Card title prefix icon.
+     * @param props.titlePrefixIcon Sanitized card title prefix icon.
      */
     constructor({ width = 100, height = 100, border_radius = 4.5, colors = {}, customTitle, defaultTitle = "", titlePrefixIcon, }) {
         this.width = width;
         this.height = height;
         this.hideBorder = false;
         this.hideTitle = false;
-        this.border_radius = border_radius;
+        this.border_radius = parseFloat(String(border_radius));
         // returns theme based colors with proper overrides and defaults
         this.colors = colors;
-        this.title = encodeHTML(customTitle === undefined ? defaultTitle : customTitle);
+        this.title = customTitle === undefined ? defaultTitle : customTitle;
         this.css = "";
         this.paddingX = 25;
         this.paddingY = 35;
@@ -57,7 +60,9 @@ class Card {
         this.a11yDesc = desc;
     }
     /**
-     * @param value The CSS to add to the card.
+     * The caller must ensure that the passed `css` string is properly sanitized!
+     *
+     * @param value The sanitized CSS to add to the card.
      */
     setCSS(value) {
         this.css = value;
@@ -72,10 +77,13 @@ class Card {
      * @param value Whether to hide the title or not.
      */
     setHideTitle(value) {
-        this.hideTitle = value;
-        if (value) {
+        if (value && !this.hideTitle) {
             this.height -= 30;
         }
+        if (!value && this.hideTitle) {
+            this.height += 30;
+        }
+        this.hideTitle = value;
     }
     /**
      * @param text The title to set.
@@ -93,7 +101,7 @@ class Card {
         y="0"
         class="header"
         data-testid="header"
-      >${this.title}</text>
+      >${encodeHTML(this.title)}</text>
     `;
         const prefixIcon = `
       <svg
@@ -127,9 +135,11 @@ class Card {
         if (typeof this.colors.bgColor !== "object") {
             return "";
         }
+        if (!isValidGradient(this.colors.bgColor)) {
+            throw new Error(`Invalid gradient: ${this.colors.bgColor.join(",")}`);
+        }
         const gradients = this.colors.bgColor.slice(1);
-        return typeof this.colors.bgColor === "object"
-            ? `
+        return `
         <defs>
           <linearGradient
             id="gradient"
@@ -137,15 +147,14 @@ class Card {
             gradientUnits="userSpaceOnUse"
           >
             ${gradients
-                .map((grad, index) => {
-                const offset = (index * 100) / (gradients.length - 1);
-                return `<stop offset="${offset}%" stop-color="#${grad}" />`;
-            })
-                .join(",")}
+            .map((grad, index) => {
+            const offset = (index * 100) / (gradients.length - 1);
+            return `<stop offset="${offset}%" stop-color="#${grad}" />`;
+        })
+            .join(",")}
           </linearGradient>
         </defs>
-        `
-            : "";
+        `;
     }
     /**
      * Retrieves css animations for a card.
@@ -174,10 +183,29 @@ class Card {
     `;
     };
     /**
-     * @param body The inner body of the card.
+     * The caller must ensure that the passed `body` string is properly sanitized!
+     *
+     * @param body The sanitized inner body of the card.
      * @returns The rendered card.
      */
     render(body) {
+        if (!Number.isFinite(this.border_radius)) {
+            throw new Error(`Invalid border radius: "${this.border_radius}"`);
+        }
+        if (this.colors.titleColor !== undefined &&
+            !isPrefixedHexColor(this.colors.titleColor)) {
+            throw new Error(`Invalid title color: "${this.colors.titleColor}"`);
+        }
+        if (this.colors.borderColor !== undefined &&
+            !isPrefixedHexColor(this.colors.borderColor)) {
+            throw new Error(`Invalid border color: "${this.colors.borderColor}"`);
+        }
+        if (this.colors.bgColor !== undefined &&
+            !(typeof this.colors.bgColor === "object"
+                ? isValidGradient(this.colors.bgColor)
+                : isPrefixedHexColor(this.colors.bgColor))) {
+            throw new Error(`Invalid background color: ${String(this.colors.bgColor)}`);
+        }
         return `
       <svg
         width="${this.width}"
@@ -188,8 +216,8 @@ class Card {
         role="img"
         aria-labelledby="descId"
       >
-        <title id="titleId">${this.a11yTitle}</title>
-        <desc id="descId">${this.a11yDesc}</desc>
+        <title id="titleId">${encodeHTML(this.a11yTitle)}</title>
+        <desc id="descId">${encodeHTML(this.a11yDesc)}</desc>
         <style>
           .header {
             font: 600 18px 'Segoe UI', Ubuntu, Sans-Serif;

package/build/common/color.d.ts

@@ -1,3 +1,37 @@
+/**
+ * Checks if a value is a bare hex color, i.e. hex digits with no `#` prefix
+ * (`"f00"`, `"ffffff"`). This is the form user-supplied color params and
+ * gradient stops arrive in.
+ *
+ * @param value Value to check.
+ * @returns True if the value is a bare hex color.
+ */
+declare const isBareHexColor: (value: unknown) => boolean;
+/**
+ * Checks if a value is a `#`-prefixed hex color (`"#f00"`, `"#ffffff"`). This
+ * is the form colors take once resolved by {@link getCardColors}, i.e. right
+ * before they are written into the SVG.
+ *
+ * @param value Value to check.
+ * @returns True if the value is a `#`-prefixed hex color.
+ */
+declare const isPrefixedHexColor: (value: unknown) => boolean;
+/**
+ * Checks if the given parts form a valid gradient: a finite numeric angle
+ * followed by at least two bare-hex color stops, e.g. `["90", "f00", "0f0"]`.
+ * The angle is written into the SVG `gradientTransform="rotate(...)"`.
+ *
+ * @param parts Gradient parts: `[angle, ...stops]`.
+ * @returns True if the parts form a valid gradient.
+ */
+declare const isValidGradient: (parts: Array<string>) => boolean;
+/**
+ * Iterates over a collection of colors inputs and verifies that each is a valid color or gradient.
+ *
+ * @param colors Object whose values are checked as valid color inputs.
+ * @return The first key where the associated input value is not valid. null if all inputs are valid.
+ */
+declare const findInvalidColor: (colors: Record<string, string | null | undefined>) => string | null;
 /**
  * Retrieves a gradient if color has more than one valid hex codes else a single color.
  *
@@ -31,13 +65,13 @@ interface CardColors {
  * @returns Card colors.
  */
 declare const getCardColors: ({ title_color, text_color, icon_color, bg_color, border_color, ring_color, theme, }: {
-    title_color?: string;
-    text_color?: string;
-    icon_color?: string;
-    bg_color?: string;
-    border_color?: string;
-    ring_color?: string;
-    theme?: string;
+    title_color?: string | undefined;
+    text_color?: string | undefined;
+    icon_color?: string | undefined;
+    bg_color?: string | undefined;
+    border_color?: string | undefined;
+    ring_color?: string | undefined;
+    theme?: string | undefined;
 }) => CardColors;
-export { fallbackColor, getCardColors };
+export { fallbackColor, getCardColors, findInvalidColor, isValidGradient, isBareHexColor, isPrefixedHexColor, };
 //# sourceMappingURL=color.d.ts.map

package/build/common/color.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../src/common/color.ts"],"names":[],"mappings":"AA2BA;;;;;;GAMG;AACH,QAAA,MAAM,aAAa,GACjB,OAAO,MAAM,GAAG,SAAS,EACzB,eAAe,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,KACpC,MAAM,GAAG,KAAK,CAAC,MAAM,CAWvB,CAAC;AAEF;;GAEG;AACH,UAAU,UAAU;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IAChC,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;;;GAYG;AACH,QAAA,MAAM,aAAa,GAAI,qFAQpB;IACD,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,KAAG,UAuDH,CAAC;AAEF,OAAO,EAAE,aAAa,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"color.d.ts","sourceRoot":"","sources":["../../src/common/color.ts"],"names":[],"mappings":"AAMA;;;;;;;GAOG;AACH,QAAA,MAAM,cAAc,GAAI,OAAO,OAAO,KAAG,OAExC,CAAC;AAEF;;;;;;;GAOG;AACH,QAAA,MAAM,kBAAkB,GAAI,OAAO,OAAO,KAAG,OAM5C,CAAC;AAEF;;;;;;;GAOG;AACH,QAAA,MAAM,eAAe,GAAI,OAAO,KAAK,CAAC,MAAM,CAAC,KAAG,OAS/C,CAAC;AAeF;;;;;GAKG;AACH,QAAA,MAAM,gBAAgB,GACpB,QAAQ,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC,KAChD,MAAM,GAAG,IAOX,CAAC;AAEF;;;;;;GAMG;AACH,QAAA,MAAM,aAAa,GACjB,OAAO,MAAM,GAAG,SAAS,EACzB,eAAe,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,KACpC,MAAM,GAAG,KAAK,CAAC,MAAM,CAWvB,CAAC;AAEF;;GAEG;AACH,UAAU,UAAU;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,CAAC;IAChC,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACnB;AAED;;;;;;;;;;;;GAYG;AACH,QAAA,MAAM,aAAa,GAAI,qFAQpB;IACD,WAAW,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAC9B,YAAY,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAClC,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,KAAK,CAAC,EAAE,MAAM,GAAG,SAAS,CAAC;CAC5B,KAAG,UAuDH,CAAC;AAEF,OAAO,EACL,aAAa,EACb,aAAa,EACb,gBAAgB,EAChB,eAAe,EACf,cAAc,EACd,kBAAkB,GACnB,CAAC"}

package/build/common/color.js

@@ -1,22 +1,71 @@
 import { themes } from "../themes/index.js";
+/** Matches a 3-, 4-, 6-, or 8-digit hex color with no leading `#`. */
+const HEX_COLOR = /^([A-Fa-f0-9]{8}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{4}|[A-Fa-f0-9]{3})$/;
 /**
- * Checks if a string is a valid hex color.
+ * Checks if a value is a bare hex color, i.e. hex digits with no `#` prefix
+ * (`"f00"`, `"ffffff"`). This is the form user-supplied color params and
+ * gradient stops arrive in.
  *
- * @param hexColor String to check.
- * @returns True if the given string is a valid hex color.
+ * @param value Value to check.
+ * @returns True if the value is a bare hex color.
  */
-const isValidHexColor = (hexColor) => {
-    return new RegExp(/^([A-Fa-f0-9]{8}|[A-Fa-f0-9]{6}|[A-Fa-f0-9]{3}|[A-Fa-f0-9]{4})$/).test(hexColor);
+const isBareHexColor = (value) => {
+    return typeof value === "string" && HEX_COLOR.test(value);
 };
 /**
- * Check if the given string is a valid gradient.
+ * Checks if a value is a `#`-prefixed hex color (`"#f00"`, `"#ffffff"`). This
+ * is the form colors take once resolved by {@link getCardColors}, i.e. right
+ * before they are written into the SVG.
  *
- * @param colors Array of colors.
- * @returns True if the given string is a valid gradient.
+ * @param value Value to check.
+ * @returns True if the value is a `#`-prefixed hex color.
  */
-const isValidGradient = (colors) => {
-    return (colors.length > 2 &&
-        colors.slice(1).every((color) => isValidHexColor(color)));
+const isPrefixedHexColor = (value) => {
+    return (typeof value === "string" &&
+        value.startsWith("#") &&
+        HEX_COLOR.test(value.slice(1)));
+};
+/**
+ * Checks if the given parts form a valid gradient: a finite numeric angle
+ * followed by at least two bare-hex color stops, e.g. `["90", "f00", "0f0"]`.
+ * The angle is written into the SVG `gradientTransform="rotate(...)"`.
+ *
+ * @param parts Gradient parts: `[angle, ...stops]`.
+ * @returns True if the parts form a valid gradient.
+ */
+const isValidGradient = (parts) => {
+    const [angle, ...stops] = parts;
+    return (stops.length >= 2 &&
+        angle !== undefined &&
+        angle.trim() !== "" &&
+        Number.isFinite(Number(angle)) &&
+        stops.every(isBareHexColor));
+};
+/**
+ * Checks if a string is a valid input for a color or gradient.
+ *
+ * @param color String to check, may be null or undefined.
+ * @returns True if the given string is a valid input.
+ */
+const isValidColorInput = (color) => {
+    if (color === null || color === undefined) {
+        return true;
+    }
+    return isValidGradient(color.split(",")) || isBareHexColor(color);
+};
+/**
+ * Iterates over a collection of colors inputs and verifies that each is a valid color or gradient.
+ *
+ * @param colors Object whose values are checked as valid color inputs.
+ * @return The first key where the associated input value is not valid. null if all inputs are valid.
+ */
+const findInvalidColor = (colors) => {
+    for (const [key, value] of Object.entries(colors)) {
+        if (!isValidColorInput(value)) {
+            return key;
+        }
+    }
+    return null;
 };
 /**
  * Retrieves a gradient if color has more than one valid hex codes else a single color.
@@ -30,7 +79,7 @@ const fallbackColor = (color, fallbackColor) => {
     if (colors.length > 1 && isValidGradient(colors)) {
         return colors;
     }
-    if (color !== undefined && isValidHexColor(color)) {
+    if (color !== undefined && isBareHexColor(color)) {
         return `#${color}`;
     }
     return fallbackColor;
@@ -77,4 +126,4 @@ const getCardColors = ({ title_color, text_color, icon_color, bg_color, border_c
     }
     return { titleColor, iconColor, textColor, bgColor, borderColor, ringColor };
 };
-export { fallbackColor, getCardColors };
+export { fallbackColor, getCardColors, findInvalidColor, isValidGradient, isBareHexColor, isPrefixedHexColor, };

package/build/common/html.js

@@ -5,7 +5,7 @@
  */
 const encodeHTML = (str) => {
     return (str
-        .replace(/[\u00A0-\u9999<>&](?!#)/gim, (i) => {
+        .replace(/[\u00A0-\u9999<>&"'](?!#)/gim, (i) => {
         return `&#${i.charCodeAt(0)};`;
     })
         // eslint-disable-next-line no-control-regex

package/build/common/http.d.ts

@@ -1,9 +1,18 @@
+import type { AxiosRequestConfig, AxiosResponse } from "axios";
+/** Body of a GraphQL request sent to the GitHub API. */
+interface GraphQLRequest {
+    /** The GraphQL query. */
+    query: string;
+    /** Variables referenced by the query. */
+    variables: Record<string, unknown>;
+}
 /**
  * Send GraphQL request to GitHub API.
  *
- * @param {import('axios').AxiosRequestConfig['data']} data Request data.
- * @param {import('axios').AxiosRequestConfig['headers']} headers Request headers.
- * @returns {Promise<any>} Request response.
+ * @param data Request data.
+ * @param headers Request headers.
+ * @returns Request response.
  */
-export function request(data: import("axios").AxiosRequestConfig["data"], headers: import("axios").AxiosRequestConfig["headers"]): Promise<any>;
+declare const request: (data: GraphQLRequest, headers: NonNullable<AxiosRequestConfig["headers"]>) => Promise<AxiosResponse>;
+export { request };
 //# sourceMappingURL=http.d.ts.map

package/build/common/http.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"http.d.ts","sourceRoot":"","sources":["../../src/common/http.js"],"names":[],"mappings":"AAEA;;;;;;GAMG;AACH,8BAJW,OAAO,OAAO,EAAE,kBAAkB,CAAC,MAAM,CAAC,WAC1C,OAAO,OAAO,EAAE,kBAAkB,CAAC,SAAS,CAAC,GAC3C,OAAO,CAAC,GAAG,CAAC,CASxB"}
+{"version":3,"file":"http.d.ts","sourceRoot":"","sources":["../../src/common/http.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,kBAAkB,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE/D,wDAAwD;AACxD,UAAU,cAAc;IACtB,yBAAyB;IACzB,KAAK,EAAE,MAAM,CAAC;IACd,yCAAyC;IACzC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACpC;AAED;;;;;;GAMG;AACH,QAAA,MAAM,OAAO,GACX,MAAM,cAAc,EACpB,SAAS,WAAW,CAAC,kBAAkB,CAAC,SAAS,CAAC,CAAC,KAClD,OAAO,CAAC,aAAa,CAOvB,CAAC;AAEF,OAAO,EAAE,OAAO,EAAE,CAAC"}

package/build/common/http.js

@@ -2,9 +2,9 @@ import axios from "axios";
 /**
  * Send GraphQL request to GitHub API.
  *
- * @param {import('axios').AxiosRequestConfig['data']} data Request data.
- * @param {import('axios').AxiosRequestConfig['headers']} headers Request headers.
- * @returns {Promise<any>} Request response.
+ * @param data Request data.
+ * @param headers Request headers.
+ * @returns Request response.
  */
 const request = (data, headers) => {
     return axios({