zudoku 0.0.0-e097cbb → 0.0.0-e0ffac16

package/src/lib/ui/Toggle.tsx

@@ -5,7 +5,7 @@ import * as React from "react";
 import { cn } from "../util/cn.js";
 
 const toggleVariants = cva(
-  "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2",
+  "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors hover:bg-muted hover:text-muted-foreground focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=on]:bg-accent data-[state=on]:text-accent-foreground [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0 gap-2",
   {
     variants: {
       variant: {

package/src/lib/ui/Tooltip.tsx

@@ -9,6 +9,15 @@ const Tooltip = TooltipPrimitive.Root;
 
 const TooltipTrigger = TooltipPrimitive.Trigger;
 
+const TooltipArrow = (
+  props: React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>,
+) => (
+  <TooltipPrimitive.Arrow
+    {...props}
+    className={cn(props.className, "fill-border")}
+  />
+);
+
 const TooltipContent = React.forwardRef<
   React.ElementRef<typeof TooltipPrimitive.Content>,
   React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>
@@ -25,4 +34,10 @@ const TooltipContent = React.forwardRef<
 ));
 TooltipContent.displayName = TooltipPrimitive.Content.displayName;
 
-export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };
+export {
+  Tooltip,
+  TooltipArrow,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+};

package/src/lib/util/MdxComponents.tsx

@@ -1,21 +1,34 @@
 import { type MDXComponents } from "mdx/types.js";
+import { CodeBlock } from "zudoku/ui/CodeBlock.js";
 import { AnchorLink } from "../components/AnchorLink.js";
+import { Framed } from "../components/Framed.js";
 import { Heading } from "../components/Heading.js";
 import { InlineCode } from "../components/InlineCode.js";
 import { Button } from "../ui/Button.js";
 import { Callout } from "../ui/Callout.js";
 import { Stepper } from "../ui/Stepper.js";
 import { SyntaxHighlight } from "../ui/SyntaxHighlight.js";
+import { cn } from "./cn.js";
 
 export type MdxComponentsType = Readonly<MDXComponents> | null | undefined;
 
 export const MdxComponents = {
   img: ({ node, ...props }) => {
     if (/\.(mp4|webm|mov|avi)$/.test(props.src ?? "")) {
-      return <video src={props.src} controls playsInline autoPlay loop />;
+      return (
+        <video
+          src={props.src}
+          controls
+          playsInline
+          autoPlay
+          loop
+          className={cn("rounded-lg", props.className)}
+        />
+      );
     }
-    return <img {...props} className="rounded-md" />;
+    return <img {...props} className={cn("rounded-lg", props.className)} />;
   },
+  Framed,
   h1: ({ children, id }) => (
     <Heading level={1} id={id}>
       {children}
@@ -62,26 +75,37 @@ export const MdxComponents = {
   caution: (props) => <Callout type="caution" {...props} />,
   warning: (props) => <Callout type="caution" {...props} />,
   danger: (props) => <Callout type="danger" {...props} />,
-  pre: ({ children }) => <>{children}</>,
-  code: ({ className, children, ...props }) => {
-    // `inline` provided by the rehype plugin, as react-markdown removed support for that
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const { inline, title } = props as Record<string, unknown>;
+  pre: (props) => (
+    <pre className={cn("not-prose my-4", props.className)} {...props} />
+  ),
+  code: ({
+    className,
+    node: _node,
+    children,
+    title,
+    inline,
+    showLineNumbers,
+    ...props
+  }) => {
+    const match = className?.match(/language?-(\w+)/);
 
-    if (inline === true || inline === "true") {
-      return <InlineCode className={className}>{children}</InlineCode>;
+    if (inline === "true" || inline === true) {
+      return (
+        <InlineCode className={cn(className, "inline")}>{children}</InlineCode>
+      );
     }
 
-    const match = className?.match(/language?-(\w+)/);
-
     return (
-      <SyntaxHighlight
+      <CodeBlock
         language={match?.[1]}
-        className="rounded-xl p-4 border dark:!bg-foreground/10 dark:border-transparent"
         showLanguageIndicator
-        code={String(children).trim()}
-        title={typeof title === "string" ? title : undefined}
-      />
+        showLineNumbers={showLineNumbers}
+        title={title}
+      >
+        <code className={cn(className, "not-inline")} {...props}>
+          {children}
+        </code>
+      </CodeBlock>
     );
   },
 } satisfies MdxComponentsType;

package/src/lib/util/humanFileSize.test.ts

@@ -0,0 +1,24 @@
+import { humanFileSize } from "./humanFileSize.js";
+
+describe("humanFileSize", () => {
+  it("should handle zero bytes", () => {
+    expect(humanFileSize(0)).toBe("0 B");
+    expect(humanFileSize()).toBe("0 B");
+  });
+
+  it("should handle undefined bytes", () => {
+    expect(humanFileSize(undefined)).toBe("0 B");
+  });
+
+  it("should handle positive bytes", () => {
+    expect(humanFileSize(200)).toBe("200 B");
+    expect(humanFileSize(1000)).toBe("1.00 kB");
+    expect(humanFileSize(1000000)).toBe("1.00 MB");
+    expect(humanFileSize(1000000000)).toBe("1.00 GB");
+    expect(humanFileSize(1000000000000)).toBe("1.00 TB");
+    expect(humanFileSize(1000000000000000)).toBe("1.00 PB");
+    expect(humanFileSize(1000000000000000000)).toBe("1.00 EB");
+    expect(humanFileSize(1000000000000000000000)).toBe("1.00 ZB");
+    expect(humanFileSize(1000000000000000000000000)).toBe("1.00 YB");
+  });
+});

package/src/lib/util/humanFileSize.ts

@@ -0,0 +1,16 @@
+/**
+ * Converts a number of bytes to a human-readable file size string
+ * @param bytes - The number of bytes (defaults to 0)
+ * @returns A formatted string like "1.23 MB" or "456 B"
+ */
+export const humanFileSize = (bytes = 0) => {
+  if (bytes === 0) {
+    return "0 B";
+  }
+
+  const exponent = Math.floor(Math.log(bytes) / Math.log(1000.0));
+  const decimal = (bytes / Math.pow(1000.0, exponent)).toFixed(
+    exponent ? 2 : 0,
+  );
+  return `${decimal} ${exponent ? `${"kMGTPEZY"[exponent - 1]}B` : "B"}`;
+};

package/src/lib/util/invariant.ts

@@ -18,17 +18,19 @@ export default function invariant(
   throw new ZudokuError(provided ?? "Invariant failed");
 }
 
+export type ZudokuErrorOptions = {
+  developerHint?: string;
+  title?: string;
+  cause?: Error;
+};
+
 export class ZudokuError extends Error {
   public developerHint: string | undefined;
   public title: string | undefined;
 
   constructor(
     message: string,
-    {
-      developerHint,
-      title,
-      cause,
-    }: { developerHint?: string; title?: string; cause?: Error } = {},
+    { developerHint, title, cause }: ZudokuErrorOptions = {},
   ) {
     super(message, { cause });
     this.name = "ZudokuError";

package/src/lib/util/os.ts

@@ -0,0 +1,18 @@
+export function getOS(): "apple" | "linux" | "unix" | "windows" | undefined {
+  const notFound = -1;
+  const userAgent = navigator.userAgent.toLowerCase();
+  if (userAgent.indexOf("win") !== notFound) {
+    return "windows";
+  } else if (userAgent.indexOf("mac") !== notFound) {
+    return "apple";
+  } else if (userAgent.indexOf("linux") !== notFound) {
+    return "linux";
+  } else if (userAgent.indexOf("x11") !== notFound) {
+    return "unix";
+  }
+  return;
+}
+
+export function isAppleDevice(): boolean {
+  return getOS() === "apple";
+}

package/src/lib/util/traverse.ts

@@ -4,9 +4,10 @@ export type { RecordAny };
 
 export const traverse = <T extends JsonValue = RecordAny>(
   specification: RecordAny,
-  transform: (specification: RecordAny) => T,
+  transform: (specification: RecordAny, path?: string[]) => T,
+  path: string[] = [],
 ) => {
-  const transformed = transform(specification);
+  const transformed = transform(specification, path);
   if (typeof transformed !== "object" || transformed === null) {
     return transformed;
   }
@@ -14,14 +15,16 @@ export const traverse = <T extends JsonValue = RecordAny>(
   const result: RecordAny = Array.isArray(transformed) ? [] : {};
 
   for (const [key, value] of Object.entries(transformed)) {
+    const currentPath = [...path, key];
+
     if (Array.isArray(value)) {
-      result[key] = value.map((item) =>
+      result[key] = value.map((item, index) =>
         typeof item === "object" && item != null
-          ? traverse(item, transform)
+          ? traverse(item, transform, [...currentPath, index.toString()])
           : item,
       );
     } else if (typeof value === "object" && value != null) {
-      result[key] = traverse(value, transform);
+      result[key] = traverse(value, transform, currentPath);
     } else {
       result[key] = value;
     }

package/src/lib/util/url.test.ts

@@ -0,0 +1,51 @@
+import { describe, expect, it } from "vitest";
+import { normalizeRedirectUrl } from "./url.js";
+
+describe("normalizeRedirectUrl", () => {
+  const mockOrigin = "https://example.com";
+
+  it("should return original URL if it doesn't start with origin", () => {
+    const result = normalizeRedirectUrl(
+      "https://other.com/path",
+      mockOrigin,
+      "/",
+    );
+    expect(result).toBe("https://other.com/path");
+  });
+
+  it("should remove origin when root is /", () => {
+    const result = normalizeRedirectUrl(
+      "https://example.com/some/path",
+      mockOrigin,
+      "/",
+    );
+    expect(result).toBe("/some/path");
+  });
+
+  it("should remove origin and root path when root is not /", () => {
+    const result = normalizeRedirectUrl(
+      "https://example.com/docs/some/path",
+      mockOrigin,
+      "/docs",
+    );
+    expect(result).toBe("/some/path");
+  });
+
+  it("should only remove origin when URL doesn't match root path", () => {
+    const result = normalizeRedirectUrl(
+      "https://example.com/other/path",
+      mockOrigin,
+      "/docs",
+    );
+    expect(result).toBe("/other/path");
+  });
+
+  it("should handle empty root path", () => {
+    const result = normalizeRedirectUrl(
+      "https://example.com/path",
+      mockOrigin,
+      "",
+    );
+    expect(result).toBe("/path");
+  });
+});

package/src/lib/util/url.ts

@@ -0,0 +1,18 @@
+/**
+ * Normalizes a redirect URL by removing the origin and optionally the root path
+ */
+export function normalizeRedirectUrl(
+  redirectTo: string,
+  origin: string,
+  basePath: string = "/",
+): string {
+  if (!redirectTo.startsWith(origin)) {
+    return redirectTo;
+  }
+
+  if (basePath !== "/" && redirectTo.startsWith(origin + basePath)) {
+    return redirectTo.slice(origin.length + basePath.length);
+  }
+
+  return redirectTo.slice(origin.length);
+}

package/src/lib/util/useCopyToClipboard.ts

@@ -0,0 +1,17 @@
+import { useCallback, useState } from "react";
+
+export const useCopyToClipboard = (timeout = 2000) => {
+  const [isCopied, setIsCopied] = useState(false);
+
+  const copyToClipboard = useCallback(
+    (text: string) => {
+      void navigator.clipboard.writeText(text);
+      setIsCopied(true);
+
+      setTimeout(() => setIsCopied(false), timeout);
+    },
+    [timeout],
+  );
+
+  return [isCopied, copyToClipboard] as const;
+};

package/src/lib/util/useExposedProps.tsx

@@ -1,10 +1,21 @@
 import {
+  type Location,
+  type NavigateFunction,
+  type Params,
+  type SetURLSearchParams,
   useLocation,
   useNavigate,
   useParams,
   useSearchParams,
 } from "react-router";
-import type { ExposedComponentProps } from "../components/SlotletProvider.js";
+
+export type ExposedComponentProps = {
+  location: Location;
+  navigate: NavigateFunction;
+  searchParams: URLSearchParams;
+  setSearchParams: SetURLSearchParams;
+  params: Params;
+};
 
 export const useExposedProps = (): ExposedComponentProps => {
   const location = useLocation();

package/src/lib/util/useScrollToAnchor.ts

@@ -1,7 +1,7 @@
 import { useCallback, useEffect, useRef } from "react";
 import { useLocation } from "react-router";
 import { useViewportAnchor } from "../components/context/ViewportAnchorContext.js";
-import { DATA_ANCHOR_ATTR } from "../components/navigation/SidebarItem.js";
+import { DATA_ANCHOR_ATTR } from "../components/navigation/NavigationItem.js";
 import { scrollIntoViewIfNeeded } from "./scrollIntoViewIfNeeded.js";
 
 export const useScrollToHash = () => {
@@ -11,8 +11,8 @@ export const useScrollToHash = () => {
     (hash: string) => {
       const cleanHash = hash.replace(/^#/, "");
 
-      // Operation list items might have subdivisions that the sidebar doesn't show.
-      // The subdivisions are separated by a slash so we need to remove everything before the slash to get the sidebar correct item.
+      // Operation list items might have subdivisions that the navigation doesn't show.
+      // The subdivisions are separated by a slash so we need to remove everything before the slash to get the navigation correct item.
       const linkHash = cleanHash.split("/").at(0)!;
       const element = document.getElementById(decodeURIComponent(cleanHash));
 

package/src/shiki/langs/abap.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/abap";

package/src/shiki/langs/actionscript-3.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/actionscript-3";

package/src/shiki/langs/ada.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/ada";

package/src/shiki/langs/angular-expression.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-expression";

package/src/shiki/langs/angular-html.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-html";

package/src/shiki/langs/angular-inline-style.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-inline-style";

package/src/shiki/langs/angular-inline-template.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-inline-template";

package/src/shiki/langs/angular-let-declaration.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-let-declaration";

package/src/shiki/langs/angular-template-blocks.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-template-blocks";

package/src/shiki/langs/angular-template.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-template";

package/src/shiki/langs/angular-ts.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/angular-ts";

package/src/shiki/langs/apache.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/apache";

package/src/shiki/langs/apex.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/apex";

package/src/shiki/langs/apl.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/apl";

package/src/shiki/langs/applescript.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/applescript";

package/src/shiki/langs/ara.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/ara";

package/src/shiki/langs/asciidoc.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/asciidoc";

package/src/shiki/langs/asm.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/asm";

package/src/shiki/langs/astro.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/astro";

package/src/shiki/langs/awk.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/awk";

package/src/shiki/langs/ballerina.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/ballerina";

package/src/shiki/langs/bat.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/bat";

package/src/shiki/langs/beancount.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/beancount";

package/src/shiki/langs/berry.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/berry";

package/src/shiki/langs/bibtex.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/bibtex";

package/src/shiki/langs/bicep.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/bicep";

package/src/shiki/langs/blade.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/blade";

package/src/shiki/langs/bsl.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/bsl";

package/src/shiki/langs/c.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/c";

package/src/shiki/langs/cadence.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cadence";

package/src/shiki/langs/cairo.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cairo";

package/src/shiki/langs/clarity.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/clarity";

package/src/shiki/langs/clojure.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/clojure";

package/src/shiki/langs/cmake.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cmake";

package/src/shiki/langs/cobol.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cobol";

package/src/shiki/langs/codeowners.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/codeowners";

package/src/shiki/langs/codeql.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/codeql";

package/src/shiki/langs/coffee.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/coffee";

package/src/shiki/langs/common-lisp.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/common-lisp";

package/src/shiki/langs/coq.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/coq";

package/src/shiki/langs/cpp-macro.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cpp-macro";

package/src/shiki/langs/cpp.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cpp";

package/src/shiki/langs/crystal.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/crystal";

package/src/shiki/langs/csharp.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/csharp";

package/src/shiki/langs/css.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/css";

package/src/shiki/langs/csv.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/csv";

package/src/shiki/langs/cue.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cue";

package/src/shiki/langs/cypher.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/cypher";

package/src/shiki/langs/d.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/d";

package/src/shiki/langs/dart.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/dart";

package/src/shiki/langs/dax.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/dax";

package/src/shiki/langs/desktop.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/desktop";

package/src/shiki/langs/diff.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/diff";

package/src/shiki/langs/docker.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/docker";

package/src/shiki/langs/dotenv.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/dotenv";

package/src/shiki/langs/dream-maker.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/dream-maker";

package/src/shiki/langs/edge.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/edge";

package/src/shiki/langs/elixir.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/elixir";

package/src/shiki/langs/elm.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/elm";

package/src/shiki/langs/emacs-lisp.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/emacs-lisp";

package/src/shiki/langs/erb.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/erb";

package/src/shiki/langs/erlang.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/erlang";

package/src/shiki/langs/es-tag-css.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/es-tag-css";

package/src/shiki/langs/es-tag-glsl.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/es-tag-glsl";

package/src/shiki/langs/es-tag-html.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/es-tag-html";

package/src/shiki/langs/es-tag-sql.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/es-tag-sql";

package/src/shiki/langs/es-tag-xml.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/es-tag-xml";

package/src/shiki/langs/fennel.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/fennel";

package/src/shiki/langs/fish.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/fish";

package/src/shiki/langs/fluent.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/fluent";

package/src/shiki/langs/fortran-fixed-form.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/fortran-fixed-form";

package/src/shiki/langs/fortran-free-form.js

@@ -0,0 +1 @@
+export { default } from "@shikijs/langs/fortran-free-form";