blodemd 0.1.0 → 0.2.0

package/docs/components/docs/copy-page-menu.tsx

@@ -1,364 +0,0 @@
-"use client";
-
-import { slugify } from "@repo/common";
-import {
-  CheckIcon,
-  ChevronDownSmallIcon,
-  ClaudeaiIcon,
-  CopySimpleIcon,
-  FileTextIcon,
-  OpenaiIcon,
-} from "blode-icons-react";
-import type React from "react";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-
-import {
-  Popover,
-  PopoverContent,
-  PopoverTrigger,
-} from "@/components/ui/popover";
-
-interface CopyPageMenuProps {
-  content?: string;
-  contentUrl?: string;
-  title: string;
-}
-
-type CopyStatus = "copied" | "error" | "idle";
-
-const MARKDOWN_ACCEPT = "text/markdown,text/plain;q=0.9,*/*;q=0.8";
-
-const LEADING_H1_REGEX = /^#\s+([^\r\n]+)(?:\r?\n(?:\r?\n)?)?/;
-
-const stripMatchingLeadingH1 = (source: string, title: string) => {
-  const trimmed = source.trimStart();
-  const match = LEADING_H1_REGEX.exec(trimmed);
-  if (!match) {
-    return trimmed.trim();
-  }
-
-  const [headingLine = "", headingTitle = ""] = match;
-  if (slugify(headingTitle) !== slugify(title)) {
-    return trimmed.trim();
-  }
-
-  return trimmed.slice(headingLine.length).trim();
-};
-
-const formatMarkdownForCopy = (source: string, title: string) => {
-  const content = stripMatchingLeadingH1(source, title);
-  if (!content) {
-    return `# ${title}`;
-  }
-
-  return `# ${title}\n\n${content}`;
-};
-
-const getCopyLabel = (copyStatus: CopyStatus) => {
-  switch (copyStatus) {
-    case "copied": {
-      return "Copied";
-    }
-    case "error": {
-      return "Copy failed";
-    }
-    default: {
-      return "Copy page";
-    }
-  }
-};
-
-const getCopyDescription = (copyStatus: CopyStatus) => {
-  switch (copyStatus) {
-    case "copied": {
-      return "Copied page markdown to clipboard";
-    }
-    case "error": {
-      return "Clipboard access was blocked or the page markdown could not be loaded";
-    }
-    default: {
-      return "Copy page as Markdown for LLMs";
-    }
-  }
-};
-
-const getCopyIcon = (copyStatus: CopyStatus) =>
-  copyStatus === "copied" ? CheckIcon : CopySimpleIcon;
-
-const MenuItem = ({
-  children,
-  href,
-  onSelect,
-}: {
-  children: React.ReactNode;
-  href?: string;
-  onSelect?: () => Promise<void> | void;
-}) =>
-  href ? (
-    <a
-      className="flex items-center gap-3 rounded-lg px-3 py-2.5 text-sm transition-colors hover:bg-secondary/25 focus-visible:bg-secondary/25 focus-visible:outline-none"
-      href={href}
-      onClick={onSelect}
-      rel="noopener noreferrer"
-      target="_blank"
-    >
-      {children}
-    </a>
-  ) : (
-    <button
-      className="flex w-full items-center gap-3 rounded-lg px-3 py-2.5 text-left text-sm transition-colors hover:bg-secondary/25 focus-visible:bg-secondary/25 focus-visible:outline-none"
-      onClick={onSelect}
-      type="button"
-    >
-      {children}
-    </button>
-  );
-
-const MenuIcon = ({ children }: { children: React.ReactNode }) => (
-  <div className="flex size-8 shrink-0 items-center justify-center rounded-md border border-border">
-    {children}
-  </div>
-);
-
-const ExternalArrow = () => (
-  <svg
-    aria-hidden="true"
-    className="ml-1 inline-block size-3"
-    fill="none"
-    stroke="currentColor"
-    strokeLinecap="round"
-    strokeLinejoin="round"
-    strokeWidth={2}
-    viewBox="0 0 24 24"
-  >
-    <path d="M7 17L17 7M7 7h10v10" />
-  </svg>
-);
-
-export const CopyPageMenu = ({
-  content,
-  contentUrl,
-  title,
-}: CopyPageMenuProps) => {
-  const resetTimerRef = useRef<number | null>(null);
-  const [copyStatus, setCopyStatus] = useState<CopyStatus>("idle");
-  const [fetchedContent, setFetchedContent] = useState<string | null>(null);
-  const [menuOpen, setMenuOpen] = useState(false);
-
-  const pageUrl = useMemo(
-    () =>
-      typeof window === "undefined"
-        ? ""
-        : new URL(contentUrl ?? window.location.href, window.location.href)
-            .href,
-    [contentUrl]
-  );
-
-  useEffect(
-    () => () => {
-      if (resetTimerRef.current !== null) {
-        window.clearTimeout(resetTimerRef.current);
-      }
-    },
-    []
-  );
-
-  useEffect(() => {
-    if (content || !contentUrl) {
-      return;
-    }
-
-    const controller = new AbortController();
-
-    const prefetch = async () => {
-      try {
-        const res = await fetch(contentUrl, {
-          headers: { accept: MARKDOWN_ACCEPT },
-          signal: controller.signal,
-        });
-        const text = res.ok ? await res.text() : null;
-        if (text) {
-          setFetchedContent(text);
-        }
-      } catch {
-        // Ignore prefetch failures — the copy handler retries on demand
-      }
-    };
-
-    prefetch();
-
-    return () => controller.abort();
-  }, [content, contentUrl]);
-
-  const closeMenu = useCallback(() => {
-    setMenuOpen(false);
-  }, []);
-
-  const setTemporaryCopyStatus = useCallback(
-    (nextStatus: "copied" | "error") => {
-      if (resetTimerRef.current !== null) {
-        window.clearTimeout(resetTimerRef.current);
-      }
-
-      setCopyStatus(nextStatus);
-      resetTimerRef.current = window.setTimeout(() => {
-        setCopyStatus("idle");
-        resetTimerRef.current = null;
-      }, 2000);
-    },
-    []
-  );
-
-  const getContent = useCallback(async () => {
-    const resolvedContent = content ?? fetchedContent;
-    if (resolvedContent) {
-      return resolvedContent;
-    }
-
-    if (!contentUrl) {
-      return "";
-    }
-
-    const response = await fetch(contentUrl, {
-      headers: { accept: MARKDOWN_ACCEPT },
-    });
-    if (!response.ok) {
-      throw new Error(`Failed to load page markdown: ${response.status}`);
-    }
-
-    const nextContent = await response.text();
-    setFetchedContent(nextContent);
-    return nextContent;
-  }, [content, contentUrl, fetchedContent]);
-
-  const handleCopy = useCallback(async () => {
-    try {
-      // Use ClipboardItem with a promise-based blob so the clipboard "slot"
-      // is claimed synchronously during the tap gesture.  iOS Safari revokes
-      // user-activation if an async boundary (e.g. a network fetch) sits
-      // between the tap and the clipboard call, so the old writeText path
-      // fails when tapped before the pre-fetch finishes.
-      if (typeof ClipboardItem !== "undefined" && navigator.clipboard.write) {
-        const blobPromise = (async () => {
-          const text = await getContent();
-          const markdown = formatMarkdownForCopy(text, title);
-          return new Blob([markdown], { type: "text/plain" });
-        })();
-        const item = new ClipboardItem({ "text/plain": blobPromise });
-        await navigator.clipboard.write([item]);
-      } else {
-        const nextContent = await getContent();
-        const markdown = formatMarkdownForCopy(nextContent, title);
-        await navigator.clipboard.writeText(markdown);
-      }
-      setTemporaryCopyStatus("copied");
-      closeMenu();
-    } catch {
-      setTemporaryCopyStatus("error");
-    }
-  }, [closeMenu, getContent, setTemporaryCopyStatus, title]);
-
-  const chatgptUrl = pageUrl
-    ? `https://chatgpt.com/?hints=search&q=${encodeURIComponent(`Read from ${pageUrl} so I can ask questions about it.`)}`
-    : undefined;
-  const claudeUrl = pageUrl
-    ? `https://claude.ai/new?q=${encodeURIComponent(`Read from ${pageUrl} so I can ask questions about it.`)}`
-    : undefined;
-  const copyLabel = getCopyLabel(copyStatus);
-  const copyDescription = getCopyDescription(copyStatus);
-  const CopyIcon = getCopyIcon(copyStatus);
-
-  return (
-    <Popover onOpenChange={setMenuOpen} open={menuOpen}>
-      <div className="flex shrink-0 items-center">
-        <button
-          className="inline-flex items-center gap-2 rounded-l-xl border border-r-0 border-border px-3 py-1.5 text-sm font-medium transition-colors hover:bg-secondary/25"
-          onClick={handleCopy}
-          type="button"
-        >
-          <CopyIcon aria-hidden="true" className="size-[18px]" />
-          <span>{copyLabel}</span>
-        </button>
-
-        <PopoverTrigger asChild>
-          <button
-            aria-expanded={menuOpen}
-            aria-label="More actions"
-            className="inline-flex items-center self-stretch rounded-r-xl border border-border px-2 transition-colors hover:bg-secondary/25"
-            type="button"
-          >
-            <ChevronDownSmallIcon
-              aria-hidden="true"
-              className="size-[18px] text-muted-foreground"
-            />
-          </button>
-        </PopoverTrigger>
-      </div>
-
-      <PopoverContent align="end" className="w-[280px] rounded-xl p-1">
-        {contentUrl ? (
-          <MenuItem href={contentUrl} onSelect={closeMenu}>
-            <MenuIcon>
-              <FileTextIcon aria-hidden="true" className="size-[18px]" />
-            </MenuIcon>
-            <div className="flex-1">
-              <div className="font-medium">
-                View as markdown
-                <ExternalArrow />
-              </div>
-              <div className="text-xs text-muted-foreground">
-                Open the raw .md source in a new tab
-              </div>
-            </div>
-          </MenuItem>
-        ) : null}
-
-        <MenuItem onSelect={handleCopy}>
-          <MenuIcon>
-            <CopyIcon aria-hidden="true" className="size-[18px]" />
-          </MenuIcon>
-          <div>
-            <div className="font-medium">{copyLabel}</div>
-            <div className="text-xs text-muted-foreground">
-              {copyDescription}
-            </div>
-          </div>
-        </MenuItem>
-
-        {chatgptUrl ? (
-          <MenuItem href={chatgptUrl} onSelect={closeMenu}>
-            <MenuIcon>
-              <OpenaiIcon aria-hidden="true" className="size-[18px]" />
-            </MenuIcon>
-            <div className="flex-1">
-              <div className="font-medium">
-                Open in ChatGPT
-                <ExternalArrow />
-              </div>
-              <div className="text-xs text-muted-foreground">
-                Ask questions about this page
-              </div>
-            </div>
-          </MenuItem>
-        ) : null}
-
-        {claudeUrl ? (
-          <MenuItem href={claudeUrl} onSelect={closeMenu}>
-            <MenuIcon>
-              <ClaudeaiIcon aria-hidden="true" className="size-[18px]" />
-            </MenuIcon>
-            <div className="flex-1">
-              <div className="font-medium">
-                Open in Claude
-                <ExternalArrow />
-              </div>
-              <div className="text-xs text-muted-foreground">
-                Ask questions about this page
-              </div>
-            </div>
-          </MenuItem>
-        ) : null}
-      </PopoverContent>
-    </Popover>
-  );
-};

