@industry-theme/repository-composition-panels 0.7.26 → 0.7.28

package/dist/{index-BinFidNv.js → index-BGEfrxLy.js}

@@ -106207,7 +106207,7 @@ const browserExt = {
   },
   test: () => true,
   load: async () => {
-    await import("./browserAll-CIuBn_fB.js");
+    await import("./browserAll-B5ulNvRV.js");
   }
 };
 const webworkerExt = {
@@ -106218,7 +106218,7 @@ const webworkerExt = {
   },
   test: () => typeof self !== "undefined" && self.WorkerGlobalScope !== void 0,
   load: async () => {
-    await import("./webworkerAll-CLYFrCAq.js");
+    await import("./webworkerAll-1U-w2f78.js");
   }
 };
 class ObservablePoint {
@@ -153929,6 +153929,89 @@ const TelemetryCoveragePanel = ({ context: context2, events }) => {
     }
   );
 };
+const languageColors = {
+  TypeScript: 3242182,
+  JavaScript: 16244510,
+  Python: 16766011,
+  Rust: 14591364,
+  Go: 44504,
+  Java: 11563545,
+  "C++": 15944573,
+  C: 5592405,
+  "C#": 1541632,
+  Ruby: 13382701,
+  PHP: 5201301,
+  Swift: 15749432,
+  Kotlin: 11107327,
+  Scala: 12725568,
+  Elixir: 7228030,
+  Haskell: 6180998,
+  Clojure: 14374997,
+  Shell: 9035857,
+  HTML: 14896166,
+  CSS: 5651836,
+  Vue: 4307075,
+  Svelte: 16727552
+};
+function darkenColor(color2, percent) {
+  const r2 = Math.max(0, (color2 >> 16 & 255) * (1 - percent));
+  const g2 = Math.max(0, (color2 >> 8 & 255) * (1 - percent));
+  const b2 = Math.max(0, (color2 & 255) * (1 - percent));
+  return `#${Math.round(r2).toString(16).padStart(2, "0")}${Math.round(g2).toString(16).padStart(2, "0")}${Math.round(b2).toString(16).padStart(2, "0")}`;
+}
+function hslToHex(h2, s2, l2) {
+  s2 /= 100;
+  l2 /= 100;
+  const a2 = s2 * Math.min(l2, 1 - l2);
+  const f2 = (n2) => {
+    const k2 = (n2 + h2 / 30) % 12;
+    const color2 = l2 - a2 * Math.max(Math.min(k2 - 3, 9 - k2, 1), -1);
+    return Math.round(255 * color2);
+  };
+  return (f2(0) << 16) + (f2(8) << 8) + f2(4);
+}
+function hashStringToColor(str2) {
+  let hash = 0;
+  for (let i2 = 0; i2 < str2.length; i2++) {
+    hash = str2.charCodeAt(i2) + ((hash << 5) - hash);
+  }
+  const h2 = Math.abs(hash % 360);
+  const s2 = 30 + Math.abs((hash >> 8) % 30);
+  const l2 = 35 + Math.abs((hash >> 16) % 20);
+  return hslToHex(h2, s2, l2);
+}
+function parseColor$1(color2) {
+  if (typeof color2 === "number") return color2;
+  if (color2.startsWith("#")) return parseInt(color2.slice(1), 16);
+  return hashStringToColor(color2);
+}
+function generateCardColors(baseColor) {
+  return {
+    cardBg: darkenColor(baseColor, 0.6),
+    cardBorder: darkenColor(baseColor, 0.7),
+    cardHighlight: darkenColor(baseColor, 0.4),
+    windowGradient: [
+      darkenColor(baseColor, 0.85),
+      darkenColor(baseColor, 0.8)
+    ],
+    panelGradient: [
+      darkenColor(baseColor, 0.4),
+      darkenColor(baseColor, 0.6)
+    ],
+    panelBorder: darkenColor(baseColor, 0.3)
+  };
+}
+function getRepositoryColor(repository) {
+  var _a;
+  if (repository.bookColor) {
+    return parseColor$1(repository.bookColor);
+  }
+  const language2 = (_a = repository.github) == null ? void 0 : _a.primaryLanguage;
+  if (language2 && languageColors[language2]) {
+    return languageColors[language2];
+  }
+  return hashStringToColor(repository.name);
+}
 const licenseBorderColors = {
   MIT: "#228b22",
   // Forest green - open/welcoming
@@ -153953,34 +154036,362 @@ function formatCount(count2) {
   if (count2 < 1e6) return `${(count2 / 1e3).toFixed(1)}k`;
   return `${(count2 / 1e6).toFixed(1)}M`;
 }
+const STARFIELD_BACKGROUND = `
+  radial-gradient(1px 1px at 10% 15%, rgba(255,255,255,0.4) 50%, transparent 50%),
+  radial-gradient(1px 1px at 25% 35%, rgba(255,255,255,0.3) 50%, transparent 50%),
+  radial-gradient(1px 1px at 40% 10%, rgba(255,255,255,0.35) 50%, transparent 50%),
+  radial-gradient(1px 1px at 55% 45%, rgba(255,255,255,0.25) 50%, transparent 50%),
+  radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,0.4) 50%, transparent 50%),
+  radial-gradient(1px 1px at 85% 40%, rgba(255,255,255,0.3) 50%, transparent 50%),
+  radial-gradient(1px 1px at 15% 55%, rgba(255,255,255,0.35) 50%, transparent 50%),
+  radial-gradient(1px 1px at 35% 70%, rgba(255,255,255,0.25) 50%, transparent 50%),
+  radial-gradient(1px 1px at 50% 85%, rgba(255,255,255,0.4) 50%, transparent 50%),
+  radial-gradient(1px 1px at 65% 60%, rgba(255,255,255,0.3) 50%, transparent 50%),
+  radial-gradient(1px 1px at 80% 75%, rgba(255,255,255,0.35) 50%, transparent 50%),
+  radial-gradient(1px 1px at 95% 90%, rgba(255,255,255,0.25) 50%, transparent 50%),
+  radial-gradient(1.5px 1.5px at 20% 25%, rgba(255,255,255,0.5) 50%, transparent 50%),
+  radial-gradient(1.5px 1.5px at 60% 30%, rgba(200,220,255,0.45) 50%, transparent 50%),
+  radial-gradient(1.5px 1.5px at 45% 65%, rgba(255,255,255,0.5) 50%, transparent 50%),
+  radial-gradient(1.5px 1.5px at 75% 80%, rgba(220,200,255,0.45) 50%, transparent 50%),
+  radial-gradient(2px 2px at 30% 50%, rgba(255,255,255,0.6) 50%, transparent 50%),
+  radial-gradient(2px 2px at 70% 55%, rgba(200,220,255,0.55) 50%, transparent 50%),
+  radial-gradient(2px 2px at 90% 15%, rgba(255,255,255,0.6) 50%, transparent 50%)
+`;
+const CardLayout = ({
+  color: color2,
+  owner,
+  stars,
+  label,
+  description,
+  files,
+  language: language2,
+  license,
+  packages,
+  children: children2
+}) => {
+  const { theme: theme2 } = useTheme();
+  const baseColor = parseColor$1(color2);
+  const colors = generateCardColors(baseColor);
+  const licenseBorder = license ? licenseBorderColors[license] : null;
+  const showHeader = owner || stars !== void 0 && stars > 0;
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      style: {
+        position: "relative",
+        display: "flex",
+        flexDirection: "column",
+        backgroundColor: colors.cardBg,
+        padding: "8px 12px 28px 12px",
+        border: `${licenseBorder ? "5px" : "3px"} solid ${licenseBorder || colors.cardBorder}`,
+        width: "100%",
+        height: "100%",
+        boxSizing: "border-box",
+        overflow: "hidden",
+        boxShadow: licenseBorder ? `inset 0 0 0 2px ${licenseBorder}40, 0 0 8px ${licenseBorder}60` : `inset 0 0 0 2px ${colors.cardHighlight}`
+      },
+      children: [
+        showHeader && /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              display: "flex",
+              justifyContent: "space-between",
+              alignItems: "center",
+              marginBottom: "8px",
+              marginLeft: "-4px",
+              marginRight: "-4px",
+              minHeight: "40px",
+              flexShrink: 0
+            },
+            children: [
+              owner ? /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "6px",
+                    minWidth: 0,
+                    flex: 1
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "img",
+                      {
+                        src: `https://github.com/${owner}.png?size=40`,
+                        alt: owner,
+                        style: {
+                          width: "28px",
+                          height: "28px",
+                          borderRadius: "6px",
+                          border: "1px solid rgba(255,255,255,0.3)",
+                          flexShrink: 0
+                        }
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontSize: theme2.fontSizes[1],
+                          fontWeight: theme2.fontWeights.medium,
+                          color: "#e0e0e0",
+                          textShadow: "0 1px 2px rgba(0,0,0,0.5)",
+                          fontFamily: theme2.fonts.body,
+                          overflow: "hidden",
+                          textOverflow: "ellipsis",
+                          whiteSpace: "nowrap"
+                        },
+                        children: owner
+                      }
+                    )
+                  ]
+                }
+              ) : /* @__PURE__ */ jsx("div", {}),
+              stars !== void 0 && stars > 0 && /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    alignItems: "center",
+                    gap: "4px",
+                    flexShrink: 0
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontSize: theme2.fontSizes[1],
+                          fontWeight: theme2.fontWeights.bold,
+                          color: "#ffffff",
+                          textShadow: "0 1px 2px rgba(0,0,0,0.5)",
+                          fontFamily: theme2.fonts.body
+                        },
+                        children: formatCount(stars)
+                      }
+                    ),
+                    /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontSize: theme2.fontSizes[1],
+                          fontWeight: theme2.fontWeights.bold,
+                          color: "#fbbf24",
+                          textShadow: "0 1px 2px rgba(0,0,0,0.5)"
+                        },
+                        children: "★"
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              flex: 1,
+              minHeight: 0,
+              position: "relative",
+              background: `linear-gradient(180deg, ${colors.windowGradient[0]} 0%, ${colors.windowGradient[1]} 100%)`,
+              border: `2px solid ${colors.cardHighlight}`,
+              boxShadow: "inset 0 2px 4px rgba(0,0,0,0.3)",
+              overflow: "hidden",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
+            },
+            children: [
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    position: "absolute",
+                    inset: 0,
+                    pointerEvents: "none",
+                    backgroundImage: STARFIELD_BACKGROUND,
+                    backgroundSize: "100% 100%"
+                  }
+                }
+              ),
+              children2,
+              label && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    position: "absolute",
+                    bottom: 0,
+                    left: 0,
+                    right: 0,
+                    padding: "6px 8px",
+                    background: "linear-gradient(transparent, rgba(0,0,0,0.7))",
+                    fontSize: theme2.fontSizes[2],
+                    fontWeight: theme2.fontWeights.bold,
+                    color: "#ffffff",
+                    fontFamily: theme2.fonts.body,
+                    whiteSpace: "nowrap",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    textShadow: "0 1px 2px rgba(0,0,0,0.5)",
+                    textAlign: "center"
+                  },
+                  title: label,
+                  children: label
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            style: {
+              marginTop: "12px",
+              padding: "8px",
+              background: `linear-gradient(180deg, ${colors.panelGradient[0]} 0%, ${colors.panelGradient[1]} 100%)`,
+              border: `1px solid ${colors.panelBorder}`,
+              flexShrink: 0
+            },
+            children: [
+              description && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    fontSize: theme2.fontSizes[1],
+                    color: "#e0e0e0",
+                    marginBottom: "6px",
+                    fontFamily: theme2.fonts.body,
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    display: "-webkit-box",
+                    WebkitLineClamp: 2,
+                    WebkitBoxOrient: "vertical",
+                    textShadow: "0 1px 2px rgba(0,0,0,0.3)",
+                    lineHeight: 1.4
+                  },
+                  title: description,
+                  children: description
+                }
+              ),
+              /* @__PURE__ */ jsx(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    justifyContent: "center",
+                    flexWrap: "wrap",
+                    gap: "10px",
+                    fontSize: theme2.fontSizes[1],
+                    color: "#e0e0e0",
+                    fontFamily: theme2.fonts.body
+                  },
+                  children: files !== void 0 && files > 0 && /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
+                    /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 16 16", fill: "#94a3b8", children: /* @__PURE__ */ jsx(
+                      "path",
+                      {
+                        d: "M3 1h7l3 3v11H3V1zm7 0v3h3M5 8h6M5 11h6",
+                        stroke: "#94a3b8",
+                        strokeWidth: "1",
+                        fill: "none"
+                      }
+                    ) }),
+                    formatCount(files)
+                  ] })
+                }
+              ),
+              packages && packages.length > 1 && /* @__PURE__ */ jsxs(
+                "div",
+                {
+                  style: {
+                    marginTop: "6px",
+                    display: "flex",
+                    flexWrap: "wrap",
+                    justifyContent: "center",
+                    gap: "4px"
+                  },
+                  children: [
+                    packages.slice(0, 6).map((pkg, i2) => /* @__PURE__ */ jsx(
+                      "span",
+                      {
+                        style: {
+                          fontSize: theme2.fontSizes[0],
+                          color: "#e0e0e0",
+                          backgroundColor: "rgba(0,0,0,0.2)",
+                          padding: "2px 6px",
+                          borderRadius: "3px",
+                          fontFamily: theme2.fonts.body,
+                          borderLeft: `2px solid ${typeof pkg.color === "string" ? pkg.color : `#${(pkg.color || 8947848).toString(16).padStart(6, "0")}`}`
+                        },
+                        children: pkg.name
+                      },
+                      i2
+                    )),
+                    packages.length > 6 && /* @__PURE__ */ jsxs(
+                      "span",
+                      {
+                        style: {
+                          fontSize: theme2.fontSizes[0],
+                          color: "#a0a0a0",
+                          fontFamily: theme2.fonts.body
+                        },
+                        children: [
+                          "+",
+                          packages.length - 6,
+                          " more"
+                        ]
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        ),
+        language2 && /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              position: "absolute",
+              bottom: "4px",
+              left: "8px",
+              fontSize: theme2.fontSizes[0],
+              fontWeight: theme2.fontWeights.medium,
+              color: "#e0e0e0",
+              textShadow: "0 1px 1px rgba(0,0,0,0.3)",
+              fontFamily: theme2.fonts.body
+            },
+            children: language2
+          }
+        ),
+        license && /* @__PURE__ */ jsx(
+          "div",
+          {
+            style: {
+              position: "absolute",
+              bottom: "-3px",
+              right: "-3px",
+              backgroundColor: licenseBorder || colors.cardHighlight,
+              padding: "3px 10px",
+              borderRadius: 0,
+              fontFamily: theme2.fonts.body,
+              fontSize: theme2.fontSizes[0],
+              fontWeight: theme2.fontWeights.bold,
+              color: "#ffffff",
+              textShadow: "0 1px 1px rgba(0,0,0,0.3)"
+            },
+            children: license
+          }
+        )
+      ]
+    }
+  );
+};
 const ISO_TILE_WIDTH$1 = 64;
 const ISO_TILE_HEIGHT$1 = 32;
