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

package/build/translations.js

@@ -1,16 +1,15 @@
-// @ts-check
 import { encodeHTML } from "./common/html.js";
 /**
  * Retrieves stat card labels in the available locales.
  *
- * @param {object} props Function arguments.
- * @param {string} props.name The name of the locale.
- * @param {string} props.apostrophe Whether to use apostrophe or not.
- * @returns {object} The locales object.
+ * @param props Function arguments.
+ * @param props.name The name of the locale.
+ * @param props.apostrophe Whether to use apostrophe or not.
+ * @returns The locales object.
  *
  * @see https://www.andiamo.co.uk/resources/iso-language-codes/ for language codes.
  */
-const statCardLocales = ({ name, apostrophe }) => {
+const statCardLocales = ({ name, apostrophe, }) => {
     const encodedName = encodeHTML(name);
     return {
         "statcard.title": {
@@ -1131,8 +1130,8 @@ const availableLocales = Object.keys(repoCardLocales["repocard.archived"]);
 /**
  * Checks whether the locale is available or not.
  *
- * @param {string} locale The locale to check.
- * @returns {boolean} Boolean specifying whether the locale is available or not.
+ * @param locale The locale to check.
+ * @returns Boolean specifying whether the locale is available or not.
  */
 const isLocaleAvailable = (locale) => {
     return availableLocales.includes(locale.toLowerCase());

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stats-organization/github-readme-stats-core",
-  "version": "2.1.2",
+  "version": "2.1.4",
   "type": "module",
   "homepage": "https://github-stats-extended.vercel.app/frontend",
   "bugs": {
@@ -71,12 +71,12 @@
     "@testing-library/jest-dom": "6.9.1",
     "@uppercod/css-to-object": "1.1.1",
     "axios-mock-adapter": "2.1.0",
-    "js-yaml": "4.1.1",
-    "jsdom": "29.0.2",
-    "vitest": "4.1.4"
+    "js-yaml": "4.2.0",
+    "jsdom": "29.1.1",
+    "vitest": "4.1.8"
   },
   "dependencies": {
-    "axios": "^1.15.2",
+    "axios": "^1.17.0",
     "emoji-name-map": "^2.0.3",
     "github-username-regex": "^1.0.0"
   },

package/src/api/gist.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { renderGistCard } from "../cards/gist.js";
 import {
   MissingParamError,

package/src/api/index.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { renderStatsCard } from "../cards/stats.js";
 import {
   MissingParamError,

package/src/api/pin.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { renderRepoCard } from "../cards/repo.js";
 import {
   MissingParamError,

package/src/api/top-langs.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { renderTopLanguages } from "../cards/top-languages.js";
 import {
   MissingParamError,

package/src/api/wakatime.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { renderWakatimeCard } from "../cards/wakatime.js";
 import {
   MissingParamError,

package/src/cards/gist.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { default as Card } from "../common/Card.js";
 import { getCardColors } from "../common/color.js";
 import { kFormatter, wrapTextMultiline } from "../common/fmt.js";

package/src/cards/repo.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { Card } from "../common/Card.js";
 import { I18n } from "../common/I18n.js";
 import { getCardColors } from "../common/color.js";

package/src/cards/stats.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { Card } from "../common/Card.js";
 import { I18n } from "../common/I18n.js";
 import { getCardColors } from "../common/color.js";

package/src/cards/top-languages.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { Card } from "../common/Card.js";
 import { I18n } from "../common/I18n.js";
 import { fallbackColor, getCardColors } from "../common/color.js";

package/src/cards/wakatime.js

@@ -1,5 +1,3 @@
-// @ts-check
-
 import { Card } from "../common/Card.js";
 import { I18n } from "../common/I18n.js";
 import { getCardColors } from "../common/color.js";

package/src/common/{Card.js → Card.ts}

@@ -1,25 +1,46 @@
-// @ts-check
-
 import { encodeHTML } from "./html.js";
 import { flexLayout } from "./render.js";
 
+interface CardColors {
+  /** Card title color. */
+  titleColor?: string;
+  /** Card text color. */
+  textColor?: string;
+  /** Card icon color. */
+  iconColor?: string;
+  /** Card background color. */
+  bgColor?: string | Array<string>;
+  /** Card border color. */
+  borderColor?: string;
+}
+
 class Card {
+  width: number;
+  height: number;
+  hideBorder: boolean;
+  hideTitle: boolean;
+  border_radius: number;
+  colors: CardColors;
+  title: string;
+  css: string;
+  paddingX: number;
+  paddingY: number;
+  titlePrefixIcon: string | undefined;
+  animations: boolean;
+  a11yTitle: string;
+  a11yDesc: string;
+
   /**
    * Creates a new card instance.
    *
-   * @param {object} args Card arguments.
-   * @param {number=} args.width Card width.
-   * @param {number=} args.height Card height.
-   * @param {number=} args.border_radius Card border radius.
-   * @param {string=} args.customTitle Card custom title.
-   * @param {string=} args.defaultTitle Card default title.
-   * @param {string=} args.titlePrefixIcon Card title prefix icon.
-   * @param {object} [args.colors={}] Card colors arguments.
-   * @param {string=} args.colors.titleColor Card title color.
-   * @param {string=} args.colors.textColor Card text color.
-   * @param {string=} args.colors.iconColor Card icon color.
-   * @param {string|string[]=} args.colors.bgColor Card background color.
-   * @param {string=} args.colors.borderColor Card border color.
+   * @param props Card arguments.
+   * @param props.width Card width.
+   * @param props.height Card height.
+   * @param props.border_radius Card border radius.
+   * @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.
    */
   constructor({
     width = 100,
@@ -29,6 +50,14 @@ class Card {
     customTitle,
     defaultTitle = "",
     titlePrefixIcon,
+  }: {
+    width?: number;
+    height?: number;
+    border_radius?: number;
+    colors?: CardColors;
+    customTitle?: string;
+    defaultTitle?: string;
+    titlePrefixIcon?: string;
   }) {
     this.width = width;
     this.height = height;
@@ -40,10 +69,9 @@ class Card {
 
     // returns theme based colors with proper overrides and defaults
     this.colors = colors;
-    this.title =
-      customTitle === undefined
-        ? encodeHTML(defaultTitle)
-        : encodeHTML(customTitle);
+    this.title = encodeHTML(
+      customTitle === undefined ? defaultTitle : customTitle,
+    );
 
     this.css = "";
 
@@ -55,45 +83,44 @@ class Card {
     this.a11yDesc = "";
   }
 
-  /**
-   * @returns {void}
-   */
-  disableAnimations() {
+  disableAnimations(): void {
     this.animations = false;
   }
 
   /**
-   * @param {Object} props The props object.
-   * @param {string} props.title Accessibility title.
-   * @param {string} props.desc Accessibility description.
-   * @returns {void}
+   * @param props The props object.
+   * @param props.title Accessibility title.
+   * @param props.desc Accessibility description.
    */
-  setAccessibilityLabel({ title, desc }) {
+  setAccessibilityLabel({
+    title,
+    desc,
+  }: {
+    title: string;
+    desc: string;
+  }): void {
     this.a11yTitle = title;
     this.a11yDesc = desc;
   }
 
   /**
-   * @param {string} value The CSS to add to the card.
-   * @returns {void}
+   * @param value The CSS to add to the card.
    */
-  setCSS(value) {
+  setCSS(value: string): void {
     this.css = value;
   }
 
   /**
-   * @param {boolean} value Whether to hide the border or not.
-   * @returns {void}
+   * @param value Whether to hide the border or not.
    */
-  setHideBorder(value) {
+  setHideBorder(value: boolean): void {
     this.hideBorder = value;
   }
 
   /**
-   * @param {boolean} value Whether to hide the title or not.
-   * @returns {void}
+   * @param value Whether to hide the title or not.
    */
-  setHideTitle(value) {
+  setHideTitle(value: boolean): void {
     this.hideTitle = value;
     if (value) {
       this.height -= 30;
@@ -101,17 +128,16 @@ class Card {
   }
 
   /**
-   * @param {string} text The title to set.
-   * @returns {void}
+   * @param text The title to set.
    */
-  setTitle(text) {
+  setTitle(text: string): void {
     this.title = text;
   }
 
   /**
-   * @returns {string} The rendered card title.
+   * @returns The rendered card title.
    */
-  renderTitle() {
+  renderTitle(): string {
     const titleText = `
       <text
         x="0"
@@ -131,7 +157,7 @@ class Card {
         width="16"
         height="16"
       >
-        ${this.titlePrefixIcon}
+        ${String(this.titlePrefixIcon)}
       </svg>
     `;
     return `
@@ -148,9 +174,9 @@ class Card {
   }
 
   /**
-   * @returns {string} The rendered card gradient.
+   * @returns The rendered card gradient.
    */
-  renderGradient() {
+  renderGradient(): string {
     if (typeof this.colors.bgColor !== "object") {
       return "";
     }
@@ -161,13 +187,15 @@ class Card {
         <defs>
           <linearGradient
             id="gradient"
-            gradientTransform="rotate(${this.colors.bgColor[0]})"
+            gradientTransform="rotate(${String(this.colors.bgColor[0])})"
             gradientUnits="userSpaceOnUse"
           >
-            ${gradients.map((grad, index) => {
-              let offset = (index * 100) / (gradients.length - 1);
-              return `<stop offset="${offset}%" stop-color="#${grad}" />`;
-            })}
+            ${gradients
+              .map((grad, index) => {
+                const offset = (index * 100) / (gradients.length - 1);
+                return `<stop offset="${offset}%" stop-color="#${grad}" />`;
+              })
+              .join(",")}
           </linearGradient>
         </defs>
         `
@@ -177,9 +205,9 @@ class Card {
   /**
    * Retrieves css animations for a card.
    *
-   * @returns {string} Animation css.
+   * @returns Animation css.
    */
-  getAnimations = () => {
+  getAnimations = (): string => {
     return `
       /* Animations */
       @keyframes scaleInAnimation {
@@ -202,10 +230,10 @@ class Card {
   };
 
   /**
-   * @param {string} body The inner body of the card.
-   * @returns {string} The rendered card.
+   * @param body The inner body of the card.
+   * @returns The rendered card.
    */
-  render(body) {
+  render(body: string): string {
     return `
       <svg
         width="${this.width}"
@@ -221,7 +249,7 @@ class Card {
         <style>
           .header {
             font: 600 18px 'Segoe UI', Ubuntu, Sans-Serif;
-            fill: ${this.colors.titleColor};
+            fill: ${String(this.colors.titleColor)};
             animation: fadeInAnimation 0.8s ease-in-out forwards;
           }
           @supports(-moz-appearance: auto) {
@@ -232,9 +260,9 @@ class Card {
 
           ${this.getAnimations()}
           ${
-            this.animations === false
-              ? `* { animation-duration: 0s !important; animation-delay: 0s !important; }`
-              : ""
+            this.animations
+              ? ""
+              : `* { animation-duration: 0s !important; animation-delay: 0s !important; }`
           }
         </style>
 
@@ -246,12 +274,12 @@ class Card {
           y="0.5"
           rx="${this.border_radius}"
           height="99%"
-          stroke="${this.colors.borderColor}"
+          stroke="${String(this.colors.borderColor)}"
           width="${this.width - 1}"
           fill="${
             typeof this.colors.bgColor === "object"
               ? "url(#gradient)"
-              : this.colors.bgColor
+              : String(this.colors.bgColor)
           }"
           stroke-opacity="${this.hideBorder ? 0 : 1}"
         />

package/src/common/I18n.ts

@@ -0,0 +1,49 @@
+const FALLBACK_LOCALE = "en";
+
+/**
+ * I18n translation class.
+ */
+class I18n<Translations extends Record<string, Record<string, string>>> {
+  locale: string;
+  translations: Translations;
+
+  /**
+   * @param props Constructor arguments.
+   * @param props.locale Locale.
+   * @param props.translations Translations.
+   */
+  constructor({
+    locale,
+    translations,
+  }: {
+    locale?: string;
+    translations: Translations;
+  }) {
+    this.locale = locale || FALLBACK_LOCALE;
+    this.translations = translations;
+  }
+
+  /**
+   * Get translation.
+   *
+   * @param str String to translate.
+   * @returns Translated string.
+   */
+  t(str: keyof Translations & string): string {
+    const translation = this.translations[str];
+    if (!translation) {
+      throw new Error(`${str} Translation string not found`);
+    }
+
+    const localized = translation[this.locale];
+    if (!localized) {
+      throw new Error(
+        `'${str}' translation not found for locale '${this.locale}'`,
+      );
+    }
+
+    return localized;
+  }
+}
+
+export { I18n };

package/src/common/{color.js → color.ts}

@@ -1,14 +1,12 @@
-// @ts-check
-
 import { themes } from "../themes/index.js";
 
 /**
  * Checks if a string is a valid hex color.
  *
- * @param {string} hexColor String to check.
- * @returns {boolean} True if the given string is a valid hex color.
+ * @param hexColor String to check.
+ * @returns True if the given string is a valid hex color.
  */
-const isValidHexColor = (hexColor) => {
+const isValidHexColor = (hexColor: string): boolean => {
   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);
@@ -17,10 +15,10 @@ const isValidHexColor = (hexColor) => {
 /**
  * Check if the given string is a valid gradient.
  *
- * @param {string[]} colors Array of colors.
- * @returns {boolean} True if the given string is a valid gradient.
+ * @param colors Array of colors.
+ * @returns True if the given string is a valid gradient.
  */
-const isValidGradient = (colors) => {
+const isValidGradient = (colors: Array<string>): boolean => {
   return (
     colors.length > 2 &&
     colors.slice(1).every((color) => isValidHexColor(color))
@@ -30,48 +28,50 @@ const isValidGradient = (colors) => {
 /**
  * Retrieves a gradient if color has more than one valid hex codes else a single color.
  *
- * @param {string} color The color to parse.
- * @param {string | string[]} fallbackColor The fallback color.
- * @returns {string | string[]} The gradient or color.
+ * @param color The color to parse.
+ * @param fallbackColor The fallback color.
+ * @returns The gradient or color.
  */
-const fallbackColor = (color, fallbackColor) => {
-  let gradient = null;
-
-  let colors = color ? color.split(",") : [];
+const fallbackColor = (
+  color: string | undefined,
+  fallbackColor: string | Array<string>,
+): string | Array<string> => {
+  const colors = color ? color.split(",") : [];
   if (colors.length > 1 && isValidGradient(colors)) {
-    gradient = colors;
+    return colors;
   }
 
-  return (
-    (gradient ? gradient : isValidHexColor(color) && `#${color}`) ||
-    fallbackColor
-  );
+  if (color !== undefined && isValidHexColor(color)) {
+    return `#${color}`;
+  }
+
+  return fallbackColor;
 };
 
 /**
  * Object containing card colors.
- * @typedef {{
- *  titleColor: string;
- *  iconColor: string;
- *  textColor: string;
- *  bgColor: string | string[];
- *  borderColor: string;
- *  ringColor: string;
- * }} CardColors
  */
+interface CardColors {
+  titleColor: string;
+  iconColor: string;
+  textColor: string;
+  bgColor: string | Array<string>;
+  borderColor: string;
+  ringColor: string;
+}
 
 /**
  * Returns theme based colors with proper overrides and defaults.
  *
- * @param {Object} args Function arguments.
- * @param {string=} args.title_color Card title color.
- * @param {string=} args.text_color Card text color.
- * @param {string=} args.icon_color Card icon color.
- * @param {string=} args.bg_color Card background color.
- * @param {string=} args.border_color Card border color.
- * @param {string=} args.ring_color Card ring color.
- * @param {string=} args.theme Card theme.
- * @returns {CardColors} Card colors.
+ * @param props Function arguments.
+ * @param props.title_color Card title color.
+ * @param props.text_color Card text color.
+ * @param props.icon_color Card icon color.
+ * @param props.bg_color Card background color.
+ * @param props.border_color Card border color.
+ * @param props.ring_color Card ring color.
+ * @param props.theme Card theme.
+ * @returns Card colors.
  */
 const getCardColors = ({
   title_color,
@@ -81,19 +81,26 @@ const getCardColors = ({
   border_color,
   ring_color,
   theme,
-}) => {
-  const defaultTheme = themes["default"];
-  const isThemeProvided =
-    theme !== null && theme !== undefined && theme in themes;
-
-  // @ts-ignore
-  const selectedTheme = isThemeProvided ? themes[theme] : defaultTheme;
+}: {
+  title_color?: string;
+  text_color?: string;
+  icon_color?: string;
+  bg_color?: string;
+  border_color?: string;
+  ring_color?: string;
+  theme?: string;
+}): CardColors => {
+  const defaultTheme = themes.default;
+  const isThemeProvided = theme !== undefined && theme in themes;
+
+  const selectedTheme = isThemeProvided
+    ? themes[theme as keyof typeof themes]
+    : defaultTheme;
 
   const defaultBorderColor =
     "border_color" in selectedTheme
       ? selectedTheme.border_color
-      : // @ts-ignore
-        defaultTheme.border_color;
+      : defaultTheme.border_color;
 
   // get the color provided by the user else the theme color
   // finally if both colors are invalid fallback to default theme
@@ -104,11 +111,8 @@ const getCardColors = ({
 
   // get the color provided by the user else the theme color
   // finally if both colors are invalid we use the titleColor
-  const ringColor = fallbackColor(
-    // @ts-ignore
-    ring_color || selectedTheme.ring_color,
-    titleColor,
-  );
+  // NOTE: no built-in theme defines `ring_color`, so it falls back to the title color.
+  const ringColor = fallbackColor(ring_color, titleColor);
   const iconColor = fallbackColor(
     icon_color || selectedTheme.icon_color,
     "#" + defaultTheme.icon_color,