zudoku 0.64.2 → 0.65.0

package/lib/zudoku.auth-auth0.js

@@ -1,6 +1,6 @@
-import { u as a } from "./ZudokuContext-BUZ5hkWB.js";
-import { OpenIDAuthenticationProvider as r } from "./zudoku.auth-openid.js";
-class c extends r {
+import { u as r } from "./ZudokuContext-BUZ5hkWB.js";
+import { OpenIDAuthenticationProvider as a } from "./zudoku.auth-openid.js";
+class p extends a {
   options;
   constructor(t) {
     super({
@@ -13,11 +13,11 @@ class c extends r {
     }), this.options = t.options;
   }
   onAuthorizationUrl = async (t, { isSignUp: e }) => {
-    this.options?.alwaysPromptLogin !== !1 && t.searchParams.set("prompt", "login"), e && t.searchParams.set("screen_hint", "signup");
+    this.options?.prompt !== void 0 ? this.options.prompt !== "" && t.searchParams.set("prompt", this.options.prompt) : this.options?.alwaysPromptLogin !== !1 && t.searchParams.set("prompt", "login"), e && t.searchParams.set("screen_hint", "signup");
   };
   signOut = async (t) => {
     const e = await this.getAuthServer(), i = await this.getAccessToken();
-    a.setState({
+    r.setState({
       isAuthenticated: !1,
       isPending: !1,
       profile: void 0,
@@ -36,8 +36,8 @@ class c extends r {
       );
   };
 }
-const u = (s) => new c(s);
+const h = (s) => new p(s);
 export {
-  u as default
+  h as default
 };
 //# sourceMappingURL=zudoku.auth-auth0.js.map

package/lib/zudoku.auth-auth0.js.map

@@ -1 +1 @@
-{"version":3,"file":"zudoku.auth-auth0.js","sources":["../src/lib/authentication/providers/auth0.tsx"],"sourcesContent":["import type { Auth0AuthenticationConfig } from \"../../../config/config.js\";\nimport type {\n  AuthActionContext,\n  AuthenticationPlugin,\n  AuthenticationProviderInitializer,\n} from \"../authentication.js\";\nimport { useAuthState } from \"../state.js\";\nimport { OpenIDAuthenticationProvider } from \"./openid.js\";\n\nclass Auth0AuthenticationProvider\n  extends OpenIDAuthenticationProvider\n  implements AuthenticationPlugin\n{\n  private readonly options: Auth0AuthenticationConfig[\"options\"];\n  constructor(config: Auth0AuthenticationConfig) {\n    super({\n      ...config,\n      type: \"openid\",\n      issuer: `https://${config.domain}/`,\n      clientId: config.clientId,\n      audience: config.audience,\n      scopes: config.scopes,\n    });\n    this.options = config.options;\n  }\n\n  onAuthorizationUrl = async (\n    url: URL,\n    { isSignUp }: { isSignUp: boolean },\n  ) => {\n    if (this.options?.alwaysPromptLogin !== false) {\n      url.searchParams.set(\"prompt\", \"login\");\n    }\n    if (isSignUp) {\n      url.searchParams.set(\"screen_hint\", \"signup\");\n    }\n  };\n\n  signOut = async (_: AuthActionContext): Promise<void> => {\n    const as = await this.getAuthServer();\n    const idToken = await this.getAccessToken();\n\n    useAuthState.setState({\n      isAuthenticated: false,\n      isPending: false,\n      profile: undefined,\n      providerData: undefined,\n    });\n\n    const redirectUrl = new URL(window.location.origin);\n    redirectUrl.pathname = this.redirectToAfterSignOut;\n\n    // SEE: https://auth0.com/docs/authenticate/login/logout/log-users-out-of-auth0\n    // For Auth0 tenants created on or after 14 November 2023, RP-Initiated\n    // Logout End Session Endpoint Discovery is enabled by default.\n    // Otherwise we fallback to the old non-compliant logout\n\n    // The endSessionEndpoint is set, the IdP supports some form of logout,\n    // so we use the IdP logout. Otherwise, just redirect the user to home\n    if (as.end_session_endpoint) {\n      const logoutUrl = new URL(as.end_session_endpoint);\n      if (idToken) {\n        logoutUrl.searchParams.set(\"id_token_hint\", idToken);\n      }\n      logoutUrl.searchParams.set(\n        \"post_logout_redirect_uri\",\n        redirectUrl.toString(),\n      );\n\n      // window.location.href = logoutUrl.toString();\n    } else {\n      const _logoutUrl = new URL(\n        `${this.issuer.replace(/\\/$/, \"\")}/oidc/logout`,\n      );\n      // window.location.href = logoutUrl.toString();\n    }\n  };\n}\n\nconst auth0Auth: AuthenticationProviderInitializer<\n  Auth0AuthenticationConfig\n> = (options) => new Auth0AuthenticationProvider(options);\n\nexport default auth0Auth;\n"],"names":["Auth0AuthenticationProvider","OpenIDAuthenticationProvider","config","url","isSignUp","_","as","idToken","useAuthState","redirectUrl","logoutUrl","auth0Auth","options"],"mappings":";;AASA,MAAMA,UACIC,EAEV;AAAA,EACmB;AAAA,EACjB,YAAYC,GAAmC;AAC7C,UAAM;AAAA,MACJ,GAAGA;AAAA,MACH,MAAM;AAAA,MACN,QAAQ,WAAWA,EAAO,MAAM;AAAA,MAChC,UAAUA,EAAO;AAAA,MACjB,UAAUA,EAAO;AAAA,MACjB,QAAQA,EAAO;AAAA,IAAA,CAChB,GACD,KAAK,UAAUA,EAAO;AAAA,EACxB;AAAA,EAEA,qBAAqB,OACnBC,GACA,EAAE,UAAAC,QACC;AACH,IAAI,KAAK,SAAS,sBAAsB,MACtCD,EAAI,aAAa,IAAI,UAAU,OAAO,GAEpCC,KACFD,EAAI,aAAa,IAAI,eAAe,QAAQ;AAAA,EAEhD;AAAA,EAEA,UAAU,OAAOE,MAAwC;AACvD,UAAMC,IAAK,MAAM,KAAK,cAAA,GAChBC,IAAU,MAAM,KAAK,eAAA;AAE3B,IAAAC,EAAa,SAAS;AAAA,MACpB,iBAAiB;AAAA,MACjB,WAAW;AAAA,MACX,SAAS;AAAA,MACT,cAAc;AAAA,IAAA,CACf;AAED,UAAMC,IAAc,IAAI,IAAI,OAAO,SAAS,MAAM;AAUlD,QATAA,EAAY,WAAW,KAAK,wBASxBH,EAAG,sBAAsB;AAC3B,YAAMI,IAAY,IAAI,IAAIJ,EAAG,oBAAoB;AACjD,MAAIC,KACFG,EAAU,aAAa,IAAI,iBAAiBH,CAAO,GAErDG,EAAU,aAAa;AAAA,QACrB;AAAA,QACAD,EAAY,SAAA;AAAA,MAAS;AAAA,IAIzB;AACqB,UAAI;AAAA,QACrB,GAAG,KAAK,OAAO,QAAQ,OAAO,EAAE,CAAC;AAAA,MAAA;AAAA,EAIvC;AACF;AAEA,MAAME,IAEF,CAACC,MAAY,IAAIZ,EAA4BY,CAAO;"}
+{"version":3,"file":"zudoku.auth-auth0.js","sources":["../src/lib/authentication/providers/auth0.tsx"],"sourcesContent":["import type { Auth0AuthenticationConfig } from \"../../../config/config.js\";\nimport type {\n  AuthActionContext,\n  AuthenticationPlugin,\n  AuthenticationProviderInitializer,\n} from \"../authentication.js\";\nimport { useAuthState } from \"../state.js\";\nimport { OpenIDAuthenticationProvider } from \"./openid.js\";\n\nclass Auth0AuthenticationProvider\n  extends OpenIDAuthenticationProvider\n  implements AuthenticationPlugin\n{\n  private readonly options: Auth0AuthenticationConfig[\"options\"];\n  constructor(config: Auth0AuthenticationConfig) {\n    super({\n      ...config,\n      type: \"openid\",\n      issuer: `https://${config.domain}/`,\n      clientId: config.clientId,\n      audience: config.audience,\n      scopes: config.scopes,\n    });\n    this.options = config.options;\n  }\n\n  onAuthorizationUrl = async (\n    url: URL,\n    { isSignUp }: { isSignUp: boolean },\n  ) => {\n    if (this.options?.prompt !== undefined) {\n      if (this.options.prompt !== \"\") {\n        url.searchParams.set(\"prompt\", this.options.prompt);\n      }\n    } else if (this.options?.alwaysPromptLogin !== false) {\n      url.searchParams.set(\"prompt\", \"login\");\n    }\n\n    if (isSignUp) {\n      url.searchParams.set(\"screen_hint\", \"signup\");\n    }\n  };\n\n  signOut = async (_: AuthActionContext): Promise<void> => {\n    const as = await this.getAuthServer();\n    const idToken = await this.getAccessToken();\n\n    useAuthState.setState({\n      isAuthenticated: false,\n      isPending: false,\n      profile: undefined,\n      providerData: undefined,\n    });\n\n    const redirectUrl = new URL(window.location.origin);\n    redirectUrl.pathname = this.redirectToAfterSignOut;\n\n    // SEE: https://auth0.com/docs/authenticate/login/logout/log-users-out-of-auth0\n    // For Auth0 tenants created on or after 14 November 2023, RP-Initiated\n    // Logout End Session Endpoint Discovery is enabled by default.\n    // Otherwise we fallback to the old non-compliant logout\n\n    // The endSessionEndpoint is set, the IdP supports some form of logout,\n    // so we use the IdP logout. Otherwise, just redirect the user to home\n    if (as.end_session_endpoint) {\n      const logoutUrl = new URL(as.end_session_endpoint);\n      if (idToken) {\n        logoutUrl.searchParams.set(\"id_token_hint\", idToken);\n      }\n      logoutUrl.searchParams.set(\n        \"post_logout_redirect_uri\",\n        redirectUrl.toString(),\n      );\n\n      // window.location.href = logoutUrl.toString();\n    } else {\n      const _logoutUrl = new URL(\n        `${this.issuer.replace(/\\/$/, \"\")}/oidc/logout`,\n      );\n      // window.location.href = logoutUrl.toString();\n    }\n  };\n}\n\nconst auth0Auth: AuthenticationProviderInitializer<\n  Auth0AuthenticationConfig\n> = (options) => new Auth0AuthenticationProvider(options);\n\nexport default auth0Auth;\n"],"names":["Auth0AuthenticationProvider","OpenIDAuthenticationProvider","config","url","isSignUp","_","as","idToken","useAuthState","redirectUrl","logoutUrl","auth0Auth","options"],"mappings":";;AASA,MAAMA,UACIC,EAEV;AAAA,EACmB;AAAA,EACjB,YAAYC,GAAmC;AAC7C,UAAM;AAAA,MACJ,GAAGA;AAAA,MACH,MAAM;AAAA,MACN,QAAQ,WAAWA,EAAO,MAAM;AAAA,MAChC,UAAUA,EAAO;AAAA,MACjB,UAAUA,EAAO;AAAA,MACjB,QAAQA,EAAO;AAAA,IAAA,CAChB,GACD,KAAK,UAAUA,EAAO;AAAA,EACxB;AAAA,EAEA,qBAAqB,OACnBC,GACA,EAAE,UAAAC,QACC;AACH,IAAI,KAAK,SAAS,WAAW,SACvB,KAAK,QAAQ,WAAW,MAC1BD,EAAI,aAAa,IAAI,UAAU,KAAK,QAAQ,MAAM,IAE3C,KAAK,SAAS,sBAAsB,MAC7CA,EAAI,aAAa,IAAI,UAAU,OAAO,GAGpCC,KACFD,EAAI,aAAa,IAAI,eAAe,QAAQ;AAAA,EAEhD;AAAA,EAEA,UAAU,OAAOE,MAAwC;AACvD,UAAMC,IAAK,MAAM,KAAK,cAAA,GAChBC,IAAU,MAAM,KAAK,eAAA;AAE3B,IAAAC,EAAa,SAAS;AAAA,MACpB,iBAAiB;AAAA,MACjB,WAAW;AAAA,MACX,SAAS;AAAA,MACT,cAAc;AAAA,IAAA,CACf;AAED,UAAMC,IAAc,IAAI,IAAI,OAAO,SAAS,MAAM;AAUlD,QATAA,EAAY,WAAW,KAAK,wBASxBH,EAAG,sBAAsB;AAC3B,YAAMI,IAAY,IAAI,IAAIJ,EAAG,oBAAoB;AACjD,MAAIC,KACFG,EAAU,aAAa,IAAI,iBAAiBH,CAAO,GAErDG,EAAU,aAAa;AAAA,QACrB;AAAA,QACAD,EAAY,SAAA;AAAA,MAAS;AAAA,IAIzB;AACqB,UAAI;AAAA,QACrB,GAAG,KAAK,OAAO,QAAQ,OAAO,EAAE,CAAC;AAAA,MAAA;AAAA,EAIvC;AACF;AAEA,MAAME,IAEF,CAACC,MAAY,IAAIZ,EAA4BY,CAAO;"}

package/lib/zudoku.auth-azureb2c.js

@@ -1,10 +1,10 @@
 import { j as n } from "./jsx-runtime-BzflLqGi.js";
 import { PublicClientApplication as A, EventType as f } from "@azure/msal-browser";
-import { E as I } from "./index-FNRZUtwo.js";
+import { E as I } from "./index-DHDtI9H5.js";
 import { C as T } from "./ClientOnly-E7hGysn1.js";
 import { j as S, u as h } from "./ZudokuContext-BUZ5hkWB.js";
-import { C, A as c } from "./errors-BTpjwHS6.js";
-import { C as k, O as w } from "./OAuthErrorPage-B79J86Fo.js";
+import { C, A as c } from "./errors-DqoyOKev.js";
+import { C as k, O as w } from "./OAuthErrorPage-DlTYnbLO.js";
 const u = "/oauth/callback";
 class y extends C {
   msalInstance;

package/lib/zudoku.auth-clerk.js

@@ -1,6 +1,6 @@
 import { j as l } from "./jsx-runtime-BzflLqGi.js";
 import { LogOutIcon as f } from "lucide-react";
-import { S as w, a as p, b as v } from "./SignUp-Fycafbyg.js";
+import { S as w, a as p, b as v } from "./SignUp-CfB278ao.js";
 import { u as n } from "./ZudokuContext-BUZ5hkWB.js";
 const b = ({
   clerkPubKey: d,

package/lib/zudoku.auth-openid.js

@@ -1,10 +1,10 @@
 import { j as D } from "./jsx-runtime-BzflLqGi.js";
 import { g as Le } from "./invariant-Bm-FVUQE.js";
-import { E as Ue } from "./index-FNRZUtwo.js";
+import { E as Ue } from "./index-DHDtI9H5.js";
 import { C as xe } from "./ClientOnly-E7hGysn1.js";
 import { j as Ce, u as S } from "./ZudokuContext-BUZ5hkWB.js";
-import { C as Ie, O as re, A as R } from "./errors-BTpjwHS6.js";
-import { C as je, O as Oe } from "./OAuthErrorPage-B79J86Fo.js";
+import { C as Ie, O as re, A as R } from "./errors-DqoyOKev.js";
+import { C as je, O as Oe } from "./OAuthErrorPage-DlTYnbLO.js";
 var J = { exports: {} }, De = J.exports, oe;
 function Je() {
   return oe || (oe = 1, (function(t) {

package/lib/zudoku.auth-supabase.js

@@ -1,12 +1,12 @@
 import { j as i } from "./jsx-runtime-BzflLqGi.js";
 import { createClient as h } from "@supabase/supabase-js";
-import { C as m, A as g } from "./errors-BTpjwHS6.js";
-import { S as f } from "./SignUp-Fycafbyg.js";
+import { C as m, A as g } from "./errors-DqoyOKev.js";
+import { S as f } from "./SignUp-CfB278ao.js";
 import { u } from "./ZudokuContext-BUZ5hkWB.js";
 import { Auth as v } from "@supabase/auth-ui-react";
 import { ThemeSupa as S } from "@supabase/auth-ui-shared";
 import { a as A } from "./chunk-PVWAREVJ-BMhpCH5D.js";
-import { H as T } from "./ErrorAlert--3alJ_-b.js";
+import { H as T } from "./ErrorAlert-BOVgwTRP.js";
 const d = ({
   client: s,
   config: e,

package/lib/zudoku.components.js

@@ -6,9 +6,9 @@ import "./ui/Button.js";
 import "./ui/Callout.js";
 import "./ClientOnly-E7hGysn1.js";
 import "./ZudokuContext-BUZ5hkWB.js";
-import "./ErrorAlert--3alJ_-b.js";
+import "./ErrorAlert-BOVgwTRP.js";
 import "./Spinner-CI6bRyZw.js";
-import { B as d, i as h, C as l, d as k, c as S, L as y, M, e as T, S as Z, T as c, Z as f, g, h as A, f as B, j as E, u as H } from "./index-FNRZUtwo.js";
+import { B as d, i as h, C as l, d as k, c as S, L as y, M, e as T, S as Z, T as c, Z as f, g, h as A, f as B, j as E, u as H } from "./index-DHDtI9H5.js";
 export {
   d as Button,
   h as CACHE_KEYS,

package/lib/zudoku.plugin-api-catalog.js

@@ -1,10 +1,10 @@
 import { j as t } from "./jsx-runtime-BzflLqGi.js";
-import { s as f } from "./index-Bvas0H4x.js";
+import { s as f } from "./index-BG79m3lF.js";
 import { e as b, m as j } from "./chunk-PVWAREVJ-BMhpCH5D.js";
 import { u as x, b as v, j as d } from "./ZudokuContext-BUZ5hkWB.js";
 import { H as y } from "./index.esm-BnYHxCYC.js";
-import { L as N } from "./index-FNRZUtwo.js";
-import { H as k, M as S } from "./ErrorAlert--3alJ_-b.js";
+import { L as N } from "./index-DHDtI9H5.js";
+import { H as k, M as S } from "./ErrorAlert-BOVgwTRP.js";
 const w = ({
   items: o,
   filterCatalogItems: r = (i) => i,

package/lib/zudoku.plugin-api-keys.js

@@ -1,13 +1,13 @@
 import { j as e } from "./jsx-runtime-BzflLqGi.js";
 import { CircleSlashIcon as z, CheckIcon as ue, XIcon as he, PencilLineIcon as fe, RefreshCwIcon as pe, TrashIcon as me, KeyRoundIcon as xe } from "lucide-react";
-import { R as ye } from "./RouterError-DZS2d6Sc.js";
+import { R as ye } from "./RouterError-DQS_bMwf.js";
 import { i as I } from "./invariant-Bm-FVUQE.js";
 import { O as ge, u as je } from "./chunk-PVWAREVJ-BMhpCH5D.js";
 import { u as Ce } from "./hook-CMeoxziF.js";
-import { D as ve, a as Y } from "./ErrorAlert--3alJ_-b.js";
+import { D as ve, a as Y } from "./ErrorAlert-BOVgwTRP.js";
 import { Button as w } from "./ui/Button.js";
 import { a as se, g as ne, b as we } from "./ZudokuContext-BUZ5hkWB.js";
-import { u as O, A as M, a as q, b as ke, S as be, c as Ne, d as Ke, e as Ee, f as De, g as Z, h as Ae } from "./Select-C1DeCqKv.js";
+import { u as O, A as M, a as q, b as ke, S as be, c as Ne, d as Ke, e as Ee, f as De, g as Z, h as Ae } from "./Select-DFRCS31-.js";
 import * as L from "react";
 import Pe, { createContext as Q, useRef as E, useLayoutEffect as Ie, useEffect as re, useId as _, useContext as B, useInsertionEffect as Re, useMemo as F, useCallback as Se, Children as Te, isValidElement as Oe, useState as K, forwardRef as Me } from "react";
 import { C as qe, a as $e } from "./Card-KFniaZn5.js";
@@ -15,7 +15,7 @@ import { e as H, f as D, D as V, g as G, a as J, b as U, c as W, d as ie } from
 import { Input as ae } from "./ui/Input.js";
 import { c as A } from "./cn-dYga0KKN.js";
 import { a as ze } from "./index.esm-BYObtETB.js";
-import { B as Fe } from "./Button-DmS4u8Lj.js";
+import { B as Fe } from "./Button-B3ucvvQw.js";
 import { S as Le } from "./Spinner-CI6bRyZw.js";
 import { useAuth as Qe } from "./zudoku.hooks.js";
 const _e = () => {

package/lib/zudoku.plugin-markdown.js

@@ -4,7 +4,7 @@ const p = (t) => ({
     ([e, a]) => ({
       path: e,
       lazy: async () => {
-        const { MdxPage: n } = await import("./MdxPage-Bpa9tL63.js"), { default: o, ...s } = await a();
+        const { MdxPage: n } = await import("./MdxPage-CBYFyqUs.js"), { default: o, ...s } = await a();
         return {
           element: /* @__PURE__ */ r.jsx(
             n,

package/lib/zudoku.plugin-openapi.js

@@ -3,7 +3,7 @@ import "lucide-react";
 import "./chunk-PVWAREVJ-BMhpCH5D.js";
 import "./ui/Button.js";
 import "./ZudokuContext-BUZ5hkWB.js";
-import { y as e, U as n, z as s } from "./index-DP1xZgfJ.js";
+import { y as e, U as n, z as s } from "./index-B7yD7ZUk.js";
 export {
   e as GetNavigationOperationsQuery,
   n as UNTAGGED_PATH,

package/lib/zudoku.plugin-search-pagefind.js

@@ -3,12 +3,12 @@ import { C as w } from "./ClientOnly-E7hGysn1.js";
 import { VisuallyHidden as I } from "@radix-ui/react-visually-hidden";
 import { j as k, u as N, a as _, l as j, m as L } from "./ZudokuContext-BUZ5hkWB.js";
 import { useRef as C, useLayoutEffect as T, useState as E } from "react";
-import { B as R } from "./Button-DmS4u8Lj.js";
+import { B as R } from "./Button-B3ucvvQw.js";
 import { ShieldAlertIcon as z, AlertTriangleIcon as F, InfoIcon as h, LightbulbIcon as q, BracketsIcon as A, FileTextIcon as P } from "lucide-react";
 import { c as m } from "./cn-dYga0KKN.js";
 import { C as $, a as b, b as f, c as D, d as B, e as O } from "./Command-CUcrW3qs.js";
 import { c as U } from "./Dialog-BQciPiHN.js";
-import { S as G } from "./RouteGuard-CjzxosTf.js";
+import { S as G } from "./RouteGuard-Brz95MSt.js";
 import { u as H, L as p } from "./chunk-PVWAREVJ-BMhpCH5D.js";
 const K = {
   note: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zudoku",
-  "version": "0.64.2",
+  "version": "0.65.0",
   "type": "module",
   "homepage": "https://zudoku.dev",
   "repository": {
@@ -197,9 +197,9 @@
     "estree-util-value-to-estree": "3.4.1",
     "express": "5.1.0",
     "fast-equals": "5.2.2",
-    "glob": "11.0.3",
+    "glob": "11.1.0",
     "glob-parent": "6.0.2",
-    "graphql": "16.11.0",
+    "graphql": "16.12.0",
     "graphql-type-json": "0.3.2",
     "graphql-yoga": "5.16.0",
     "gray-matter": "4.0.3",
@@ -269,7 +269,7 @@
     "@types/react-is": "19.2.0",
     "@types/semver": "7.7.0",
     "@types/unist": "^3.0.3",
-    "@types/yargs": "17.0.33",
+    "@types/yargs": "17.0.35",
     "@vitest/coverage-v8": "3.2.4",
     "esbuild": "0.25.11",
     "happy-dom": "20.0.10",

package/src/app/main.tsx

@@ -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/lib/authentication/providers/auth0.tsx

@@ -28,9 +28,14 @@ class Auth0AuthenticationProvider
     url: URL,
     { isSignUp }: { isSignUp: boolean },
   ) => {
-    if (this.options?.alwaysPromptLogin !== false) {
+    if (this.options?.prompt !== undefined) {
+      if (this.options.prompt !== "") {
+        url.searchParams.set("prompt", this.options.prompt);
+      }
+    } else if (this.options?.alwaysPromptLogin !== false) {
       url.searchParams.set("prompt", "login");
     }
+
     if (isSignUp) {
       url.searchParams.set("screen_hint", "signup");
     }

package/src/lib/components/Autocomplete.tsx

@@ -11,12 +11,14 @@ import { Popover, PopoverContent } from "zudoku/ui/Popover.js";
 import { cn } from "../util/cn.js";
 
 type AutocompleteProps = {
-  value: string;
+  value?: string | number | readonly string[] | undefined;
   options: readonly string[];
   onChange: (e: string) => void;
+  onSelect?: (e: string) => void;
   className?: string;
   placeholder?: string;
   onEnterPress?: (e: KeyboardEvent<HTMLInputElement>) => void;
+  onKeyDown?: (e: KeyboardEvent<HTMLInputElement>) => void;
   ref?: Ref<HTMLInputElement>;
   shouldFilter?: boolean;
 };
@@ -28,7 +30,9 @@ const AutocompletePopover = ({
   className,
   placeholder = "Value",
   onEnterPress,
+  onKeyDown,
   ref,
+  onSelect,
 }: AutocompleteProps) => {
   const [open, setOpen] = useState(false);
   const [dontClose, setDontClose] = useState(false);
@@ -48,7 +52,7 @@ const AutocompletePopover = ({
               ref.current = el;
             }
           }}
-          value={value}
+          value={value ? String(value) : undefined}
           placeholder={placeholder}
           className={cn("h-9 bg-transparent", className)}
           onFocus={() => setOpen(true)}
@@ -59,6 +63,10 @@ const AutocompletePopover = ({
             setOpen(false);
           }}
           onKeyDown={(e) => {
+            onKeyDown?.(e);
+
+            if (e.defaultPrevented) return;
+
             if (e.key === "Enter") {
               setOpen(false);
               inputRef.current?.blur();
@@ -91,6 +99,7 @@ const AutocompletePopover = ({
               key={enumValue}
               value={enumValue}
               onSelect={(selected) => {
+                onSelect?.(selected);
                 onChange(selected);
                 setOpen(false);
               }}

package/src/lib/components/Layout.tsx

@@ -1,5 +1,6 @@
 import { type ReactNode, Suspense, useEffect } from "react";
 import { Outlet } from "react-router";
+import { TooltipProvider } from "zudoku/ui/Tooltip.js";
 import { cn } from "../util/cn.js";
 import { useScrollToAnchor } from "../util/useScrollToAnchor.js";
 import { useScrollToTop } from "../util/useScrollToTop.js";
@@ -28,7 +29,7 @@ export const Layout = ({ children }: { children?: ReactNode }) => {
   }, [authentication]);
 
   return (
-    <>
+    <TooltipProvider>
       <Slot.Target name="layout-before-head" />
       <Header />
       <Slot.Target name="layout-after-head" />
@@ -45,6 +46,6 @@ export const Layout = ({ children }: { children?: ReactNode }) => {
         </Suspense>
       </div>
       <Footer />
-    </>
+    </TooltipProvider>
   );
 };

package/src/lib/components/navigation/NavigationItem.tsx

@@ -1,13 +1,7 @@
 import { ExternalLinkIcon } from "lucide-react";
 import { useEffect, useRef, useState } from "react";
 import { NavLink, useLocation } from "react-router";
-import {
-  Tooltip,
-  TooltipArrow,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from "zudoku/ui/Tooltip.js";
+import { Tooltip, TooltipContent, TooltipTrigger } from "zudoku/ui/Tooltip.js";
 import type { NavigationItem as NavigationItemType } from "../../../config/validators/NavigationSchema.js";
 import { useAuth } from "../../authentication/hook.js";
 import { cn } from "../../util/cn.js";
@@ -47,19 +41,12 @@ const TruncatedLabel = ({
         {label}
       </span>
       {isTruncated && (
-        <TooltipProvider delayDuration={500}>
-          <Tooltip disableHoverableContent>
-            <TooltipTrigger className="absolute inset-0 z-10" />
-            <TooltipContent
-              className="max-w-64 rounded-lg"
-              side="bottom"
-              align="center"
-            >
-              <TooltipArrow />
-              {label}
-            </TooltipContent>
-          </Tooltip>
-        </TooltipProvider>
+        <Tooltip disableHoverableContent>
+          <TooltipTrigger className="absolute inset-0 z-10" />
+          <TooltipContent className="max-w-64" side="bottom" align="center">
+            {label}
+          </TooltipContent>
+        </Tooltip>
       )}
     </>
   );

package/src/lib/errors/ErrorAlert.tsx

@@ -17,7 +17,7 @@ export function ErrorAlert({ error }: { error: unknown }) {
   const stringError = cause instanceof Error ? String(cause.stack) : stack;
 
   return (
-    <Typography className="grid grid-cols-1 !max-w-none pt-(--padding-content-top)">
+    <Typography className="grid grid-cols-1 max-w-none! pt-(--padding-content-top)">
       <Heading level={1}>{title}</Heading>
       Error: {message}
       {hint && <DeveloperHint className="mb-4">{hint}</DeveloperHint>}

package/src/lib/errors/RouterError.tsx

@@ -1,13 +1,18 @@
 import { isRouteErrorResponse, useRouteError } from "react-router";
 import { NotFoundPage } from "../components/NotFoundPage.js";
+import { cn } from "../util/cn.js";
 import { ErrorAlert } from "./ErrorAlert.js";
 
-export function RouterError() {
+export function RouterError({ className }: { className?: string }) {
   const error = useRouteError();
 
   if (isRouteErrorResponse(error) && error.status === 404) {
     return <NotFoundPage />;
   }
 
-  return <ErrorAlert error={error} />;
+  return (
+    <div className={cn("mx-4 max-w-2xl", className)}>
+      <ErrorAlert error={error} />
+    </div>
+  );
 }

package/src/lib/plugins/openapi/GeneratedExampleSidecarBox.tsx

@@ -21,8 +21,8 @@ export const GeneratedExampleSidecarBox = ({
   return (
     <SidecarBox.Root>
       <SidecarBox.Head className="text-xs flex justify-between items-center">
-        <div className="flex items-center gap-1.5 font-mono">
-          Request Body Example
+        <div className="flex items-center gap-1.5">
+          <span className="font-medium">Request Body Example</span>
           <TooltipProvider>
             <Tooltip>
               <TooltipTrigger asChild>

package/src/lib/plugins/openapi/OperationList.tsx

@@ -146,6 +146,8 @@ const OperationsForTagQuery = graphql(/* GraphQL */ `
   }
 `);
 
+const LAZY_OPERATION_LIST_THRESHOLD = 30;
+
 export const OperationList = ({
   tag,
   untagged,
@@ -202,7 +204,7 @@ export const OperationList = ({
 
   // Simple heuristic to determine if we should lazy highlight the code
   // This is to avoid the performance issues when there are a lot of operations
-  const shouldLazyHighlight = operations.length > 30;
+  const shouldLazyHighlight = operations.length > LAZY_OPERATION_LIST_THRESHOLD;
 
   // The summary property is preferable here as it is a short description of
   // the API, whereas the description property is typically longer and supports

package/src/lib/plugins/openapi/OperationListItem.tsx

@@ -1,6 +1,7 @@
 import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
 import { useState } from "react";
 import { Badge } from "zudoku/ui/Badge.js";
+import { Separator } from "zudoku/ui/Separator.js";
 import { Heading } from "../../components/Heading.js";
 import { Markdown } from "../../components/Markdown.js";
 import { cn } from "../../util/cn.js";
@@ -120,10 +121,13 @@ export const OperationListItem = ({
                   []
                 ),
               )}
+            {renderIf(operation.requestBody?.content?.at(0)?.schema, () => (
+              <Separator className="my-4" />
+            ))}
             {renderIf(
               operation.requestBody?.content?.at(0)?.schema,
               (schema) => (
-                <div className="mt-4 flex flex-col gap-4">
+                <div className="flex flex-col gap-4">
                   <Heading
                     level={3}
                     className="capitalize flex items-center gap-2"
@@ -145,13 +149,10 @@ export const OperationListItem = ({
                 </div>
               ),
             )}
+            <Separator className="my-4" />
             {operation.responses.length > 0 && (
               <>
-                <Heading
-                  level={3}
-                  className="capitalize mt-8 pt-8 border-t"
-                  id={`${operation.slug}/responses`}
-                >
+                <Heading level={3} id={`${operation.slug}/responses`}>
                   {operation.summary && (
                     <VisuallyHidden>
                       {operation.summary} &rsaquo;{" "}
@@ -172,7 +173,6 @@ export const OperationListItem = ({
         {renderIf(!options?.disableSidecar && !isMCPEndpoint, () => (
           <Sidecar
             selectedResponse={selectedResponse}
-            onSelectResponse={setSelectedResponse}
             operation={operation}
             globalSelectedServer={globalSelectedServer}
             shouldLazyHighlight={shouldLazyHighlight}

package/src/lib/plugins/openapi/ParameterList.tsx

@@ -1,6 +1,8 @@
 import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
+import { Fragment } from "react";
 import { Heading } from "../../components/Heading.js";
-import { Card } from "../../ui/Card.js";
+import { Frame, FramePanel } from "../../ui/Frame.js";
+import { ItemGroup, ItemSeparator } from "../../ui/Item.js";
 import type { ParameterItem } from "./graphql/graphql.js";
 import type { ParameterGroup } from "./OperationListItem.js";
 import { ParameterListItem } from "./ParameterListItem.js";
@@ -15,25 +17,37 @@ export const ParameterList = ({
   group: ParameterGroup;
   parameters: ParameterItem[];
   id: string;
-}) => (
-  <>
-    <Heading level={3} id={`${id}/${group}-parameters`} className="capitalize">
-      {summary && <VisuallyHidden>{summary} &rsaquo; </VisuallyHidden>}
-      {group === "header" ? "Headers" : `${group} Parameters`}
-    </Heading>
-    <Card>
-      <ul className="list-none m-0 px-0 divide-y ">
-        {parameters
-          .sort((a, b) => (a.required === b.required ? 0 : a.required ? -1 : 1))
-          .map((parameter) => (
-            <ParameterListItem
-              key={`${parameter.name}-${parameter.in}`}
-              parameter={parameter}
-              id={id}
-              group={group}
-            />
-          ))}
-      </ul>
-    </Card>
-  </>
-);
+}) => {
+  const sortedParameters = parameters.sort((a, b) =>
+    a.required === b.required ? 0 : a.required ? -1 : 1,
+  );
+
+  return (
+    <>
+      <Heading
+        level={3}
+        id={`${id}/${group}-parameters`}
+        className="capitalize"
+      >
+        {summary && <VisuallyHidden>{summary} &rsaquo; </VisuallyHidden>}
+        {group === "header" ? "Headers" : `${group} Parameters`}
+      </Heading>
+      <Frame>
+        <FramePanel className="p-0!">
+          <ItemGroup className="overflow-clip">
+            {sortedParameters.map((parameter) => (
+              <Fragment key={`${parameter.name}-${parameter.in}`}>
+                <ParameterListItem
+                  parameter={parameter}
+                  id={id}
+                  group={group}
+                />
+                <ItemSeparator />
+              </Fragment>
+            ))}
+          </ItemGroup>
+        </FramePanel>
+      </Frame>
+    </>
+  );
+};