zudoku 0.3.0-dev.78 → 0.3.0-dev.79

package/lib/zudoku.components.js

@@ -17,15 +17,15 @@ import { H as _t, a as Ge, M as ur, A as lr, u as dr } from "./AnchorLink-BZcpTw
 import { d as hr, R as pr, N as $e, L as Ee } from "./index-Dt-pU7Vu.js";
 import { E as Et, u as fr, S as mr, a as Se, R as gr } from "./SlotletProvider-D_Vz-7c_.js";
 import { j as o, d as vr, u as J, a as xr, b as yr, O as St } from "./jsx-runtime-CJBdjYYx.js";
-import { M as wr, c as Mr, a as jt, b as Nt, A as br, u as fe, h as Cr, d as y, e as Pr, F as Rr, D as _r, C as Er, P as ie, f as qe, g as Sr, i as Dt, R as jr, S as Nr, j as Dr, k as Ir, l as It, m as Ar, n as je, o as At, B as Be } from "./Combination-BIdpLnWg.js";
+import { M as wr, c as Mr, a as jt, b as Nt, A as br, u as fe, h as Cr, d as y, e as Pr, F as Rr, D as _r, C as Er, P as ie, f as qe, g as Sr, i as Dt, R as jr, S as Nr, j as Dr, k as Ir, l as It, m as Ar, n as je, o as At, B as Be } from "./Combination-CS4rK8IJ.js";
 import { c as me, a as P, C as Or, b as Tr, u as kr, M as Fr, T as Lr, V as Kr, d as He, e as $r, f as Br } from "./Markdown-QsZ-PHET.js";
 import * as u from "react";
 import Qr, { StrictMode as Ot, createContext as Tt, Component as Ur, createElement as pt, isValidElement as Gr, memo as kt, useMemo as Le, useState as le, useContext as qr, useRef as ge, useEffect as W, Fragment as Hr, forwardRef as zr, Suspense as Vr } from "react";
 import { g as ze } from "./_commonjsHelpers-BVfed4GL.js";
 import { r as Yr } from "./router-BiRCp01d.js";
-import { S as Qe, R as Ft, T as Lt, C as Kt } from "./index-BpO_SgPQ.js";
+import { S as Qe, R as Ft, T as Lt, C as Kt } from "./index-D4bOMg7f.js";
 import { S as $t, h as Bt, Q as Xr, n as j, m as ft, a as mt, b as Q, e as Wr, c as Jr, d as Zr, f as ea, o as gt, r as vt, g as ta, i as xt, p as yt, s as na, u as Ve, j as ra, D as aa, k as Ye, l as wt, q as Qt, t as oa, v as sa, w as ia } from "./DevPortalProvider-BTFqdAEL.js";