package/docs/components/docs/doc-header.tsx

@@ -1,223 +0,0 @@
-import type { SiteConfig } from "@repo/models";
-import Image from "next/image";
-import Link from "next/link";
-
-import { MobileNav } from "@/components/docs/mobile-nav";
-import { Search } from "@/components/ui/search";
-import { ThemeToggle } from "@/components/ui/theme-toggle";
-import type { NavEntry, NavTab } from "@/lib/navigation";
-import { isExternalHref, resolveHref, toDocHref } from "@/lib/routes";
-import { cn } from "@/lib/utils";
-
-const EMPTY_NAV: NavEntry[] = [];
-
-const Dropdown = ({
-  label,
-  items,
-  basePath,
-}: {
-  label: string;
-  items: { label: string; url: string }[];
-  basePath: string;
-}) => {
-  if (!items.length) {
-    return null;
-  }
-  return (
-    <details className="relative">
-      <summary className="cursor-pointer rounded-full border border-border bg-background px-3 py-1.5 text-sm">
-        {label}
-      </summary>
-      <div className="absolute right-0 top-11 z-20 grid min-w-36 overflow-hidden rounded-xl border border-border bg-popover shadow-popover">
-        {items.map((item) => {
-          const href = resolveHref(item.url, basePath);
-          const isExternal = isExternalHref(item.url);
-
-          return (
-            <Link
-              className="px-3 py-2 hover:bg-accent"
-              href={href}
-              key={item.label}
-              rel={isExternal ? "noopener noreferrer" : undefined}
-              target={isExternal ? "_blank" : undefined}
-            >
-              {item.label}
-            </Link>
-          );
-        })}
-      </div>
-    </details>
-  );
-};
-
-const HeaderTabs = ({
-  tabs,
-  activeTabIndex = 0,
-  basePath,
-}: {
-  tabs: NavTab[];
-  activeTabIndex?: number;
-  basePath: string;
-}) => (
-  <nav
-    aria-label="Navigation tabs"
-    className="ml-4 hidden items-center gap-0.5 lg:flex"
-  >
-    {tabs.map((tab, index) => {
-      const isActive = index === activeTabIndex;
-      const href =
-        (tab.href ? resolveHref(tab.href, basePath) : undefined) ??
-        (tab.slugPrefix ? toDocHref(tab.slugPrefix, basePath) : undefined);
-
-      if (!href) {
-        return null;
-      }
-
-      const isExternal = Boolean(tab.href && isExternalHref(tab.href));
-
-      return (
-        <Link
-          className={cn(
-            "relative px-2.5 py-1.5 text-sm transition-colors",
-            isActive
-              ? "font-medium text-primary"
-              : "text-muted-foreground hover:text-foreground"
-          )}
-          href={href}
-          key={tab.label}
-          rel={isExternal ? "noopener noreferrer" : undefined}
-          target={isExternal ? "_blank" : undefined}
-        >
-          {tab.label}
-          {isActive ? (
-            <span className="absolute inset-x-1 -bottom-3.5 h-0.5 rounded-full bg-primary" />
-          ) : null}
-        </Link>
-      );
-    })}
-  </nav>
-);
-
-// oxlint-disable-next-line eslint/complexity
-export const DocHeader = ({
-  config,
-  basePath,
-  tabs,
-  activeTabIndex,
-  nav = EMPTY_NAV,
-}: {
-  config: SiteConfig;
-  basePath: string;
-  tabs?: NavTab[] | null;
-  activeTabIndex?: number;
-  nav?: NavEntry[];
-}) => {
-  const globalLinks = config.navigation?.global?.links ?? [];
-  const versions = config.navigation?.versions ?? [];
-  const languages = config.navigation?.languages ?? [];
-  const [primaryVersion] = versions;
-  const [primaryLanguage] = languages;
-  const searchDisabled = config.features?.search === false;
-  const themeToggleDisabled = config.features?.themeToggle === false;
-  const logoHref = config.logo?.href ?? toDocHref("index", basePath);
-  const logoIsExternal = Boolean(
-    config.logo?.href && isExternalHref(config.logo.href)
-  );
-
-  return (
-    <header
-      className="sticky top-0 z-50 w-full bg-background"
-      data-markdown-ignore=""
-    >
-      <div className="container-wrapper px-4 lg:px-8">
-        <div className="flex h-(--header-height) items-center">
-          <MobileNav
-            activeTabIndex={activeTabIndex}
-            basePath={basePath}
-            className="flex lg:hidden"
-            entries={nav}
-            globalLinks={globalLinks}
-            tabs={tabs}
-          />
-          <Link
-            className="flex items-center gap-2.5"
-            href={logoHref}
-            rel={logoIsExternal ? "noopener noreferrer" : undefined}
-            target={logoIsExternal ? "_blank" : undefined}
-          >
-            {config.logo?.light ? (
-              <Image
-                alt={config.logo.alt ?? config.name}
-                className="dark:hidden"
-                data-logo="light"
-                height={32}
-                loading="eager"
-                src={config.logo.light}
-                unoptimized
-                width={140}
-              />
-            ) : null}
-            {config.logo?.dark ? (
-              <Image
-                alt={config.logo.alt ?? config.name}
-                className="hidden dark:inline-block"
-                data-logo="dark"
-                height={32}
-                loading="eager"
-                src={config.logo.dark}
-                unoptimized
-                width={140}
-              />
-            ) : null}
-            {config.logo?.light || config.logo?.dark ? null : (
-              <span className="text-xl font-bold">{config.name}</span>
-            )}
-          </Link>
-          {tabs?.length ? (
-            <HeaderTabs
-              activeTabIndex={activeTabIndex}
-              basePath={basePath}
-              tabs={tabs}
-            />
-          ) : null}
-          <nav
-            aria-label="External links"
-            className="ml-1 hidden items-center gap-0 text-sm text-muted-foreground lg:flex"
-          >
-            {globalLinks.map((link) => (
-              <a
-                className="rounded-lg px-2.5 py-1.5 transition-colors hover:bg-muted hover:text-foreground"
-                href={link.href}
-                key={link.label}
-                rel="noopener noreferrer"
-                target="_blank"
-              >
-                {link.label}
-              </a>
-            ))}
-          </nav>
-          <div className="ml-auto flex items-center gap-2 md:flex-1 md:justify-end">
-            {searchDisabled ? null : (
-              <Search basePath={basePath} key={basePath} />
-            )}
-            {primaryVersion ? (
-              <Dropdown
-                basePath={basePath}
-                items={versions}
-                label={primaryVersion.label}
-              />
-            ) : null}
-            {primaryLanguage ? (
-              <Dropdown
-                basePath={basePath}
-                items={languages}
-                label={primaryLanguage.label}
-              />
-            ) : null}
-            {themeToggleDisabled ? null : <ThemeToggle />}
-          </div>
-        </div>
-      </div>
-    </header>
-  );
-};