-function darkenColor$1(color2, percent) {
-  const r2 = Math.max(0, (color2 >> 16 & 255) * (1 - percent));
-  const g2 = Math.max(0, (color2 >> 8 & 255) * (1 - percent));
-  const b2 = Math.max(0, (color2 & 255) * (1 - percent));
-  return `#${Math.round(r2).toString(16).padStart(2, "0")}${Math.round(g2).toString(16).padStart(2, "0")}${Math.round(b2).toString(16).padStart(2, "0")}`;
-}
-function generateCardColors$1(baseColor) {
-  return {
-    cardBg: darkenColor$1(baseColor, 0.6),
-    cardBorder: darkenColor$1(baseColor, 0.7),
-    cardHighlight: darkenColor$1(baseColor, 0.4),
-    windowGradient: [
-      darkenColor$1(baseColor, 0.85),
-      darkenColor$1(baseColor, 0.8)
-    ],
-    panelGradient: [
-      darkenColor$1(baseColor, 0.4),
-      darkenColor$1(baseColor, 0.6)
-    ],
-    panelBorder: darkenColor$1(baseColor, 0.3)
-  };
-}
-function parseColor$1(color2) {
-  if (typeof color2 === "number") return color2;
-  return parseInt(color2.replace("#", ""), 16);
-}
 function getPackagePositions$1(count2, footprintWidth, footprintHeight) {
   const positions = [];
   const spacing = 0.18;
@@ -154224,321 +154635,30 @@ const RepoSprite = ({
     onPackageHoverEnd
   ]);
   if (variant === "card") {
-    const baseColor = parseColor$1(color2);
-    const colors = generateCardColors$1(baseColor);
-    const licenseBorder = license ? licenseBorderColors[license] : null;
-    return /* @__PURE__ */ jsxs(
-      "div",
+    return /* @__PURE__ */ jsx(
+      CardLayout,
       {
-        style: {
-          position: "relative",
-          display: "flex",
-          flexDirection: "column",
-          backgroundColor: colors.cardBg,
-          padding: "36px 12px 20px 12px",
-          border: `${licenseBorder ? "5px" : "3px"} solid ${licenseBorder || colors.cardBorder}`,
-          width: "100%",
-          height: "100%",
-          boxSizing: "border-box",
-          overflow: "hidden",
-          boxShadow: licenseBorder ? `inset 0 0 0 2px ${licenseBorder}40, 0 0 8px ${licenseBorder}60` : `inset 0 0 0 2px ${colors.cardHighlight}`
-        },
-        children: [
-          owner && /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                position: "absolute",
-                top: "10px",
-                left: "10px",
-                display: "flex",
-                alignItems: "center",
-                gap: "6px",
-                zIndex: 10
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "img",
-                  {
-                    src: `https://github.com/${owner}.png?size=40`,
-                    alt: owner,
-                    style: {
-                      width: "18px",
-                      height: "18px",
-                      borderRadius: "50%",
-                      border: "1px solid rgba(255,255,255,0.3)"
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontSize: "12px",
-                      fontWeight: theme2.fontWeights.medium,
-                      color: "#e0e0e0",
-                      textShadow: "0 1px 2px rgba(0,0,0,0.5)",
-                      fontFamily: theme2.fonts.body,
-                      maxWidth: "80px",
-                      overflow: "hidden",
-                      textOverflow: "ellipsis",
-                      whiteSpace: "nowrap"
-                    },
-                    children: owner
-                  }
-                )
-              ]
-            }
-          ),
-          stars !== void 0 && stars > 0 && /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                position: "absolute",
-                top: "10px",
-                right: "10px",
-                display: "flex",
-                alignItems: "center",
-                gap: "4px",
-                zIndex: 10
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontSize: "10px",
-                      fontWeight: theme2.fontWeights.bold,
-                      color: "#fbbf24",
-                      textShadow: "0 1px 2px rgba(0,0,0,0.5)"
-                    },
-                    children: "★"
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "span",
-                  {
-                    style: {
-                      fontSize: "16px",
-                      fontWeight: theme2.fontWeights.bold,
-                      color: "#ffffff",
-                      textShadow: "0 1px 2px rgba(0,0,0,0.5)",
-                      fontFamily: theme2.fonts.body
-                    },
-                    children: formatCount(stars)
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                flex: 1,
-                minHeight: 0,
-                position: "relative",
-                background: `linear-gradient(180deg, ${colors.windowGradient[0]} 0%, ${colors.windowGradient[1]} 100%)`,
-                border: `2px solid ${colors.cardHighlight}`,
-                boxShadow: "inset 0 2px 4px rgba(0,0,0,0.3)",
-                overflow: "hidden",
-                display: "flex",
-                alignItems: "center",
-                justifyContent: "center"
-              },
-              children: [
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    style: {
-                      position: "absolute",
-                      inset: 0,
-                      pointerEvents: "none",
-                      backgroundImage: `
-                radial-gradient(1px 1px at 10% 15%, rgba(255,255,255,0.4) 50%, transparent 50%),
-                radial-gradient(1px 1px at 25% 35%, rgba(255,255,255,0.3) 50%, transparent 50%),
-                radial-gradient(1px 1px at 40% 10%, rgba(255,255,255,0.35) 50%, transparent 50%),
-                radial-gradient(1px 1px at 55% 45%, rgba(255,255,255,0.25) 50%, transparent 50%),
-                radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,0.4) 50%, transparent 50%),
-                radial-gradient(1px 1px at 85% 40%, rgba(255,255,255,0.3) 50%, transparent 50%),
-                radial-gradient(1px 1px at 15% 55%, rgba(255,255,255,0.35) 50%, transparent 50%),
-                radial-gradient(1px 1px at 35% 70%, rgba(255,255,255,0.25) 50%, transparent 50%),
-                radial-gradient(1px 1px at 50% 85%, rgba(255,255,255,0.4) 50%, transparent 50%),
-                radial-gradient(1px 1px at 65% 60%, rgba(255,255,255,0.3) 50%, transparent 50%),
-                radial-gradient(1px 1px at 80% 75%, rgba(255,255,255,0.35) 50%, transparent 50%),
-                radial-gradient(1px 1px at 95% 90%, rgba(255,255,255,0.25) 50%, transparent 50%),
-                radial-gradient(1.5px 1.5px at 20% 25%, rgba(255,255,255,0.5) 50%, transparent 50%),
-                radial-gradient(1.5px 1.5px at 60% 30%, rgba(200,220,255,0.45) 50%, transparent 50%),
-                radial-gradient(1.5px 1.5px at 45% 65%, rgba(255,255,255,0.5) 50%, transparent 50%),
-                radial-gradient(1.5px 1.5px at 75% 80%, rgba(220,200,255,0.45) 50%, transparent 50%),
-                radial-gradient(2px 2px at 30% 50%, rgba(255,255,255,0.6) 50%, transparent 50%),
-                radial-gradient(2px 2px at 70% 55%, rgba(200,220,255,0.55) 50%, transparent 50%),
-                radial-gradient(2px 2px at 90% 15%, rgba(255,255,255,0.6) 50%, transparent 50%)
-              `,
-                      backgroundSize: "100% 100%"
-                    }
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    ref: containerRef,
-                    style: {
-                      width: "100%",
-                      height: "100%",
-                      display: "flex",
-                      alignItems: "center",
-                      justifyContent: "center"
-                    }
-                  }
-                )
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsxs(
-            "div",
-            {
-              style: {
-                marginTop: "12px",
-                padding: "8px",
-                background: `linear-gradient(180deg, ${colors.panelGradient[0]} 0%, ${colors.panelGradient[1]} 100%)`,
-                border: `1px solid ${colors.panelBorder}`,
-                flexShrink: 0
-              },
-              children: [
-                label && /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    style: {
-                      fontSize: theme2.fontSizes[2],
-                      fontWeight: theme2.fontWeights.bold,
-                      color: "#ffffff",
-                      marginBottom: "6px",
-                      fontFamily: theme2.fonts.body,
-                      whiteSpace: "nowrap",
-                      overflow: "hidden",
-                      textOverflow: "ellipsis",
-                      textShadow: "0 1px 2px rgba(0,0,0,0.3)",
-                      textAlign: "center"
-                    },
-                    children: label
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  "div",
-                  {
-                    style: {
-                      display: "flex",
-                      justifyContent: "center",
-                      flexWrap: "wrap",
-                      gap: "10px",
-                      fontSize: theme2.fontSizes[1],
-                      color: "#e0e0e0",
-                      fontFamily: theme2.fonts.body
-                    },
-                    children: files !== void 0 && files > 0 && /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        style: { display: "flex", alignItems: "center", gap: "4px" },
-                        children: [
-                          /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 16 16", fill: "#94a3b8", children: /* @__PURE__ */ jsx(
-                            "path",
-                            {
-                              d: "M3 1h7l3 3v11H3V1zm7 0v3h3M5 8h6M5 11h6",
-                              stroke: "#94a3b8",
-                              strokeWidth: "1",
-                              fill: "none"
-                            }
-                          ) }),
-                          formatCount(files)
-                        ]
-                      }
-                    )
-                  }
-                ),
-                packages && packages.length > 1 && /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    style: {
-                      marginTop: "6px",
-                      display: "flex",
-                      flexWrap: "wrap",
-                      justifyContent: "center",
-                      gap: "4px"
-                    },
-                    children: [
-                      packages.slice(0, 6).map((pkg, i2) => /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          style: {
-                            fontSize: theme2.fontSizes[0],
-                            color: "#e0e0e0",
-                            backgroundColor: "rgba(0,0,0,0.2)",
-                            padding: "2px 6px",
-                            borderRadius: "3px",
-                            fontFamily: theme2.fonts.body,
-                            borderLeft: `2px solid ${typeof pkg.color === "string" ? pkg.color : `#${(pkg.color || 8947848).toString(16).padStart(6, "0")}`}`
-                          },
-                          children: pkg.name
-                        },
-                        i2
-                      )),
-                      packages.length > 6 && /* @__PURE__ */ jsxs(
-                        "span",
-                        {
-                          style: {
-                            fontSize: theme2.fontSizes[0],
-                            color: "#a0a0a0",
-                            fontFamily: theme2.fonts.body
-                          },
-                          children: [
-                            "+",
-                            packages.length - 6,
-                            " more"
-                          ]
-                        }
-                      )
-                    ]
-                  }
-                )
-              ]
-            }
-          ),
-          language2 && /* @__PURE__ */ jsx(
-            "div",
-            {
-              style: {
-                position: "absolute",
-                bottom: "4px",
-                left: "8px",
-                fontSize: theme2.fontSizes[0],
-                fontWeight: theme2.fontWeights.medium,
-                color: "#e0e0e0",
-                textShadow: "0 1px 1px rgba(0,0,0,0.3)",
-                fontFamily: theme2.fonts.body
-              },
-              children: language2
-            }
-          ),
-          license && /* @__PURE__ */ jsx(
-            "div",
-            {
-              style: {
-                position: "absolute",
-                bottom: "-3px",
-                right: "-3px",
-                backgroundColor: licenseBorder || colors.cardHighlight,
-                padding: "3px 10px",
-                borderRadius: "3px 0 0 0",
-                fontSize: theme2.fontSizes[0],
-                fontWeight: theme2.fontWeights.bold,
-                color: "#ffffff",
-                textShadow: "0 1px 1px rgba(0,0,0,0.3)"
-              },
-              children: license
+        color: color2,
+        owner,
+        stars,
+        label,
+        files,
+        language: language2,
+        license,
+        packages,
+        children: /* @__PURE__ */ jsx(
+          "div",
+          {
+            ref: containerRef,
+            style: {
+              width: "100%",
+              height: "100%",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center"
             }
-          )
-        ]
+          }
+        )
       }
     );
   }
