zudoku 0.0.0-f2c28ed → 0.0.0-f36627bd

package/src/app/ZuploBuildConfig.ts

@@ -19,14 +19,14 @@ export const EntitlementsSchema = z.object({
 
 export const BuildConfigSchema = z.object({
   entitlements: EntitlementsSchema,
-  environmentType: z.string(),
+  environmentType: z.string().optional(),
   deploymentName: z.string(),
-  deploymentUrl: z.string(),
-  projectId: z.string(),
-  projectType: z.string(),
-  sourceType: z.string(),
-  accountName: z.string(),
-  projectName: z.string(),
+  deploymentUrl: z.string().optional(),
+  projectId: z.string().optional(),
+  projectType: z.string().optional(),
+  sourceType: z.string().optional(),
+  accountName: z.string().optional(),
+  projectName: z.string().optional(),
 });
 
 export type BuildConfig = z.infer<typeof BuildConfigSchema>;

package/src/app/defaultTheme.css

@@ -0,0 +1,73 @@
+/**
+ * Default theme for Zudoku. Based on shadcn/ui zinc base colors.
+ * See: https://ui.shadcn.com/docs/theming#zinc
+ */
+
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.141 0.005 285.823);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.141 0.005 285.823);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.141 0.005 285.823);
+  --primary: oklch(0.21 0.006 285.885);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.967 0.001 286.375);
+  --secondary-foreground: oklch(0.21 0.006 285.885);
+  --muted: oklch(0.967 0.001 286.375);
+  --muted-foreground: oklch(0.552 0.016 285.938);
+  --accent: oklch(0.967 0.001 286.375);
+  --accent-foreground: oklch(0.21 0.006 285.885);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.92 0.004 286.32);
+  --input: oklch(0.92 0.004 286.32);
+  --ring: oklch(0.705 0.015 286.067);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.141 0.005 285.823);
+  --sidebar-primary: oklch(0.21 0.006 285.885);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.967 0.001 286.375);
+  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
+  --sidebar-border: oklch(0.92 0.004 286.32);
+  --sidebar-ring: oklch(0.705 0.015 286.067);
+}
+
+.dark {
+  --background: oklch(0.141 0.005 285.823);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.21 0.006 285.885);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.21 0.006 285.885);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.92 0.004 286.32);
+  --primary-foreground: oklch(0.21 0.006 285.885);
+  --secondary: oklch(0.274 0.006 286.033);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.274 0.006 286.033);
+  --muted-foreground: oklch(0.705 0.015 286.067);
+  --accent: oklch(0.274 0.006 286.033);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.552 0.016 285.938);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.21 0.006 285.885);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.274 0.006 286.033);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.552 0.016 285.938);
+}

package/src/app/demo.tsx

@@ -1,7 +1,7 @@
 import logger from "loglevel";
 import { createRoot } from "react-dom/client";
 import { createBrowserRouter } from "react-router";
-import { Bootstrap } from "zudoku/components";
+import { Bootstrap } from "zudoku/__internal";
 import type { ZudokuConfig } from "../config/validators/validate.js";
 import DemoAnnouncement from "../lib/demo/DemoAnnouncement.js";
 import { openApiPlugin } from "../lib/plugins/openapi/index.js";
@@ -10,6 +10,10 @@ import "./main.css";
 import { getRoutesByConfig } from "./main.js";
 
 const apiUrl = new URL(window.location.href).searchParams.get("api-url");
+const logoUrl = new URL(window.location.href).searchParams.get("logo-url");
+const logoWidth = new URL(window.location.href).searchParams.get("logo-width");
+const title =
+  new URL(window.location.href).searchParams.get("title") ?? "Zudoku Demo";
 
 if (!apiUrl) {
   throw new Error(
@@ -29,16 +33,17 @@ if (!root) {
 // IMPORTANT: This component must not contain tailwind classes
 // This directory is not processed by the tailwind plugin
 
-const config = {
-  page: {
-    pageTitle: "",
+const config: ZudokuConfig = {
+  site: {
+    title,
     banner: {
       message: <DemoAnnouncement />,
     },
   },
-  topNavigation: [
+  navigation: [
     {
-      id: "/",
+      type: "link",
+      to: "/",
       label: "API Reference",
     },
   ],
@@ -47,11 +52,24 @@ const config = {
     openApiPlugin({
       type: "url",
       input: apiUrl,
-      navigationId: "/",
+      path: "/",
     }),
   ],
 } satisfies ZudokuConfig;
 
+if (logoUrl && logoWidth) {
+  config.site = {
+    ...config.site,
+    logo: {
+      src: {
+        light: logoUrl,
+        dark: logoUrl,
+      },
+      width: logoWidth,
+    },
+  };
+}
+
 const routes = getRoutesByConfig(config);
 const router = createBrowserRouter(routes, {
   basename: window.location.pathname,

package/src/app/entry.client.tsx

@@ -1,17 +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 "virtual:zudoku-theme.css";
 import "vite/modulepreload-polyfill";
-import { Bootstrap } from "zudoku/components";
-import "./main.css";
+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 {
@@ -35,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}`,
     [
@@ -48,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}`,
     [
@@ -71,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");
 }
 
@@ -86,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,
@@ -10,12 +10,10 @@ import {
   isRouteErrorResponse,
   type RouteObject,
 } from "react-router";
-import "virtual:zudoku-theme.css";
 import "vite/modulepreload-polyfill";
-import { BootstrapStatic, ServerError } from "zudoku/components";
+import { BootstrapStatic, ServerError } from "zudoku/__internal";
 import { NO_DEHYDRATE } from "../lib/components/cache.js";
 import type { PrerenderResponse } from "../vite/prerender/PrerenderResponse.js";
-import "./main.css";
 import { getRoutesByConfig } from "./main.js";
 export { getRoutesByConfig };
 
@@ -51,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") ?? "",
       );
     }
 

package/src/app/env.ts

@@ -1,3 +1,4 @@
+import { z } from "zod";
 import { BuildConfigSchema } from "./ZuploBuildConfig.js";
 
 const getZuploBuildConfig = () => {
@@ -9,11 +10,18 @@ const getZuploBuildConfig = () => {
     );
     return zuploBuildConfig;
   } catch (error) {
-    // eslint-disable-next-line no-console
+    if (error instanceof z.ZodError) {
+      // biome-ignore lint/suspicious/noConsole: Logging allowed here
+      console.error("ZUPLO_BUILD_CONFIG is invalid.");
+      // biome-ignore lint/suspicious/noConsole: Logging allowed here
+      console.log(error.issues);
+      return undefined;
+    }
+    // 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/font.geist.css

@@ -0,0 +1,73 @@
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 100;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-Thin.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 200;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-UltraLight.woff2")
+    format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 300;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-Light.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 400;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-Regular.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 500;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-Medium.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 600;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-SemiBold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 700;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-Bold.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 800;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-Black.woff2") format("woff2");
+}
+
+@font-face {
+  font-family: Geist;
+  font-style: normal;
+  font-weight: 900;
+  font-display: swap;
+  src: url("https://cdn.zudoku.dev/geist/Geist-UltraBlack.woff2")
+    format("woff2");
+}