-import { c as Ut, P as Ie, R as ca, I as ua, S as la } from "./Spinner-yPSFgoZ8.js";
+import { c as Ut, P as Ie, R as ca, I as ua, S as la } from "./Spinner-oNQQyp-I.js";
 /**
  * @license lucide-react v0.378.0 - ISC
  *

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

@@ -1,9 +1,9 @@
 import { a as f, j as e, O as j } from "./jsx-runtime-CJBdjYYx.js";
 import { u as g, a as x, R as v } from "./SlotletProvider-D_Vz-7c_.js";
-import { u as w, a as h, I as k, S as b, b as K, c as N, d as A, e as E, f as p } from "./Input-qyZciIJp.js";
+import { u as w, a as h, I as k, S as b, b as K, c as N, d as A, e as E, f as p } from "./Input-GFpPXs5b.js";
 import { L as u } from "./index-Dt-pU7Vu.js";
 import { u as m, x as S, y as I } from "./DevPortalProvider-BTFqdAEL.js";
-import { B as o } from "./Combination-BIdpLnWg.js";
+import { B as o } from "./Combination-CS4rK8IJ.js";
 import { D as P } from "./DeveloperHint-DQVwIery.js";
 import { useState as C } from "react";
 import { c as l, a as D } from "./Markdown-QsZ-PHET.js";

package/lib/zudoku.plugin-openapi.js

@@ -1,9 +1,9 @@
 import "./jsx-runtime-CJBdjYYx.js";
-import { o as a } from "./index-DccqEFTy.js";
+import { o as a } from "./index-Uqja2h2M.js";
 import "./urql-DrBfkb92.js";
 import "zudoku/openapi-worker";
 import "./Markdown-QsZ-PHET.js";
-import "./Combination-BIdpLnWg.js";
+import "./Combination-CS4rK8IJ.js";
 import "./router-BiRCp01d.js";
 export {
   a as openApiPlugin

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zudoku",
-  "version": "0.3.0-dev.78",
+  "version": "0.3.0-dev.79",
   "type": "module",
   "files": [
     "dist",

package/src/app/main.css

@@ -115,7 +115,7 @@
   }
 
   .prose.prose {
-    @apply prose-a:decoration-primary/60 hover:prose-a:decoration-primary prose-a:underline-offset-4 hover:prose-a:decoration-2;
+    @apply prose-a:underline-offset-4 hover:prose-a:text-primary;
     @apply prose-blockquote:not-italic prose-blockquote:text-neutral-500/75 prose-blockquote:dark:text-neutral-400;
     @apply prose-headings:prose-code:mx-2;
     @apply prose-code:before:content-none prose-code:after:content-none;

package/src/lib/authentication/providers/openid.tsx

@@ -281,7 +281,7 @@ export class OpenIDAuthenticationProvider implements AuthenticationProvider {
     sessionStorage.removeItem(CODE_VERIFIER_KEY);
 
     if (!codeVerifier) {
-      return;
+      return "/";
     }
 
     const authServer = await this.getAuthServer();

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

@@ -17,8 +17,10 @@ import { ErrorPage } from "../../components/ErrorPage.js";
 import { SyntaxHighlight } from "../../components/SyntaxHighlight.js";
 import { Button } from "../../ui/Button.js";
 import { OasPluginConfig } from "./interfaces.js";
-import type { PlaygroundContentProps } from "./playground/Playground.js";
-import { PlaygroundDialog } from "./playground/PlaygroundDialog.js";
+import {
+  PlaygroundDialog,
+  type PlaygroundDialogProps,
+} from "./playground/PlaygroundDialog.js";
 
 const GetCategoriesQuery = graphql(`
   query GetCategories($input: JSON!, $type: SchemaType!) {
@@ -86,15 +88,19 @@ export const openApiPlugin = (
       }
     },
     getMdxComponents: () => ({
-      OpenPlaygroundButton: (props: PlaygroundContentProps) => {
-        return (
+      OpenPlaygroundButton: (props: PlaygroundDialogProps) => (
+        <div>
           <PlaygroundDialog {...props}>
             <Button className="gap-2 items-center" variant="outline">
-              Open in Playground <CirclePlayIcon size={16} />
+              {props.children ?? (
+                <>
+                  Open in Playground <CirclePlayIcon size={16} />
+                </>
+              )}
             </Button>
           </PlaygroundDialog>
-        );
-      },
+        </div>
+      ),
     }),
     getNavigation: async (path: string) => {
       if (!matchPath({ path: basePath, end: false }, path)) {

package/src/lib/plugins/openapi/playground/Playground.tsx

@@ -10,7 +10,6 @@ import {
   SelectValue,
 } from "../../../components/Select.js";
 import { Spinner } from "../../../components/Spinner.js";
-import { SyntaxHighlight } from "../../../components/SyntaxHighlight.js";
 import { Button } from "../../../ui/Button.js";
 import { Card } from "../../../ui/Card.js";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "../../../ui/Tabs.js";
@@ -20,6 +19,7 @@ import { createUrl } from "./createUrl.js";
 import { Headers } from "./Headers.js";
 import { PathParams } from "./PathParams.js";
 import { QueryParams } from "./QueryParams.js";
+import { ResponseTab } from "./ResponseTab.js";
 
 export const NO_IDENTITY = "__none";
 
@@ -37,7 +37,7 @@ function mimeTypeToLanguage(mimeType: string) {
 
   return Object.entries(mimeTypeMapping).find(([mime]) =>
     mimeType.includes(mime),
-  )?.[0][1];
+  )?.[1];
 }
 
 const statusCodeMap: Record<number, string> = {
@@ -331,14 +331,10 @@ export const Playground = ({
                   </TabsList>
 
                   <TabsContent value="response">
-                    <Card className="shadow-none p-4">
-                      <SyntaxHighlight
-                        language={lang ?? "json"}
-                        noBackground
-                        className="overflow-x-auto "
-                        code={queryMutation.data.body ?? JSON.stringify("")}
-                      />
-                    </Card>
+                    <ResponseTab
+                      headers={queryMutation.data.headers}
+                      body={queryMutation.data.body}
+                    />
                   </TabsContent>
                   <TabsContent value="headers">
                     <Card className="grid grid-cols-2 w-full gap-2.5 font-mono text-xs shadow-none p-4">
@@ -347,7 +343,7 @@ export const Playground = ({
                       {headerEntries.map(([key, value]) => (
                         <Fragment key={key}>
                           <div>{key}</div>
-                          <div>{value}</div>
+                          <div className="break-words">{value}</div>
                         </Fragment>
                       ))}
                     </Card>

package/src/lib/plugins/openapi/playground/PlaygroundDialog.tsx

@@ -9,7 +9,9 @@ import {
 } from "../../../components/Dialog.js";
 import { Playground, type PlaygroundContentProps } from "./Playground.js";
 
-const PlaygroundDialog = (props: PropsWithChildren<PlaygroundContentProps>) => {
+export type PlaygroundDialogProps = PropsWithChildren<PlaygroundContentProps>;
+
+const PlaygroundDialog = (props: PlaygroundDialogProps) => {
   const [open, setOpen] = useState(false);
   return (
     <Dialog onOpenChange={(open) => setOpen(open)}>

package/src/lib/plugins/openapi/playground/ResponseTab.tsx

@@ -0,0 +1,76 @@
+import { useState } from "react";
+import { SyntaxHighlight } from "../../../components/SyntaxHighlight.js";
+import { Card } from "../../../ui/Card.js";
+import { SimpleSelect } from "../SimpleSelect.js";
+
+const mimeTypeToLanguage = (mimeType: string) => {
+  const mimeTypeMapping = {
+    "application/json": "json",
+    "text/json": "json",
+    "text/html": "html",
+    "text/css": "css",
+    "text/javascript": "javascript",
+    "application/xml": "xml",
+    "application/xhtml+xml": "xhtml",
+  };
+
+  return Object.entries(mimeTypeMapping).find(([mime]) =>
+    mimeType.includes(mime),
+  )?.[1];
+};
+
+const detectLanguage = (headers: Headers) => {
+  const contentType = headers.get("Content-Type") || "";
+  return mimeTypeToLanguage(contentType);
+};
+
+const tryParseJson = (body: string) => {
+  try {
+    return JSON.stringify(JSON.parse(body), null, 2);
+  } catch {
+    return null;
+  }
+};
+
+export const ResponseTab = ({
+  body = "",
+  headers,
+}: {
+  body?: string;
+  headers: Headers;
+}) => {
+  const detectedLanguage = detectLanguage(headers);
+  const jsonContent = tryParseJson(body);
+  const beautifiedBody = jsonContent || body;
+  const [view, setView] = useState<"formatted" | "raw">(
+    jsonContent ? "formatted" : "raw",
+  );
+
+  return (
+    <div className="flex flex-col gap-2">
+      <Card className="shadow-none">
+        <SyntaxHighlight
+          language={
+            view === "raw" ? (jsonContent ? "plain" : detectedLanguage) : "json"
+          }
+          noBackground
+          showLanguageIndicator
+          className="overflow-x-auto p-4 text-xs"
+          code={view === "raw" ? body : beautifiedBody}
+        />
+      </Card>
+      {jsonContent && (
+        <div className="flex justify-end">
+          <SimpleSelect
+            value={view}
+            onChange={(e) => setView(e.target.value as "formatted" | "raw")}
+            options={[
+              { value: "formatted", label: "Formatted" },
+              { value: "raw", label: "Raw" },
+            ]}
+          />
+        </div>
+      )}
+    </div>
+  );
+};

package/src/lib/ui/Button.tsx

@@ -1,8 +1,38 @@
 import { Slot } from "@radix-ui/react-slot";
-import { VariantProps } from "class-variance-authority";
+import { cva, VariantProps } from "class-variance-authority";
 import * as React from "react";
 import { cn } from "../util/cn.js";
-import { buttonVariants } from "./button-variants.js";
+
+const buttonVariants = cva(
+  "not-prose inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        default:
+          "bg-primary text-primary-foreground shadow hover:bg-primary/90",
+        destructive:
+          "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
+        outline:
+          "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
+        secondary:
+          "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
+        ghost: "hover:bg-accent hover:text-accent-foreground",
+        link: "text-primary underline-offset-4 hover:underline",
+      },
+      size: {
+        default: "h-9 px-4 py-2",
+        sm: "h-8 rounded-md px-3 text-xs",
+        lg: "h-10 rounded-md px-8",
+        xl: "h-14 rounded-lg px-10 text-lg",
+        icon: "h-9 w-9",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default",
+    },
+  },
+);
 
 export interface ButtonProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,

package/dist/lib/ui/button-variants.d.ts

@@ -1,4 +0,0 @@
-export declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
-    size?: "default" | "sm" | "lg" | "xl" | "icon" | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;

package/dist/lib/ui/button-variants.js

@@ -1,25 +0,0 @@
-import { cva } from "class-variance-authority";
-export const buttonVariants = cva("inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50", {
-    variants: {
-        variant: {
-            default: "bg-primary text-primary-foreground shadow hover:bg-primary/90",
-            destructive: "bg-destructive text-destructive-foreground shadow-sm hover:bg-destructive/90",
-            outline: "border border-input bg-background shadow-sm hover:bg-accent hover:text-accent-foreground",
-            secondary: "bg-secondary text-secondary-foreground shadow-sm hover:bg-secondary/80",
-            ghost: "hover:bg-accent hover:text-accent-foreground",
-            link: "text-primary underline-offset-4 hover:underline",
-        },
-        size: {
-            default: "h-9 px-4 py-2",
-            sm: "h-8 rounded-md px-3 text-xs",
-            lg: "h-10 rounded-md px-8",
-            xl: "h-14 rounded-lg px-10 text-lg",
-            icon: "h-9 w-9",
-        },
-    },
-    defaultVariants: {
-        variant: "default",
-        size: "default",
-    },
-});
-//# sourceMappingURL=button-variants.js.map

package/dist/lib/ui/button-variants.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"button-variants.js","sourceRoot":"","sources":["../../../src/lib/ui/button-variants.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAE/C,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,CAC/B,qOAAqO,EACrO;IACE,QAAQ,EAAE;QACR,OAAO,EAAE;YACP,OAAO,EACL,+DAA+D;YACjE,WAAW,EACT,8EAA8E;YAChF,OAAO,EACL,0FAA0F;YAC5F,SAAS,EACP,wEAAwE;YAC1E,KAAK,EAAE,8CAA8C;YACrD,IAAI,EAAE,iDAAiD;SACxD;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,eAAe;YACxB,EAAE,EAAE,6BAA6B;YACjC,EAAE,EAAE,sBAAsB;YAC1B,EAAE,EAAE,+BAA+B;YACnC,IAAI,EAAE,SAAS;SAChB;KACF;IACD,eAAe,EAAE;QACf,OAAO,EAAE,SAAS;QAClB,IAAI,EAAE,SAAS;KAChB;CACF,CACF,CAAC"}