@@ -154554,65 +154674,6 @@ const RepoSprite = ({
     }
   );
 };
-const languageColors$1 = {
-  TypeScript: 3242182,
-  JavaScript: 16244510,
-  Python: 3634859,
-  Rust: 14591364,
-  Go: 44504,
-  Java: 11563545,
-  "C++": 15944573,
-  C: 5592405,
-  "C#": 1541632,
-  Ruby: 13382701,
-  PHP: 5201301,
-  Swift: 15749432,
-  Kotlin: 11107327,
-  Scala: 12725568,
-  Elixir: 7228030,
-  Haskell: 6180998,
-  Clojure: 14374997,
-  Shell: 9035857,
-  HTML: 14896166,
-  CSS: 5651836,
-  Vue: 4307075,
-  Svelte: 16727552
-};
-function hashStringToColor$1(str2) {
-  let hash = 0;
-  for (let i2 = 0; i2 < str2.length; i2++) {
-    hash = str2.charCodeAt(i2) + ((hash << 5) - hash);
-  }
-  const h2 = Math.abs(hash % 360);
-  const s2 = 30 + Math.abs((hash >> 8) % 30);
-  const l2 = 35 + Math.abs((hash >> 16) % 20);
-  return hslToHex(h2, s2, l2);
-}
-function hslToHex(h2, s2, l2) {
-  s2 /= 100;
-  l2 /= 100;
-  const a2 = s2 * Math.min(l2, 1 - l2);
-  const f2 = (n2) => {
-    const k2 = (n2 + h2 / 30) % 12;
-    const color2 = l2 - a2 * Math.max(Math.min(k2 - 3, 9 - k2, 1), -1);
-    return Math.round(255 * color2);
-  };
-  return (f2(0) << 16) + (f2(8) << 8) + f2(4);
-}
-function getRepositoryColor$1(repository) {
-  var _a;
-  if (repository.bookColor) {
-    if (repository.bookColor.startsWith("#")) {
-      return parseInt(repository.bookColor.slice(1), 16);
-    }
-    return hashStringToColor$1(repository.bookColor);
-  }
-  const language2 = (_a = repository.github) == null ? void 0 : _a.primaryLanguage;
-  if (language2 && languageColors$1[language2]) {
-    return languageColors$1[language2];
-  }
-  return hashStringToColor$1(repository.name);
-}
 function transformPackages(packages) {
   if (!packages || packages.length === 0) {
     return void 0;
@@ -154643,7 +154704,7 @@ const RepoCard = ({
 }) => {
   var _a, _b, _c, _d, _e2, _f;
   const size = sizeOverride ?? calculateRepositorySize(repository.metrics);
-  const color2 = colorOverride ?? getRepositoryColor$1(repository);
+  const color2 = colorOverride ?? getRepositoryColor(repository);
   const packages = transformPackages(repository.packages);
   const spriteProps = {
     size,
@@ -154949,80 +155010,6 @@ function destroySharedApp() {
     isAppDestroyed = true;
   }
 }
-const languageColors = {
-  TypeScript: 3242182,
-  JavaScript: 16244510,
-  Python: 3634859,
-  Rust: 14591364,
-  Go: 44504,
-  Java: 11563545,
-  "C++": 15944573,
-  C: 5592405,
-  "C#": 1541632,
-  Ruby: 13382701,
-  PHP: 5201301,
-  Swift: 15749432,
-  Kotlin: 11107327,
-  Shell: 9035857,
-  HTML: 14896166,
-  CSS: 5651836,
-  Vue: 4307075,
-  Svelte: 16727552
-};
-function hashStringToColor(str2) {
-  let hash = 0;
-  for (let i2 = 0; i2 < str2.length; i2++) {
-    hash = str2.charCodeAt(i2) + ((hash << 5) - hash);
-  }
-  const h2 = Math.abs(hash % 360);
-  const s2 = 30 + Math.abs((hash >> 8) % 30);
-  const l2 = 35 + Math.abs((hash >> 16) % 20);
-  const sNorm = s2 / 100;
-  const lNorm = l2 / 100;
-  const a2 = sNorm * Math.min(lNorm, 1 - lNorm);
-  const f2 = (n2) => {
-    const k2 = (n2 + h2 / 30) % 12;
-    const color2 = lNorm - a2 * Math.max(Math.min(k2 - 3, 9 - k2, 1), -1);
-    return Math.round(255 * color2);
-  };
-  return (f2(0) << 16) + (f2(8) << 8) + f2(4);
-}
-function darkenColor(color2, percent) {
-  const r2 = Math.max(0, (color2 >> 16 & 255) * (1 - percent));
-  const g2 = Math.max(0, (color2 >> 8 & 255) * (1 - percent));
-  const b2 = Math.max(0, (color2 & 255) * (1 - percent));
-  return `#${Math.round(r2).toString(16).padStart(2, "0")}${Math.round(g2).toString(16).padStart(2, "0")}${Math.round(b2).toString(16).padStart(2, "0")}`;
-}
-function generateCardColors(baseColor) {
-  return {
-    cardBg: darkenColor(baseColor, 0.6),
-    cardBorder: darkenColor(baseColor, 0.7),
-    cardHighlight: darkenColor(baseColor, 0.4),
-    windowGradient: [
-      darkenColor(baseColor, 0.85),
-      darkenColor(baseColor, 0.8)
-    ],
-    panelGradient: [
-      darkenColor(baseColor, 0.4),
-      darkenColor(baseColor, 0.6)
-    ],
-    panelBorder: darkenColor(baseColor, 0.3)
-  };
-}
-function getRepositoryColor(repository) {
-  var _a;
-  if (repository.bookColor) {
-    if (repository.bookColor.startsWith("#")) {
-      return parseInt(repository.bookColor.slice(1), 16);
-    }
-    return hashStringToColor(repository.bookColor);
-  }
-  const language2 = (_a = repository.github) == null ? void 0 : _a.primaryLanguage;
-  if (language2 && languageColors[language2]) {
-    return languageColors[language2];
-  }
-  return hashStringToColor(repository.name);
-}
 const RepoCardStatic = ({
   repository,
   packages,
@@ -155032,13 +155019,8 @@ const RepoCardStatic = ({
   spriteSize = 160
 }) => {
   var _a, _b, _c, _d, _e2;
-  const { theme: theme2 } = useTheme();
   const [spriteDataUrl, setSpriteDataUrl] = useState(null);
   const [isLoading, setIsLoading] = useState(true);
-  const license = (_a = repository.github) == null ? void 0 : _a.license;
-  const licenseBorder = license ? licenseBorderColors[license] : null;
-  const stars = (_b = repository.github) == null ? void 0 : _b.stars;
-  const files = (_c = repository.metrics) == null ? void 0 : _c.fileCount;
   const size = calculateRepositorySize(repository.metrics);
   const color2 = getRepositoryColor(repository);
   const colors = generateCardColors(color2);
@@ -155074,336 +155056,54 @@ const RepoCardStatic = ({
       mounted = false;
     };
   }, [size, color2, packages, repository, spriteSize]);
-  return /* @__PURE__ */ jsxs(
+  const spriteContent = isLoading ? /* @__PURE__ */ jsx(
     "div",
     {
       style: {
-        position: "relative",
-        display: "flex",
-        flexDirection: "column",
-        backgroundColor: colors.cardBg,
-        padding: "36px 12px 20px 12px",
-        border: `${licenseBorder ? "5px" : "3px"} solid ${licenseBorder || colors.cardBorder}`,
-        width,
-        height,
-        boxSizing: "border-box",
-        overflow: "hidden",
-        boxShadow: licenseBorder ? `inset 0 0 0 2px ${licenseBorder}40, 0 0 8px ${licenseBorder}60` : `inset 0 0 0 2px ${colors.cardHighlight}`
-      },
-      children: [
-        ((_d = repository.github) == null ? void 0 : _d.owner) && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              top: "10px",
-              left: "10px",
-              display: "flex",
-              alignItems: "center",
-              gap: "6px",
-              zIndex: 10
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "img",
-                {
-                  src: `https://github.com/${repository.github.owner}.png?size=40`,
-                  alt: repository.github.owner,
-                  style: {
-                    width: "18px",
-                    height: "18px",
-                    borderRadius: "50%",
-                    border: "1px solid rgba(255,255,255,0.3)"
-                  }
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  style: {
-                    fontSize: "12px",
-                    fontWeight: theme2.fontWeights.medium,
-                    color: "#e0e0e0",
-                    textShadow: "0 1px 2px rgba(0,0,0,0.5)",
-                    fontFamily: theme2.fonts.body,
-                    maxWidth: "80px",
-                    overflow: "hidden",
-                    textOverflow: "ellipsis",
-                    whiteSpace: "nowrap"
-                  },
-                  children: repository.github.owner
-                }
-              )
-            ]
-          }
-        ),
-        stars !== void 0 && stars > 0 && /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              top: "10px",
-              right: "10px",
-              display: "flex",
-              alignItems: "center",
-              gap: "4px",
-              zIndex: 10
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  style: {
-                    fontSize: "10px",
-                    fontWeight: theme2.fontWeights.bold,
-                    color: "#fbbf24",
-                    textShadow: "0 1px 2px rgba(0,0,0,0.5)"
-                  },
-                  children: "★"
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  style: {
-                    fontSize: "16px",
-                    fontWeight: theme2.fontWeights.bold,
-                    color: "#ffffff",
-                    textShadow: "0 1px 2px rgba(0,0,0,0.5)",
-                    fontFamily: theme2.fonts.body
-                  },
-                  children: formatCount(stars)
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              flex: 1,
-              minHeight: 0,
-              position: "relative",
-              background: `linear-gradient(180deg, ${colors.windowGradient[0]} 0%, ${colors.windowGradient[1]} 100%)`,
-              border: `2px solid ${colors.cardHighlight}`,
-              boxShadow: "inset 0 2px 4px rgba(0,0,0,0.3)",
-              overflow: "hidden",
-              display: "flex",
-              alignItems: "center",
-              justifyContent: "center"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    position: "absolute",
-                    inset: 0,
-                    pointerEvents: "none",
-                    backgroundImage: `
-              radial-gradient(1px 1px at 10% 15%, rgba(255,255,255,0.4) 50%, transparent 50%),
-              radial-gradient(1px 1px at 25% 35%, rgba(255,255,255,0.3) 50%, transparent 50%),
-              radial-gradient(1px 1px at 40% 10%, rgba(255,255,255,0.35) 50%, transparent 50%),
-              radial-gradient(1px 1px at 55% 45%, rgba(255,255,255,0.25) 50%, transparent 50%),
-              radial-gradient(1px 1px at 70% 20%, rgba(255,255,255,0.4) 50%, transparent 50%),
-              radial-gradient(1px 1px at 85% 40%, rgba(255,255,255,0.3) 50%, transparent 50%),
-              radial-gradient(1px 1px at 15% 55%, rgba(255,255,255,0.35) 50%, transparent 50%),
-              radial-gradient(1px 1px at 35% 70%, rgba(255,255,255,0.25) 50%, transparent 50%),
-              radial-gradient(1px 1px at 50% 85%, rgba(255,255,255,0.4) 50%, transparent 50%),
-              radial-gradient(1px 1px at 65% 60%, rgba(255,255,255,0.3) 50%, transparent 50%),
-              radial-gradient(1px 1px at 80% 75%, rgba(255,255,255,0.35) 50%, transparent 50%),
-              radial-gradient(1px 1px at 95% 90%, rgba(255,255,255,0.25) 50%, transparent 50%),
-              radial-gradient(1.5px 1.5px at 20% 25%, rgba(255,255,255,0.5) 50%, transparent 50%),
-              radial-gradient(1.5px 1.5px at 60% 30%, rgba(200,220,255,0.45) 50%, transparent 50%),
-              radial-gradient(1.5px 1.5px at 45% 65%, rgba(255,255,255,0.5) 50%, transparent 50%),
-              radial-gradient(1.5px 1.5px at 75% 80%, rgba(220,200,255,0.45) 50%, transparent 50%),
-              radial-gradient(2px 2px at 30% 50%, rgba(255,255,255,0.6) 50%, transparent 50%),
-              radial-gradient(2px 2px at 70% 55%, rgba(200,220,255,0.55) 50%, transparent 50%),
-              radial-gradient(2px 2px at 90% 15%, rgba(255,255,255,0.6) 50%, transparent 50%)
-            `,
-                    backgroundSize: "100% 100%"
-                  }
-                }
-              ),
-              isLoading ? /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    width: spriteSize * 0.5,
-                    height: spriteSize * 0.5,
-                    backgroundColor: `${colors.cardHighlight}40`,
-                    borderRadius: "8px",
-                    animation: "pulse 1.5s ease-in-out infinite"
-                  }
-                }
-              ) : spriteDataUrl ? /* @__PURE__ */ jsx(
-                "img",
-                {
-                  src: spriteDataUrl,
-                  alt: repository.name,
-                  style: {
-                    maxWidth: "100%",
-                    maxHeight: "100%",
-                    objectFit: "contain"
-                  }
-                }
-              ) : /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    width: spriteSize * 0.5,
-                    height: spriteSize * 0.5,
-                    backgroundColor: `#${color2.toString(16).padStart(6, "0")}`,
-                    borderRadius: "8px",
-                    opacity: 0.5
-                  }
-                }
-              )
-            ]
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              marginTop: "12px",
-              padding: "8px",
-              background: `linear-gradient(180deg, ${colors.panelGradient[0]} 0%, ${colors.panelGradient[1]} 100%)`,
-              border: `1px solid ${colors.panelBorder}`,
-              flexShrink: 0
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    fontSize: theme2.fontSizes[2],
-                    fontWeight: theme2.fontWeights.bold,
-                    color: "#ffffff",
-                    marginBottom: "6px",
-                    fontFamily: theme2.fonts.body,
-                    whiteSpace: "nowrap",
-                    overflow: "hidden",
-                    textOverflow: "ellipsis",
-                    textShadow: "0 1px 2px rgba(0,0,0,0.3)",
-                    textAlign: "center"
-                  },
-                  title: repository.name,
-                  children: repository.name
-                }
-              ),
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    display: "flex",
-                    justifyContent: "center",
-                    flexWrap: "wrap",
-                    gap: "10px",
-                    fontSize: theme2.fontSizes[1],
-                    color: "#e0e0e0",
-                    fontFamily: theme2.fonts.body
-                  },
-                  children: files !== void 0 && files > 0 && /* @__PURE__ */ jsxs("span", { style: { display: "flex", alignItems: "center", gap: "4px" }, children: [
-                    /* @__PURE__ */ jsx("svg", { width: "12", height: "12", viewBox: "0 0 16 16", fill: "#94a3b8", children: /* @__PURE__ */ jsx(
-                      "path",
-                      {
-                        d: "M3 1h7l3 3v11H3V1zm7 0v3h3M5 8h6M5 11h6",
-                        stroke: "#94a3b8",
-                        strokeWidth: "1",
-                        fill: "none"
-                      }
-                    ) }),
-                    formatCount(files)
-                  ] })
-                }
-              ),
-              packages && packages.length > 1 && /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  style: {
-                    marginTop: "6px",
-                    display: "flex",
-                    flexWrap: "wrap",
-                    justifyContent: "center",
-                    gap: "4px"
-                  },
-                  children: [
-                    packages.slice(0, 6).map((pkg, i2) => /* @__PURE__ */ jsx(
-                      "span",
-                      {
-                        style: {
-                          fontSize: theme2.fontSizes[0],
-                          color: "#e0e0e0",
-                          backgroundColor: "rgba(0,0,0,0.2)",
-                          padding: "2px 6px",
-                          borderRadius: "3px",
-                          fontFamily: theme2.fonts.body,
-                          borderLeft: `2px solid ${typeof pkg.color === "string" ? pkg.color : `#${(pkg.color || 8947848).toString(16).padStart(6, "0")}`}`
-                        },
-                        children: pkg.name
-                      },
-                      i2
-                    )),
-                    packages.length > 6 && /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        style: {
-                          fontSize: theme2.fontSizes[0],
-                          color: "#a0a0a0",
-                          fontFamily: theme2.fonts.body
-                        },
-                        children: [
-                          "+",
-                          packages.length - 6,
-                          " more"
-                        ]
-                      }
-                    )
-                  ]
-                }
-              )
-            ]
-          }
-        ),
-        ((_e2 = repository.github) == null ? void 0 : _e2.primaryLanguage) && /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              bottom: "4px",
-              left: "8px",
-              fontSize: theme2.fontSizes[0],
-              fontWeight: theme2.fontWeights.medium,
-              color: "#e0e0e0",
-              textShadow: "0 1px 1px rgba(0,0,0,0.3)",
-              fontFamily: theme2.fonts.body
-            },
-            children: repository.github.primaryLanguage
-          }
-        ),
-        license && /* @__PURE__ */ jsx(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              bottom: "-3px",
-              right: "-3px",
-              backgroundColor: licenseBorder || colors.cardHighlight,
-              padding: "3px 10px",
-              borderRadius: "3px 0 0 0",
-              fontSize: theme2.fontSizes[0],
-              fontWeight: theme2.fontWeights.bold,
-              color: "#ffffff",
-              textShadow: "0 1px 1px rgba(0,0,0,0.3)"
-            },
-            children: license
-          }
-        )
-      ]
+        width: spriteSize * 0.5,
+        height: spriteSize * 0.5,
+        backgroundColor: `${colors.cardHighlight}40`,
+        borderRadius: "8px",
+        animation: "pulse 1.5s ease-in-out infinite"
+      }
+    }
+  ) : spriteDataUrl ? /* @__PURE__ */ jsx(
+    "img",
+    {
+      src: spriteDataUrl,
+      alt: repository.name,
+      style: {
+        maxWidth: "100%",
+        maxHeight: "100%",
+        objectFit: "contain"
+      }
+    }
+  ) : /* @__PURE__ */ jsx(
+    "div",
+    {
+      style: {
+        width: spriteSize * 0.5,
+        height: spriteSize * 0.5,
+        backgroundColor: `#${color2.toString(16).padStart(6, "0")}`,
+        borderRadius: "8px",
+        opacity: 0.5
+      }
     }
   );
+  return /* @__PURE__ */ jsx("div", { style: { width, height }, children: /* @__PURE__ */ jsx(
+    CardLayout,
+    {
+      color: color2,
+      owner: (_a = repository.github) == null ? void 0 : _a.owner,
+      stars: (_b = repository.github) == null ? void 0 : _b.stars,
+      label: repository.name,
+      files: (_c = repository.metrics) == null ? void 0 : _c.fileCount,
+      language: (_d = repository.github) == null ? void 0 : _d.primaryLanguage,
+      license: (_e2 = repository.github) == null ? void 0 : _e2.license,
+      packages,
+      children: spriteContent
+    }
+  ) });
 };
 const panels = [
   {
@@ -155575,4 +155275,4 @@ export {
   RepoCardStatic as y,
   renderSpriteToDataUrl as z
 };
-//# sourceMappingURL=index-BinFidNv.js.map
+//# sourceMappingURL=index-BGEfrxLy.js.map