zudoku 0.0.0-fdf886de → 0.0.0-fe92c9e1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zudoku",
-  "version": "0.0.0-fdf886de",
+  "version": "0.0.0-fe92c9e1",
   "type": "module",
   "homepage": "https://zudoku.dev",
   "repository": {
@@ -140,95 +140,90 @@
     }
   },
   "dependencies": {
-    "@apidevtools/json-schema-ref-parser": "12.0.2",
-    "@envelop/core": "5.3.0",
+    "@apidevtools/json-schema-ref-parser": "14.1.1",
+    "@envelop/core": "5.3.2",
     "@graphql-typed-document-node/core": "3.2.0",
-    "@hookform/resolvers": "4.1.3",
     "@lekoarts/rehype-meta-as-attributes": "3.0.3",
-    "@mdx-js/react": "3.1.0",
+    "@mdx-js/react": "3.1.1",
     "@mdx-js/rollup": "3.1.0",
-    "@pothos/core": "4.7.0",
-    "@radix-ui/react-accordion": "1.2.11",
-    "@radix-ui/react-alert-dialog": "1.1.14",
-    "@radix-ui/react-aspect-ratio": "1.1.7",
-    "@radix-ui/react-checkbox": "1.3.2",
-    "@radix-ui/react-collapsible": "1.1.11",
-    "@radix-ui/react-dialog": "1.1.14",
-    "@radix-ui/react-dropdown-menu": "2.1.15",
-    "@radix-ui/react-hover-card": "1.1.14",
-    "@radix-ui/react-label": "2.1.7",
-    "@radix-ui/react-popover": "1.1.14",
-    "@radix-ui/react-progress": "1.1.7",
-    "@radix-ui/react-radio-group": "1.3.7",
-    "@radix-ui/react-scroll-area": "1.2.9",
-    "@radix-ui/react-select": "2.2.5",
-    "@radix-ui/react-slider": "1.3.5",
-    "@radix-ui/react-slot": "1.2.3",
-    "@radix-ui/react-switch": "1.2.5",
-    "@radix-ui/react-tabs": "1.1.12",
-    "@radix-ui/react-toggle": "1.1.9",
-    "@radix-ui/react-toggle-group": "1.1.10",
-    "@radix-ui/react-tooltip": "1.2.7",
-    "@radix-ui/react-visually-hidden": "1.2.3",
-    "@scalar/openapi-parser": "0.18.0",
+    "@pothos/core": "4.10.0",
+    "@radix-ui/react-accordion": "1.2.12",
+    "@radix-ui/react-alert-dialog": "1.1.15",
+    "@radix-ui/react-aspect-ratio": "1.1.8",
+    "@radix-ui/react-checkbox": "1.3.3",
+    "@radix-ui/react-collapsible": "1.1.12",
+    "@radix-ui/react-dialog": "1.1.15",
+    "@radix-ui/react-dropdown-menu": "2.1.16",
+    "@radix-ui/react-hover-card": "1.1.15",
+    "@radix-ui/react-label": "2.1.8",
+    "@radix-ui/react-popover": "1.1.15",
+    "@radix-ui/react-progress": "1.1.8",
+    "@radix-ui/react-radio-group": "1.3.8",
+    "@radix-ui/react-scroll-area": "1.2.10",
+    "@radix-ui/react-select": "2.2.6",
+    "@radix-ui/react-separator": "^1.1.8",
+    "@radix-ui/react-slider": "1.3.6",
+    "@radix-ui/react-slot": "1.2.4",
+    "@radix-ui/react-switch": "1.2.6",
+    "@radix-ui/react-tabs": "1.1.13",
+    "@radix-ui/react-toggle": "1.1.10",
+    "@radix-ui/react-toggle-group": "1.1.11",
+    "@radix-ui/react-tooltip": "1.2.8",
+    "@radix-ui/react-visually-hidden": "1.2.4",
+    "@scalar/openapi-parser": "0.23.2",
     "@sentry/node": "9.26.0",
-    "@shikijs/langs": "3.8.1",
-    "@shikijs/rehype": "3.8.1",
-    "@shikijs/themes": "3.8.1",
-    "@shikijs/transformers": "3.8.1",
-    "@sindresorhus/slugify": "2.2.1",
+    "@shikijs/engine-javascript": "3.15.0",
+    "@shikijs/langs": "3.15.0",
+    "@shikijs/rehype": "3.15.0",
+    "@shikijs/themes": "3.15.0",
+    "@shikijs/transformers": "3.15.0",
+    "@sindresorhus/slugify": "3.0.0",
     "@stefanprobst/rehype-extract-toc": "3.0.0",
-    "@tailwindcss/typography": "0.5.16",
-    "@tailwindcss/vite": "4.1.11",
-    "@tanem/react-nprogress": "5.0.55",
-    "@tanstack/react-query": "5.81.5",
-    "@types/react": "19.1.8",
-    "@types/react-dom": "19.1.6",
-    "@vitejs/plugin-react": "4.6.0",
+    "@tailwindcss/typography": "0.5.19",
+    "@tailwindcss/vite": "4.1.16",
+    "@tanem/react-nprogress": "5.0.56",
+    "@tanstack/react-query": "5.85.5",
+    "@types/react": "19.2.0",
+    "@types/react-dom": "19.2.0",
+    "@vitejs/plugin-react": "5.1.0",
+    "@x0k/json-schema-merge": "1.0.2",
     "@zudoku/httpsnippet": "10.0.9",
     "@zudoku/react-helmet-async": "2.0.5",
-    "allof-merge": "0.6.6",
+    "@zuplo/mcp": "^0.0.22",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
     "cmdk": "1.1.1",
-    "colorjs.io": "0.5.2",
-    "devlop": "^1.1.0",
-    "dotenv": "16.5.0",
     "embla-carousel-react": "8.6.0",
-    "estree-util-value-to-estree": "3.4.0",
+    "estree-util-value-to-estree": "3.4.1",
     "express": "5.1.0",
     "fast-equals": "5.2.2",
-    "framer-motion": "^12.12.2",
-    "glob": "11.0.3",
+    "glob": "11.1.0",
     "glob-parent": "6.0.2",
     "graphql": "16.11.0",
     "graphql-type-json": "0.3.2",
-    "graphql-yoga": "5.14.0",
+    "graphql-yoga": "5.16.0",
     "gray-matter": "4.0.3",
     "hast-util-to-jsx-runtime": "^2.3.6",
     "hast-util-to-string": "3.0.1",
-    "html-url-attributes": "^3.0.1",
     "http-terminator": "3.2.0",
-    "json-schema-to-typescript-lite": "14.1.0",
+    "javascript-stringify": "2.1.0",
+    "json-schema-to-typescript-lite": "15.0.0",
     "loglevel": "1.9.2",
-    "lru-cache": "11.1.0",
-    "lucide-react": "0.525.0",
-    "minimatch": "10.0.1",
-    "motion": "12.23.3",
+    "lucide-react": "0.548.0",
+    "motion": "12.23.12",
     "nanoevents": "^9.1.0",
     "next-themes": "0.4.6",
     "oauth4webapi": "2.17.0",
-    "object-hash": "3.0.0",
     "openapi-types": "12.1.3",
     "pagefind": "1.4.0-alpha.1",
     "picocolors": "1.1.1",
     "piscina": "5.1.3",
-    "posthog-node": "4.17.1",
+    "posthog-node": "5.7.0",
     "react-error-boundary": "6.0.0",
-    "react-hook-form": "7.60.0",
-    "react-is": "19.1.0",
+    "react-hook-form": "7.66.0",
+    "react-is": "19.2.0",
     "react-markdown": "10.1.0",
-    "react-router": "7.6.3",
+    "react-router": "7.8.2",
     "rehype-mdx-import-media": "1.2.0",
     "rehype-raw": "7.0.0",
     "rehype-slug": "6.0.0",
@@ -238,37 +233,32 @@
     "remark-frontmatter": "5.0.0",
     "remark-gfm": "4.0.1",
     "remark-mdx-frontmatter": "5.2.0",
-    "remark-parse": "^11.0.0",
-    "remark-rehype": "^11.1.2",
-    "rollup": "4.45.0",
+    "rollup": "4.52.5",
     "semver": "7.7.2",
-    "shiki": "3.8.1",
-    "sitemap": "8.0.0",
-    "spin-delay": "2.0.1",
-    "strip-ansi": "7.1.0",
+    "shiki": "3.15.0",
+    "sitemap": "9.0.0",
+    "strip-ansi": "7.1.2",
     "tailwind-merge": "3.3.1",
-    "tailwindcss": "4.1.11",
-    "ulidx": "2.4.1",
+    "tailwindcss": "4.1.16",
+    "tw-animate-css": "1.4.0",
     "unified": "^11.0.5",
     "unist-util-visit": "5.0.0",
     "vaul": "1.1.2",
     "vfile": "6.0.3",
-    "vite": "6.3.5",
-    "yaml": "2.8.0",
+    "vite": "6.4.1",
+    "yaml": "2.8.1",
     "yargs": "18.0.0",
-    "zod": "3.25.74",
-    "zod-to-ts": "1.2.0",
-    "zustand": "5.0.6"
+    "zod": "4.1.12",
+    "zustand": "5.0.8"
   },
   "devDependencies": {
-    "@graphql-codegen/cli": "5.0.7",
-    "@graphql-codegen/client-preset": "4.8.2",
-    "@inkeep/cxkit-types": "0.5.90",
-    "@testing-library/dom": "10.4.0",
-    "@testing-library/jest-dom": "6.6.3",
+    "@graphql-codegen/cli": "6.0.1",
+    "@inkeep/cxkit-types": "0.5.101",
+    "@testing-library/dom": "10.4.1",
+    "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.0",
     "@types/estree": "1.0.8",
-    "@types/express": "5.0.2",
+    "@types/express": "5.0.3",
     "@types/glob-parent": "5.1.3",
     "@types/har-format": "1.2.16",
     "@types/hast": "^3.0.4",
@@ -276,29 +266,31 @@
     "@types/mdast": "4.0.4",
     "@types/mdx": "2.0.13",
     "@types/node": "22.13.5",
-    "@types/object-hash": "3.0.6",
-    "@types/react-is": "19.0.0",
+    "@types/react-is": "19.2.0",
     "@types/semver": "7.7.0",
     "@types/unist": "^3.0.3",
     "@types/yargs": "17.0.33",
-    "@vitest/coverage-v8": "3.2.1",
-    "esbuild": "0.25.6",
-    "happy-dom": "18.0.1",
+    "@vitest/coverage-v8": "3.2.4",
+    "esbuild": "0.25.11",
+    "happy-dom": "20.0.10",
     "mdast-util-mdx": "3.0.0",
-    "react": "19.1.0",
-    "react-dom": "19.1.0",
+    "react": "19.2.0",
+    "react-dom": "19.2.0",
     "rollup-plugin-visualizer": "6.0.3",
-    "tsx": "4.19.4",
-    "typescript": "5.8.3",
-    "vitest": "3.2.4"
+    "tsx": "4.20.4",
+    "typescript": "5.9.3",
+    "vitest": "4.0.6"
   },
   "peerDependencies": {
     "@azure/msal-browser": "^4.13.0",
     "@clerk/clerk-js": "^5.63.1",
     "@sentry/react": "^9.12.0",
+    "@supabase/auth-ui-react": "^0.4.0",
+    "@supabase/auth-ui-shared": "^0.1.0",
     "@supabase/supabase-js": "^2.49.4",
-    "react": ">=19",
-    "react-dom": ">=19"
+    "firebase": "^12.6.0",
+    "react": ">=19.2.0",
+    "react-dom": ">=19.2.0"
   },
   "peerDependenciesMeta": {
     "@azure/msal-browser": {
@@ -312,6 +304,15 @@
     },
     "@supabase/supabase-js": {
       "optional": true
+    },
+    "@supabase/auth-ui-react": {
+      "optional": true
+    },
+    "@supabase/auth-ui-shared": {
+      "optional": true
+    },
+    "firebase": {
+      "optional": true
     }
   },
   "scripts": {

package/src/app/ZuploBuildConfig.ts

@@ -1,4 +1,4 @@
-import { z } from "zod/v4";
+import { z } from "zod";
 
 export const EntitlementsSchema = z.object({
   devPortalZuploBranding: z.boolean(),

package/src/app/entry.client.tsx

@@ -1,15 +1,16 @@
+import config from "virtual:zudoku-config";
 import { createRoot, hydrateRoot } from "react-dom/client";
 import {
   createBrowserRouter,
   matchRoutes,
   type RouteObject,
 } from "react-router";
-import config from "virtual:zudoku-config";
 import "vite/modulepreload-polyfill";
 import { Bootstrap } from "zudoku/__internal";
 import { getRoutesByConfig } from "./main.js";
 
 const routes = getRoutesByConfig(config);
+// biome-ignore lint/style/noNonNullAssertion: We know the root element exists
 const root = document.getElementById("root")!;
 
 declare global {
@@ -33,7 +34,7 @@ if (root.childElementCount > 0) {
 }
 
 if (import.meta.env.IS_ZUPLO) {
-  // eslint-disable-next-line no-console
+  // biome-ignore lint/suspicious/noConsole: Logging allowed here
   console.log(
     `%cPowered by Zuplo v${window.ZUDOKU_VERSION}`,
     [
@@ -46,7 +47,7 @@ if (import.meta.env.IS_ZUPLO) {
     ].join(" ;"),
   );
 } else {
-  // eslint-disable-next-line no-console
+  // biome-ignore lint/suspicious/noConsole: Logging allowed here
   console.log(
     `%cZUDOKU%c by Zuplo v${window.ZUDOKU_VERSION}`,
     [
@@ -69,7 +70,7 @@ if (import.meta.env.IS_ZUPLO) {
       "letter-spacing: 5px",
     ].join(" ;"),
   );
-  // eslint-disable-next-line no-console
+  // biome-ignore lint/suspicious/noConsole: Logging allowed here
   console.log("» Learn more about Zudoku https://zudoku.dev");
 }
 
@@ -84,7 +85,7 @@ async function hydrateLazyRoutes(routes: RouteObject[]) {
       lazyMatches.map(async (m) => {
         if (typeof m.route.lazy !== "function") return;
 
-        const routeModule = await m.route.lazy!();
+        const routeModule = await m.route.lazy();
         Object.assign(m.route, { ...routeModule, lazy: undefined });
       }),
     );

package/src/app/entry.server.tsx

@@ -1,8 +1,8 @@
+import { Transform } from "node:stream";
 import { dehydrate, QueryClient } from "@tanstack/react-query";
-import { type HelmetData } from "@zudoku/react-helmet-async";
+import type { HelmetData } from "@zudoku/react-helmet-async";
 import type express from "express";
 import logger from "loglevel";
-import { Transform } from "node:stream";
 import { renderToPipeableStream, renderToStaticMarkup } from "react-dom/server";
 import {
   createStaticHandler,
@@ -49,7 +49,7 @@ export const render = async ({
     if ([301, 302, 303, 307, 308].includes(context.status)) {
       return response.redirect(
         import.meta.env.PROD ? context.status : 307,
-        context.headers.get("Location")!,
+        context.headers.get("Location") ?? "",
       );
     }
 
@@ -122,12 +122,22 @@ export const render = async ({
             !query.queryKey.includes(NO_DEHYDRATE),
         });
 
-        response.end(
-          htmlEnd?.replace(
-            "</body>",
-            `<script>window.DATA=${JSON.stringify(dehydrated)}</script></body>`,
-          ),
-        );
+        if (!htmlEnd) return response.end();
+
+        const closingTag = "</body>";
+        const idx = htmlEnd.lastIndexOf(closingTag);
+
+        if (idx === -1) return response.end(htmlEnd);
+
+        const serialized = JSON.stringify(dehydrated)
+          .replace(/</g, "\\u003c")
+          .replace(/>/g, "\\u003e");
+
+        response.write(htmlEnd.slice(0, idx));
+        response.write("<script>window.DATA=");
+        response.write(serialized);
+        response.write("</script>");
+        response.end(htmlEnd.slice(idx));
       });
 
       pipe(transformStream);

package/src/app/env.ts

@@ -1,4 +1,4 @@
-import z from "zod";
+import { z } from "zod";
 import { BuildConfigSchema } from "./ZuploBuildConfig.js";
 
 const getZuploBuildConfig = () => {
@@ -11,17 +11,17 @@ const getZuploBuildConfig = () => {
     return zuploBuildConfig;
   } catch (error) {
     if (error instanceof z.ZodError) {
-      // eslint-disable-next-line no-console
+      // biome-ignore lint/suspicious/noConsole: Logging allowed here
       console.error("ZUPLO_BUILD_CONFIG is invalid.");
-      // eslint-disable-next-line no-console
-      console.log(error.errors);
+      // biome-ignore lint/suspicious/noConsole: Logging allowed here
+      console.log(error.issues);
       return undefined;
     }
-    // eslint-disable-next-line no-console
+    // biome-ignore lint/suspicious/noConsole: Logging allowed here
     console.error(
       "ZUPLO_BUILD_CONFIG is a reserved environment variable and cannot be used for custom configuration. Please remove it from your environment variables.",
     );
-    // eslint-disable-next-line no-console
+    // biome-ignore lint/suspicious/noConsole: Logging allowed here
     console.log(error);
     return undefined;
   }

package/src/app/main.css

@@ -1,11 +1,54 @@
 /* @vite-plugin-inject defaultTheme */
 @import "tailwindcss" source("..");
+@import "tw-animate-css";
 
 /* @vite-plugin-inject main */
 
 @plugin "@tailwindcss/typography";
 @custom-variant dark (&:is(.dark *));
 
+@theme inline {
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-destructive-foreground: var(--destructive-foreground);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --font-sans: var(--font-sans);
+  --font-mono: var(--font-mono);
+  --font-serif: var(--font-serif);
+}
+
 @utility prose {
   a {
     @apply font-normal underline-offset-4 hover:text-primary;
@@ -32,6 +75,27 @@
   code::after {
     content: none;
   }
+
+  ol > li {
+    @apply my-2.5;
+  }
+
+  header:has(h1) {
+    & + p {
+      @apply my-0;
+    }
+  }
+
+  h2 {
+    @apply mt-8 mb-4;
+  }
+
+  ul.contains-task-list {
+    @apply list-none px-0;
+    li {
+      @apply my-1 flex items-center gap-1.5;
+    }
+  }
 }
 
 @layer base {
@@ -91,7 +155,8 @@
   }
 
   ::selection {
-    @apply bg-primary text-primary-foreground;
+    background: var(--color-primary);
+    color: var(--color-primary-foreground);
   }
 
   .bg-primary::selection,
@@ -109,14 +174,6 @@
     cursor: pointer;
   }
 
-  .prose.prose {
-    ul.contains-task-list {
-      @apply list-none px-0;
-      li {
-        @apply flex items-center gap-2;
-      }
-    }
-  }
 
   .shiki {
     counter-reset: line;
@@ -153,12 +210,12 @@
     @apply tabular-nums inline-flex items-baseline justify-end me-4 w-3 text-muted-foreground/25;
   }
 
-  .light .shiki.not-inline .line {
-    @apply block -mx-4 px-4 w-[calc(100%+2rem)];
+  .shiki.not-inline .line {
+    @apply block -mx-4 px-4;
+    width: calc(100% + --spacing(4));
     --highlighted-bg: hsl(from var(--shiki-light-bg) h s calc(l - 6));
   }
   .dark .shiki.not-inline .line {
-    @apply block -mx-4 px-4 w-[calc(100%+2rem)];
     --highlighted-bg: hsl(from var(--shiki-dark-bg) h s calc(l + 10));
   }
 
@@ -168,17 +225,12 @@
 
   .shiki .line.highlighted::after {
     @apply absolute left-0 top-0 bottom-0 right-auto translate-x-full content-[''];
-    border-left: 3px solid
+    border-left: 4px solid
       hsl(from var(--highlighted-bg) h s calc(l + 4 * var(--dark)));
   }
 
   .shiki .highlighted-word {
-    --highlighted-bg: hsl(
-      from var(--muted) h s calc(l + 4 * var(--dark)) / 50%
-    );
-
-    @apply bg-(--highlighted-bg) px-0.5 rounded;
-    box-shadow: 0 0 0 4px var(--highlighted-bg);
+    @apply inline-block bg-(--highlighted-bg) px-0.5 rounded;
   }
 
   select {

package/src/app/main.tsx

@@ -1,4 +1,3 @@
-import type { RouteObject } from "react-router";
 import { configuredApiKeysPlugin } from "virtual:zudoku-api-keys-plugin";
 import {
   configuredApiCatalogPlugins,
@@ -11,6 +10,7 @@ import { configuredNavigation } from "virtual:zudoku-navigation";
 import { configuredRedirectPlugin } from "virtual:zudoku-redirect-plugin";
 import { configuredSearchPlugin } from "virtual:zudoku-search-plugin";
 import { registerShiki } from "virtual:zudoku-shiki-register";
+import type { RouteObject } from "react-router";
 import "virtual:zudoku-theme.css";
 import {
   BuildCheck,
@@ -23,8 +23,8 @@ import {
 import { Zudoku } from "zudoku/components";
 import { Outlet } from "zudoku/router";
 import type { ZudokuConfig } from "../config/config.js";
-import type { ZudokuContextOptions } from "../lib/core/ZudokuContext.js";
 import { isNavigationPlugin } from "../lib/core/plugins.js";
+import type { ZudokuContextOptions } from "../lib/core/ZudokuContext.js";
 import { highlighter } from "../lib/shiki.js";
 import { ZuploEnv } from "./env.js";
 import "./main.css";
@@ -90,7 +90,11 @@ export const getRoutesByOptions = (
           }))
         : [],
     )
-    .concat([{ path: "*", element: <StatusPage statusCode={404} /> }]);
+    .concat([{ path: "*", element: <StatusPage statusCode={404} /> }])
+    .map((route) => ({
+      ...route,
+      errorElement: <RouterError className="w-full m-0" />,
+    }));
 
   // @TODO Detect conflicts in routes and log warning
 

package/src/app/standalone.tsx

@@ -13,7 +13,12 @@ if (!root) {
 }
 
 const apiUrl = root.getAttribute("data-api-url");
-const title = document.getElementsByTagName("title")[0]!.innerText;
+
+if (!apiUrl) {
+  throw new Error("No api url found");
+}
+
+const title = document.getElementsByTagName("title")[0]?.innerText;
 const logoUrl = root.getAttribute("data-logo-url");
 
 // IMPORTANT: This component must not contain tailwind classes
@@ -42,7 +47,7 @@ const config = {
     // Using the plugin directly because there's no config file to load in the virtual plugins
     openApiPlugin({
       type: "url",
-      input: apiUrl!,
+      input: apiUrl,
       path: "/",
     }),
   ],

package/src/lib/MissingIcon.tsx

@@ -1,4 +1,4 @@
-import { CircleDashed, LucideProps } from "lucide-react";
+import { CircleDashed, type LucideProps } from "lucide-react";
 import {
   Tooltip,
   TooltipContent,

package/src/lib/assets/language-icons/c.tsx

@@ -0,0 +1,31 @@
+import type { SVGProps } from "react";
+
+const CIcon = (props: SVGProps<SVGSVGElement>) => (
+  <svg
+    xmlns="http://www.w3.org/2000/svg"
+    width="1em"
+    height="1em"
+    viewBox="0 0 38.000089 42.000031"
+    {...props}
+  >
+    <title>C</title>
+    <path
+      fill="#004482"
+      d="M17.903.286a2.247 2.247 0 0 1 2.193 0L36.903 9.72A2.12 2.12 0 0 1 38 11.566v18.867c0 .762-.418 1.466-1.097 1.847l-16.807 9.434a2.247 2.247 0 0 1-2.193 0L1.096 32.28A2.122 2.122 0 0 1 0 30.434V11.567c0-.762.418-1.466 1.097-1.847C4.451 7.837 14.549 2.17 17.903.286z"
+    />
+    <path
+      fill="#659ad2"
+      d="M.304 31.404C.038 31.048 0 30.71 0 30.255V11.496c0-.758.417-1.458 1.094-1.836L17.842.28c.677-.379 1.594-.37 2.271.008 3.343 1.872 13.371 7.46 16.714 9.331.27.152.476.335.66.576z"
+    />
+    <path
+      fill="#fff"
+      d="M19 7c7.727 0 14 6.273 14 14s-6.273 14-14 14S5 28.727 5 21 11.273 7 19 7zm0 7c3.863 0 7 3.136 7 7 0 3.863-3.137 7-7 7s-7-3.137-7-7c0-3.864 3.136-7 7-7z"
+    />
+    <path
+      fill="#00599c"
+      d="M37.485 10.205c.516.483.506 1.211.506 1.784 0 3.795-.032 14.59.009 18.384.004.396-.127.813-.323 1.127L18.593 21z"
+    />
+  </svg>
+);
+
+export default CIcon;