@tetrascience-npm/tetrascience-react-ui 0.7.0-beta.107.1 → 0.7.0-beta.128.1

package/dist/components/ui/code-block.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"code-block.cjs","sources":["../../../src/components/ui/code-block.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"lucide-react\";\nimport {\n  createContext,\n  memo,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { createHighlighter } from \"shiki\";\n\nimport type { ComponentProps, CSSProperties, HTMLAttributes } from \"react\";\nimport type {\n  BundledLanguage,\n  BundledTheme,\n  HighlighterGeneric,\n  ThemedToken,\n} from \"shiki\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@/components/ui/select\";\nimport { cn } from \"@/lib/utils\";\n\n\n\n\n// Shiki uses bitflags for font styles: 1=italic, 2=bold, 4=underline\n// oxlint-disable-next-line eslint(no-bitwise)\nconst isItalic = (fontStyle: number | undefined) => fontStyle && fontStyle & 1;\n// oxlint-disable-next-line eslint(no-bitwise)\nconst isBold = (fontStyle: number | undefined) => fontStyle && fontStyle & 2;\nconst isUnderline = (fontStyle: number | undefined) =>\n  // oxlint-disable-next-line eslint(no-bitwise)\n  fontStyle && fontStyle & 4;\n\n// Transform tokens to include pre-computed keys to avoid noArrayIndexKey lint\ninterface KeyedToken {\n  token: ThemedToken;\n  key: string;\n}\ninterface KeyedLine {\n  tokens: KeyedToken[];\n  key: string;\n}\n\nconst addKeysToTokens = (lines: ThemedToken[][]): KeyedLine[] =>\n  lines.map((line, lineIdx) => ({\n    key: `line-${lineIdx}`,\n    tokens: line.map((token, tokenIdx) => ({\n      key: `line-${lineIdx}-${tokenIdx}`,\n      token,\n    })),\n  }));\n\n// Token rendering component\nconst TokenSpan = ({ token }: { token: ThemedToken }) => (\n  <span\n    className=\"dark:!bg-[var(--shiki-dark-bg)] dark:!text-[var(--shiki-dark)]\"\n    style={\n      {\n        backgroundColor: token.bgColor,\n        color: token.color,\n        fontStyle: isItalic(token.fontStyle) ? \"italic\" : undefined,\n        fontWeight: isBold(token.fontStyle) ? \"bold\" : undefined,\n        textDecoration: isUnderline(token.fontStyle) ? \"underline\" : undefined,\n        ...token.htmlStyle,\n      } as CSSProperties\n    }\n  >\n    {token.content}\n  </span>\n);\n\n// Line number styles using CSS counters\nconst LINE_NUMBER_CLASSES = cn(\n  \"block\",\n  \"before:content-[counter(line)]\",\n  \"before:inline-block\",\n  \"before:[counter-increment:line]\",\n  \"before:w-8\",\n  \"before:mr-4\",\n  \"before:text-right\",\n  \"before:text-muted-foreground/50\",\n  \"before:font-mono\",\n  \"before:select-none\"\n);\n\n// Line rendering component\nconst LineSpan = ({\n  keyedLine,\n  showLineNumbers,\n}: {\n  keyedLine: KeyedLine;\n  showLineNumbers: boolean;\n}) => (\n  <span className={showLineNumbers ? LINE_NUMBER_CLASSES : \"block\"}>\n    {keyedLine.tokens.length === 0\n      ? \"\\n\"\n      : keyedLine.tokens.map(({ token, key }) => (\n          <TokenSpan key={key} token={token} />\n        ))}\n  </span>\n);\n\n// Types\ntype CodeBlockProps = HTMLAttributes<HTMLDivElement> & {\n  code: string;\n  language: BundledLanguage;\n  showLineNumbers?: boolean;\n};\n\ninterface TokenizedCode {\n  tokens: ThemedToken[][];\n  fg: string;\n  bg: string;\n}\n\ninterface CodeBlockContextType {\n  code: string;\n}\n\n// Context\nconst CodeBlockContext = createContext<CodeBlockContextType>({\n  code: \"\",\n});\n\n// Highlighter cache (singleton per language)\nconst highlighterCache = new Map<\n  string,\n  Promise<HighlighterGeneric<BundledLanguage, BundledTheme>>\n>();\n\n// Token cache\nconst tokensCache = new Map<string, TokenizedCode>();\n\n// Subscribers for async token updates\nconst subscribers = new Map<string, Set<(result: TokenizedCode) => void>>();\n\nconst CACHE_KEY_SLICE_LENGTH = 100;\n\nconst getTokensCacheKey = (code: string, language: BundledLanguage) => {\n  const start = code.slice(0, CACHE_KEY_SLICE_LENGTH);\n  const end = code.length > CACHE_KEY_SLICE_LENGTH ? code.slice(-CACHE_KEY_SLICE_LENGTH) : \"\";\n  return `${language}:${code.length}:${start}:${end}`;\n};\n\nconst getHighlighter = (\n  language: BundledLanguage\n): Promise<HighlighterGeneric<BundledLanguage, BundledTheme>> => {\n  const cached = highlighterCache.get(language);\n  if (cached) {\n    return cached;\n  }\n\n  const highlighterPromise = createHighlighter({\n    langs: [language],\n    themes: [\"github-light\", \"github-dark\"],\n  });\n\n  highlighterCache.set(language, highlighterPromise);\n  return highlighterPromise;\n};\n\n// Create raw tokens for immediate display while highlighting loads\nconst createRawTokens = (code: string): TokenizedCode => ({\n  bg: \"transparent\",\n  fg: \"inherit\",\n  tokens: code.split(\"\\n\").map((line) =>\n    line === \"\"\n      ? []\n      : [\n          {\n            color: \"inherit\",\n            content: line,\n          } as ThemedToken,\n        ]\n  ),\n});\n\n// Synchronous highlight with callback for async results\nexport const highlightCode = (\n  code: string,\n  language: BundledLanguage,\n  // oxlint-disable-next-line eslint-plugin-promise(prefer-await-to-callbacks)\n  callback?: (result: TokenizedCode) => void\n): TokenizedCode | null => {\n  const tokensCacheKey = getTokensCacheKey(code, language);\n\n  // Return cached result if available\n  const cached = tokensCache.get(tokensCacheKey);\n  if (cached) {\n    return cached;\n  }\n\n  // Subscribe callback if provided\n  if (callback) {\n    if (!subscribers.has(tokensCacheKey)) {\n      subscribers.set(tokensCacheKey, new Set());\n    }\n    subscribers.get(tokensCacheKey)?.add(callback);\n  }\n\n  // Start highlighting in background - fire-and-forget async pattern\n  getHighlighter(language)\n    // oxlint-disable-next-line eslint-plugin-promise(prefer-await-to-then)\n    .then((highlighter) => {\n      const availableLangs = highlighter.getLoadedLanguages();\n      const langToUse = availableLangs.includes(language) ? language : \"text\";\n\n      const result = highlighter.codeToTokens(code, {\n        lang: langToUse,\n        themes: {\n          dark: \"github-dark\",\n          light: \"github-light\",\n        },\n      });\n\n      const tokenized: TokenizedCode = {\n        bg: result.bg ?? \"transparent\",\n        fg: result.fg ?? \"inherit\",\n        tokens: result.tokens,\n      };\n\n      // Cache the result\n      tokensCache.set(tokensCacheKey, tokenized);\n\n      // Notify all subscribers\n      const subs = subscribers.get(tokensCacheKey);\n      if (subs) {\n        for (const sub of subs) {\n          sub(tokenized);\n        }\n        subscribers.delete(tokensCacheKey);\n      }\n    })\n    // oxlint-disable-next-line eslint-plugin-promise(prefer-await-to-then), eslint-plugin-promise(prefer-await-to-callbacks)\n    .catch((error) => {\n      console.error(\"Failed to highlight code:\", error);\n      subscribers.delete(tokensCacheKey);\n    });\n\n  return null;\n};\n\nconst CodeBlockBody = memo(\n  ({\n    tokenized,\n    showLineNumbers,\n    className,\n  }: {\n    tokenized: TokenizedCode;\n    showLineNumbers: boolean;\n    className?: string;\n  }) => {\n    const preStyle = useMemo(\n      () => ({\n        backgroundColor: tokenized.bg,\n        color: tokenized.fg,\n      }),\n      [tokenized.bg, tokenized.fg]\n    );\n\n    const keyedLines = useMemo(\n      () => addKeysToTokens(tokenized.tokens),\n      [tokenized.tokens]\n    );\n\n    return (\n      <pre\n        className={cn(\n          \"dark:!bg-[var(--shiki-dark-bg)] dark:!text-[var(--shiki-dark)] m-0 p-4 text-sm\",\n          className\n        )}\n        style={preStyle}\n      >\n        <code\n          className={cn(\n            \"font-mono text-sm\",\n            showLineNumbers && \"[counter-increment:line_0] [counter-reset:line]\"\n          )}\n        >\n          {keyedLines.map((keyedLine) => (\n            <LineSpan\n              key={keyedLine.key}\n              keyedLine={keyedLine}\n              showLineNumbers={showLineNumbers}\n            />\n          ))}\n        </code>\n      </pre>\n    );\n  },\n  (prevProps, nextProps) =>\n    prevProps.tokenized === nextProps.tokenized &&\n    prevProps.showLineNumbers === nextProps.showLineNumbers &&\n    prevProps.className === nextProps.className\n);\n\nCodeBlockBody.displayName = \"CodeBlockBody\";\n\nexport const CodeBlockContainer = ({\n  className,\n  language,\n  style,\n  ...props\n}: HTMLAttributes<HTMLDivElement> & { language: string }) => (\n  <div\n    className={cn(\n      \"group relative w-full overflow-hidden rounded-md border bg-background text-foreground\",\n      className\n    )}\n    data-language={language}\n    style={{\n      containIntrinsicSize: \"auto 200px\",\n      contentVisibility: \"auto\",\n      ...style,\n    }}\n    {...props}\n  />\n);\n\nexport const CodeBlockHeader = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex items-center justify-between border-b bg-muted/80 px-3 py-2 text-muted-foreground text-xs\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport const CodeBlockTitle = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn(\"flex items-center gap-2\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport const CodeBlockFilename = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLSpanElement>) => (\n  <span className={cn(\"font-mono\", className)} {...props}>\n    {children}\n  </span>\n);\n\nexport const CodeBlockActions = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\"-my-1 -mr-1 flex items-center gap-2\", className)}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport const CodeBlockContent = ({\n  code,\n  language,\n  showLineNumbers = false,\n}: {\n  code: string;\n  language: BundledLanguage;\n  showLineNumbers?: boolean;\n}) => {\n  // Memoized raw tokens for immediate display\n  const rawTokens = useMemo(() => createRawTokens(code), [code]);\n\n  // Synchronous cache lookup — avoids setState in effect for cached results\n  const syncTokens = useMemo(\n    () => highlightCode(code, language) ?? rawTokens,\n    [code, language, rawTokens]\n  );\n\n  // Async highlighting result (populated after shiki loads)\n  const [asyncTokens, setAsyncTokens] = useState<TokenizedCode | null>(null);\n  const asyncKeyRef = useRef({ code, language });\n\n  // Invalidate stale async tokens synchronously during render\n  if (\n    asyncKeyRef.current.code !== code ||\n    asyncKeyRef.current.language !== language\n  ) {\n    asyncKeyRef.current = { code, language };\n    setAsyncTokens(null);\n  }\n\n  useEffect(() => {\n    let cancelled = false;\n\n    highlightCode(code, language, (result) => {\n      if (!cancelled) {\n        setAsyncTokens(result);\n      }\n    });\n\n    return () => {\n      cancelled = true;\n    };\n  }, [code, language]);\n\n  const tokenized = asyncTokens ?? syncTokens;\n\n  return (\n    <div className=\"relative overflow-auto\">\n      <CodeBlockBody showLineNumbers={showLineNumbers} tokenized={tokenized} />\n    </div>\n  );\n};\n\nexport const CodeBlock = ({\n  code,\n  language,\n  showLineNumbers = false,\n  className,\n  children,\n  ...props\n}: CodeBlockProps) => {\n  const contextValue = useMemo(() => ({ code }), [code]);\n\n  return (\n    <CodeBlockContext.Provider value={contextValue}>\n      <CodeBlockContainer className={className} language={language} {...props}>\n        {children}\n        <CodeBlockContent\n          code={code}\n          language={language}\n          showLineNumbers={showLineNumbers}\n        />\n      </CodeBlockContainer>\n    </CodeBlockContext.Provider>\n  );\n};\n\nexport type CodeBlockCopyButtonProps = ComponentProps<typeof Button> & {\n  onCopy?: () => void;\n  onError?: (error: Error) => void;\n  timeout?: number;\n};\n\nexport const CodeBlockCopyButton = ({\n  onCopy,\n  onError,\n  timeout = 2000,\n  children,\n  className,\n  ...props\n}: CodeBlockCopyButtonProps) => {\n  const [isCopied, setIsCopied] = useState(false);\n  const timeoutRef = useRef<number>(0);\n  const { code } = useContext(CodeBlockContext);\n\n  const copyToClipboard = useCallback(async () => {\n    if (typeof window === \"undefined\" || !navigator?.clipboard?.writeText) {\n      onError?.(new Error(\"Clipboard API not available\"));\n      return;\n    }\n\n    try {\n      if (!isCopied) {\n        await navigator.clipboard.writeText(code);\n        setIsCopied(true);\n        onCopy?.();\n        timeoutRef.current = window.setTimeout(\n          () => setIsCopied(false),\n          timeout\n        );\n      }\n    } catch (error) {\n      onError?.(error as Error);\n    }\n  }, [code, onCopy, onError, timeout, isCopied]);\n\n  useEffect(\n    () => () => {\n      window.clearTimeout(timeoutRef.current);\n    },\n    []\n  );\n\n  const Icon = isCopied ? CheckIcon : CopyIcon;\n\n  return (\n    <Button\n      className={cn(\"shrink-0\", className)}\n      onClick={copyToClipboard}\n      size=\"icon\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <Icon size={14} />}\n    </Button>\n  );\n};\n\nexport type CodeBlockLanguageSelectorProps = ComponentProps<typeof Select>;\n\nexport const CodeBlockLanguageSelector = (\n  props: CodeBlockLanguageSelectorProps\n) => <Select {...props} />;\n\nexport type CodeBlockLanguageSelectorTriggerProps = ComponentProps<\n  typeof SelectTrigger\n>;\n\nexport const CodeBlockLanguageSelectorTrigger = ({\n  className,\n  ...props\n}: CodeBlockLanguageSelectorTriggerProps) => (\n  <SelectTrigger\n    className={cn(\n      \"h-7 border-none bg-transparent px-2 text-xs shadow-none\",\n      className\n    )}\n    size=\"sm\"\n    {...props}\n  />\n);\n\nexport type CodeBlockLanguageSelectorValueProps = ComponentProps<\n  typeof SelectValue\n>;\n\nexport const CodeBlockLanguageSelectorValue = (\n  props: CodeBlockLanguageSelectorValueProps\n) => <SelectValue {...props} />;\n\nexport type CodeBlockLanguageSelectorContentProps = ComponentProps<\n  typeof SelectContent\n>;\n\nexport const CodeBlockLanguageSelectorContent = ({\n  align = \"end\",\n  ...props\n}: CodeBlockLanguageSelectorContentProps) => (\n  <SelectContent align={align} {...props} />\n);\n\nexport type CodeBlockLanguageSelectorItemProps = ComponentProps<\n  typeof SelectItem\n>;\n\nexport const CodeBlockLanguageSelectorItem = (\n  props: CodeBlockLanguageSelectorItemProps\n) => <SelectItem {...props} />;\n"],"names":["isItalic","fontStyle","isBold","isUnderline","addKeysToTokens","lines","line","lineIdx","token","tokenIdx","TokenSpan","jsx","LINE_NUMBER_CLASSES","cn","LineSpan","keyedLine","showLineNumbers","key","CodeBlockContext","createContext","highlighterCache","tokensCache","subscribers","CACHE_KEY_SLICE_LENGTH","getTokensCacheKey","code","language","start","end","getHighlighter","cached","highlighterPromise","createHighlighter","createRawTokens","highlightCode","callback","tokensCacheKey","highlighter","langToUse","result","tokenized","subs","sub","error","CodeBlockBody","memo","className","preStyle","useMemo","keyedLines","prevProps","nextProps","CodeBlockContainer","style","props","CodeBlockHeader","children","CodeBlockTitle","CodeBlockFilename","CodeBlockActions","CodeBlockContent","rawTokens","syncTokens","asyncTokens","setAsyncTokens","useState","asyncKeyRef","useRef","useEffect","cancelled","CodeBlock","contextValue","jsxs","CodeBlockCopyButton","onCopy","onError","timeout","isCopied","setIsCopied","timeoutRef","useContext","copyToClipboard","useCallback","Icon","CheckIcon","CopyIcon","Button","CodeBlockLanguageSelector","Select","CodeBlockLanguageSelectorTrigger","SelectTrigger","CodeBlockLanguageSelectorValue","SelectValue","CodeBlockLanguageSelectorContent","align","SelectContent","CodeBlockLanguageSelectorItem","SelectItem"],"mappings":"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"}
+{"version":3,"file":"code-block.cjs","sources":["../../../src/components/ui/code-block.tsx"],"sourcesContent":["import { CheckIcon, CopyIcon } from \"lucide-react\";\nimport {\n  createContext,\n  memo,\n  useCallback,\n  useContext,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport type { ComponentProps, CSSProperties, HTMLAttributes } from \"react\";\nimport type { BundledLanguage, ThemedToken } from \"shiki\";\n\nimport { Button } from \"@/components/ui/button\";\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@/components/ui/select\";\nimport { getCodeBlockHighlighter } from \"@/lib/shiki\";\nimport { cn } from \"@/lib/utils\";\n\n\n\n\n// Shiki uses bitflags for font styles: 1=italic, 2=bold, 4=underline\n// oxlint-disable-next-line eslint(no-bitwise)\nconst isItalic = (fontStyle: number | undefined) => fontStyle && fontStyle & 1;\n// oxlint-disable-next-line eslint(no-bitwise)\nconst isBold = (fontStyle: number | undefined) => fontStyle && fontStyle & 2;\nconst isUnderline = (fontStyle: number | undefined) =>\n  // oxlint-disable-next-line eslint(no-bitwise)\n  fontStyle && fontStyle & 4;\n\n// Transform tokens to include pre-computed keys to avoid noArrayIndexKey lint\ninterface KeyedToken {\n  token: ThemedToken;\n  key: string;\n}\ninterface KeyedLine {\n  tokens: KeyedToken[];\n  key: string;\n}\n\nconst addKeysToTokens = (lines: ThemedToken[][]): KeyedLine[] =>\n  lines.map((line, lineIdx) => ({\n    key: `line-${lineIdx}`,\n    tokens: line.map((token, tokenIdx) => ({\n      key: `line-${lineIdx}-${tokenIdx}`,\n      token,\n    })),\n  }));\n\n// Token rendering component\nconst TokenSpan = ({ token }: { token: ThemedToken }) => (\n  <span\n    className=\"dark:!bg-[var(--shiki-dark-bg)] dark:!text-[var(--shiki-dark)]\"\n    style={\n      {\n        backgroundColor: token.bgColor,\n        color: token.color,\n        fontStyle: isItalic(token.fontStyle) ? \"italic\" : undefined,\n        fontWeight: isBold(token.fontStyle) ? \"bold\" : undefined,\n        textDecoration: isUnderline(token.fontStyle) ? \"underline\" : undefined,\n        ...token.htmlStyle,\n      } as CSSProperties\n    }\n  >\n    {token.content}\n  </span>\n);\n\n// Line number styles using CSS counters\nconst LINE_NUMBER_CLASSES = cn(\n  \"block\",\n  \"before:content-[counter(line)]\",\n  \"before:inline-block\",\n  \"before:[counter-increment:line]\",\n  \"before:w-8\",\n  \"before:mr-4\",\n  \"before:text-right\",\n  \"before:text-muted-foreground/50\",\n  \"before:font-mono\",\n  \"before:select-none\"\n);\n\n// Line rendering component\nconst LineSpan = ({\n  keyedLine,\n  showLineNumbers,\n}: {\n  keyedLine: KeyedLine;\n  showLineNumbers: boolean;\n}) => (\n  <span className={showLineNumbers ? LINE_NUMBER_CLASSES : \"block\"}>\n    {keyedLine.tokens.length === 0\n      ? \"\\n\"\n      : keyedLine.tokens.map(({ token, key }) => (\n          <TokenSpan key={key} token={token} />\n        ))}\n  </span>\n);\n\n// Types\ntype CodeBlockProps = HTMLAttributes<HTMLDivElement> & {\n  code: string;\n  language: BundledLanguage;\n  showLineNumbers?: boolean;\n};\n\ninterface TokenizedCode {\n  tokens: ThemedToken[][];\n  fg: string;\n  bg: string;\n}\n\ninterface CodeBlockContextType {\n  code: string;\n}\n\n// Context\nconst CodeBlockContext = createContext<CodeBlockContextType>({\n  code: \"\",\n});\n\n// Maps every github-light/github-dark token color onto a --shiki-* CSS\n// variable backed by the design-token palette (defined in index.tailwind.css\n// for :root and .dark), so code colors follow the active theme and meet\n// WCAG AA contrast on --shiki-bg in both modes.\nconst SHIKI_COLOR_REPLACEMENTS: Record<string, Record<string, string>> = {\n  \"github-light\": {\n    \"#24292e\": \"var(--shiki-fg)\",\n    \"#6a737d\": \"var(--shiki-comment)\",\n    \"#586069\": \"var(--shiki-comment)\",\n    \"#d73a49\": \"var(--shiki-keyword)\",\n    \"#b31d28\": \"var(--shiki-keyword)\",\n    \"#005cc5\": \"var(--shiki-constant)\",\n    \"#6f42c1\": \"var(--shiki-entity)\",\n    \"#22863a\": \"var(--shiki-tag)\",\n    \"#032f62\": \"var(--shiki-string)\",\n    \"#e36209\": \"var(--shiki-variable)\",\n  },\n  \"github-dark\": {\n    \"#e1e4e8\": \"var(--shiki-fg)\",\n    \"#6a737d\": \"var(--shiki-comment)\",\n    \"#d1d5da\": \"var(--shiki-comment)\",\n    \"#f97583\": \"var(--shiki-keyword)\",\n    \"#fdaeb7\": \"var(--shiki-keyword)\",\n    \"#79b8ff\": \"var(--shiki-constant)\",\n    \"#b392f0\": \"var(--shiki-entity)\",\n    \"#85e89d\": \"var(--shiki-tag)\",\n    \"#9ecbff\": \"var(--shiki-string)\",\n    \"#dbedff\": \"var(--shiki-string)\",\n    \"#ffab70\": \"var(--shiki-variable)\",\n  },\n};\n\n// Token cache\nconst tokensCache = new Map<string, TokenizedCode>();\n\n// Subscribers for async token updates\nconst subscribers = new Map<string, Set<(result: TokenizedCode) => void>>();\n\nconst CACHE_KEY_SLICE_LENGTH = 100;\n\nconst getTokensCacheKey = (code: string, language: BundledLanguage) => {\n  const start = code.slice(0, CACHE_KEY_SLICE_LENGTH);\n  const end = code.length > CACHE_KEY_SLICE_LENGTH ? code.slice(-CACHE_KEY_SLICE_LENGTH) : \"\";\n  return `${language}:${code.length}:${start}:${end}`;\n};\n\n// Create raw tokens for immediate display while highlighting loads\nconst createRawTokens = (code: string): TokenizedCode => ({\n  bg: \"transparent\",\n  fg: \"inherit\",\n  tokens: code.split(\"\\n\").map((line) =>\n    line === \"\"\n      ? []\n      : [\n          {\n            color: \"inherit\",\n            content: line,\n          } as ThemedToken,\n        ]\n  ),\n});\n\n// Synchronous highlight with callback for async results\nexport const highlightCode = (\n  code: string,\n  language: BundledLanguage,\n  // oxlint-disable-next-line eslint-plugin-promise(prefer-await-to-callbacks)\n  callback?: (result: TokenizedCode) => void\n): TokenizedCode | null => {\n  const tokensCacheKey = getTokensCacheKey(code, language);\n\n  // Return cached result if available\n  const cached = tokensCache.get(tokensCacheKey);\n  if (cached) {\n    return cached;\n  }\n\n  // Subscribe callback if provided\n  if (callback) {\n    if (!subscribers.has(tokensCacheKey)) {\n      subscribers.set(tokensCacheKey, new Set());\n    }\n    subscribers.get(tokensCacheKey)?.add(callback);\n  }\n\n  // Start highlighting in background - fire-and-forget async pattern.\n  // The shared slim highlighter (SW-2007) loads shiki/core, the grammar, and\n  // the themes through dynamic imports; unsupported languages fall back to\n  // plaintext via the resolved `lang`.\n  getCodeBlockHighlighter(language)\n    // oxlint-disable-next-line eslint-plugin-promise(prefer-await-to-then)\n    .then(({ highlighter, lang }) => {\n      const result = highlighter.codeToTokens(code, {\n        colorReplacements: SHIKI_COLOR_REPLACEMENTS,\n        lang,\n        themes: {\n          dark: \"github-dark\",\n          light: \"github-light\",\n        },\n      });\n\n      const tokenized: TokenizedCode = {\n        bg: result.bg ?? \"transparent\",\n        fg: result.fg ?? \"inherit\",\n        tokens: result.tokens,\n      };\n\n      // Cache the result\n      tokensCache.set(tokensCacheKey, tokenized);\n\n      // Notify all subscribers\n      const subs = subscribers.get(tokensCacheKey);\n      if (subs) {\n        for (const sub of subs) {\n          sub(tokenized);\n        }\n        subscribers.delete(tokensCacheKey);\n      }\n    })\n    // oxlint-disable-next-line eslint-plugin-promise(prefer-await-to-then), eslint-plugin-promise(prefer-await-to-callbacks)\n    .catch((error) => {\n      console.error(\"Failed to highlight code:\", error);\n      subscribers.delete(tokensCacheKey);\n    });\n\n  return null;\n};\n\nconst CodeBlockBody = memo(\n  ({\n    tokenized,\n    showLineNumbers,\n    className,\n  }: {\n    tokenized: TokenizedCode;\n    showLineNumbers: boolean;\n    className?: string;\n  }) => {\n    const keyedLines = useMemo(\n      () => addKeysToTokens(tokenized.tokens),\n      [tokenized.tokens]\n    );\n\n    return (\n      <pre\n        className={cn(\n          // Shiki's dual-theme codeToTokens() returns \"transparent\"/\"inherit\"\n          // for the top-level bg/fg in multi-theme mode — the real per-theme\n          // colors only exist per-token (read via CSS vars in TokenSpan).\n          // --shiki-bg/--shiki-fg re-resolve under .dark, so no dark: variant\n          // is needed here.\n          \"!bg-[var(--shiki-bg)] !text-[var(--shiki-fg)] m-0 p-4 text-sm\",\n          className\n        )}\n      >\n        <code\n          className={cn(\n            \"font-mono text-sm\",\n            showLineNumbers && \"[counter-increment:line_0] [counter-reset:line]\"\n          )}\n        >\n          {keyedLines.map((keyedLine) => (\n            <LineSpan\n              key={keyedLine.key}\n              keyedLine={keyedLine}\n              showLineNumbers={showLineNumbers}\n            />\n          ))}\n        </code>\n      </pre>\n    );\n  },\n  (prevProps, nextProps) =>\n    prevProps.tokenized === nextProps.tokenized &&\n    prevProps.showLineNumbers === nextProps.showLineNumbers &&\n    prevProps.className === nextProps.className\n);\n\nCodeBlockBody.displayName = \"CodeBlockBody\";\n\nexport const CodeBlockContainer = ({\n  className,\n  language,\n  style,\n  ...props\n}: HTMLAttributes<HTMLDivElement> & { language: string }) => (\n  <div\n    className={cn(\n      \"group relative w-full overflow-hidden rounded-md border bg-background text-foreground\",\n      className\n    )}\n    data-language={language}\n    style={{\n      containIntrinsicSize: \"auto 200px\",\n      contentVisibility: \"auto\",\n      ...style,\n    }}\n    {...props}\n  />\n);\n\nexport const CodeBlockHeader = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"flex items-center justify-between border-b bg-muted/80 px-3 py-2 text-muted-foreground text-xs\",\n      className\n    )}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport const CodeBlockTitle = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLDivElement>) => (\n  <div className={cn(\"flex items-center gap-2\", className)} {...props}>\n    {children}\n  </div>\n);\n\nexport const CodeBlockFilename = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLSpanElement>) => (\n  <span className={cn(\"font-mono\", className)} {...props}>\n    {children}\n  </span>\n);\n\nexport const CodeBlockActions = ({\n  children,\n  className,\n  ...props\n}: HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\"-my-1 -mr-1 flex items-center gap-2\", className)}\n    {...props}\n  >\n    {children}\n  </div>\n);\n\nexport const CodeBlockContent = ({\n  code,\n  language,\n  showLineNumbers = false,\n}: {\n  code: string;\n  language: BundledLanguage;\n  showLineNumbers?: boolean;\n}) => {\n  // Memoized raw tokens for immediate display\n  const rawTokens = useMemo(() => createRawTokens(code), [code]);\n\n  // Synchronous cache lookup — avoids setState in effect for cached results\n  const syncTokens = useMemo(\n    () => highlightCode(code, language) ?? rawTokens,\n    [code, language, rawTokens]\n  );\n\n  // Async highlighting result (populated after shiki loads)\n  const [asyncTokens, setAsyncTokens] = useState<TokenizedCode | null>(null);\n  const asyncKeyRef = useRef({ code, language });\n\n  // Invalidate stale async tokens synchronously during render\n  if (\n    asyncKeyRef.current.code !== code ||\n    asyncKeyRef.current.language !== language\n  ) {\n    asyncKeyRef.current = { code, language };\n    setAsyncTokens(null);\n  }\n\n  useEffect(() => {\n    let cancelled = false;\n\n    highlightCode(code, language, (result) => {\n      if (!cancelled) {\n        setAsyncTokens(result);\n      }\n    });\n\n    return () => {\n      cancelled = true;\n    };\n  }, [code, language]);\n\n  const tokenized = asyncTokens ?? syncTokens;\n\n  return (\n    <div className=\"relative overflow-auto\" tabIndex={0}>\n      <CodeBlockBody showLineNumbers={showLineNumbers} tokenized={tokenized} />\n    </div>\n  );\n};\n\nexport const CodeBlock = ({\n  code,\n  language,\n  showLineNumbers = false,\n  className,\n  children,\n  ...props\n}: CodeBlockProps) => {\n  const contextValue = useMemo(() => ({ code }), [code]);\n\n  return (\n    <CodeBlockContext.Provider value={contextValue}>\n      <CodeBlockContainer className={className} language={language} {...props}>\n        {children}\n        <CodeBlockContent\n          code={code}\n          language={language}\n          showLineNumbers={showLineNumbers}\n        />\n      </CodeBlockContainer>\n    </CodeBlockContext.Provider>\n  );\n};\n\nexport type CodeBlockCopyButtonProps = ComponentProps<typeof Button> & {\n  onCopy?: () => void;\n  onError?: (error: Error) => void;\n  timeout?: number;\n};\n\nexport const CodeBlockCopyButton = ({\n  onCopy,\n  onError,\n  timeout = 2000,\n  children,\n  className,\n  ...props\n}: CodeBlockCopyButtonProps) => {\n  const [isCopied, setIsCopied] = useState(false);\n  const timeoutRef = useRef<number>(0);\n  const { code } = useContext(CodeBlockContext);\n\n  const copyToClipboard = useCallback(async () => {\n    if (typeof window === \"undefined\" || !navigator?.clipboard?.writeText) {\n      onError?.(new Error(\"Clipboard API not available\"));\n      return;\n    }\n\n    try {\n      if (!isCopied) {\n        await navigator.clipboard.writeText(code);\n        setIsCopied(true);\n        onCopy?.();\n        timeoutRef.current = window.setTimeout(\n          () => setIsCopied(false),\n          timeout\n        );\n      }\n    } catch (error) {\n      onError?.(error as Error);\n    }\n  }, [code, onCopy, onError, timeout, isCopied]);\n\n  useEffect(\n    () => () => {\n      window.clearTimeout(timeoutRef.current);\n    },\n    []\n  );\n\n  const Icon = isCopied ? CheckIcon : CopyIcon;\n\n  return (\n    <Button\n      aria-label=\"Copy code\"\n      className={cn(\"shrink-0\", className)}\n      onClick={copyToClipboard}\n      size=\"icon\"\n      variant=\"ghost\"\n      {...props}\n    >\n      {children ?? <Icon size={14} />}\n    </Button>\n  );\n};\n\nexport type CodeBlockLanguageSelectorProps = ComponentProps<typeof Select>;\n\nexport const CodeBlockLanguageSelector = (\n  props: CodeBlockLanguageSelectorProps\n) => <Select {...props} />;\n\nexport type CodeBlockLanguageSelectorTriggerProps = ComponentProps<\n  typeof SelectTrigger\n>;\n\nexport const CodeBlockLanguageSelectorTrigger = ({\n  className,\n  ...props\n}: CodeBlockLanguageSelectorTriggerProps) => (\n  <SelectTrigger\n    aria-label=\"Select language\"\n    className={cn(\n      \"h-7 border-none bg-transparent px-2 text-xs shadow-none\",\n      className\n    )}\n    size=\"sm\"\n    {...props}\n  />\n);\n\nexport type CodeBlockLanguageSelectorValueProps = ComponentProps<\n  typeof SelectValue\n>;\n\nexport const CodeBlockLanguageSelectorValue = (\n  props: CodeBlockLanguageSelectorValueProps\n) => <SelectValue {...props} />;\n\nexport type CodeBlockLanguageSelectorContentProps = ComponentProps<\n  typeof SelectContent\n>;\n\nexport const CodeBlockLanguageSelectorContent = ({\n  align = \"end\",\n  ...props\n}: CodeBlockLanguageSelectorContentProps) => (\n  <SelectContent align={align} {...props} />\n);\n\nexport type CodeBlockLanguageSelectorItemProps = ComponentProps<\n  typeof SelectItem\n>;\n\nexport const CodeBlockLanguageSelectorItem = (\n  props: CodeBlockLanguageSelectorItemProps\n) => <SelectItem {...props} />;\n"],"names":["isItalic","fontStyle","isBold","isUnderline","addKeysToTokens","lines","line","lineIdx","token","tokenIdx","TokenSpan","jsx","LINE_NUMBER_CLASSES","cn","LineSpan","keyedLine","showLineNumbers","key","CodeBlockContext","createContext","SHIKI_COLOR_REPLACEMENTS","tokensCache","subscribers","CACHE_KEY_SLICE_LENGTH","getTokensCacheKey","code","language","start","end","createRawTokens","highlightCode","callback","tokensCacheKey","cached","getCodeBlockHighlighter","highlighter","lang","result","tokenized","subs","sub","error","CodeBlockBody","memo","className","keyedLines","useMemo","prevProps","nextProps","CodeBlockContainer","style","props","CodeBlockHeader","children","CodeBlockTitle","CodeBlockFilename","CodeBlockActions","CodeBlockContent","rawTokens","syncTokens","asyncTokens","setAsyncTokens","useState","asyncKeyRef","useRef","useEffect","cancelled","CodeBlock","contextValue","jsxs","CodeBlockCopyButton","onCopy","onError","timeout","isCopied","setIsCopied","timeoutRef","useContext","copyToClipboard","useCallback","Icon","CheckIcon","CopyIcon","Button","CodeBlockLanguageSelector","Select","CodeBlockLanguageSelectorTrigger","SelectTrigger","CodeBlockLanguageSelectorValue","SelectValue","CodeBlockLanguageSelectorContent","align","SelectContent","CodeBlockLanguageSelectorItem","SelectItem"],"mappings":"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"}

package/dist/components/ui/code-block.js

@@ -1,34 +1,34 @@
-import { jsx as s, jsxs as T } from "react/jsx-runtime";
-import { CheckIcon as N, CopyIcon as L } from "lucide-react";
-import { createContext as I, memo as E, useMemo as h, useState as y, useRef as x, useEffect as w, useContext as $, useCallback as _ } from "react";
-import { createHighlighter as A } from "shiki";
-import { Button as H } from "./button.js";
-import { Select as K, SelectContent as M, SelectItem as R, SelectTrigger as z, SelectValue as V } from "./select.js";
-import { cn as i } from "../../lib/utils.js";
-const j = (e) => e && e & 1, U = (e) => e && e & 2, F = (e) => (
+import { jsx as s, jsxs as B } from "react/jsx-runtime";
+import { CheckIcon as T, CopyIcon as N } from "lucide-react";
+import { createContext as I, memo as L, useMemo as f, useState as C, useRef as v, useEffect as p, useContext as E, useCallback as z } from "react";
+import { Button as R } from "./button.js";
+import { Select as _, SelectContent as $, SelectItem as A, SelectTrigger as K, SelectValue as H } from "./select.js";
+import { getCodeBlockHighlighter as M } from "../../lib/shiki.js";
+import { cn as a } from "../../lib/utils.js";
+const V = (e) => e && e & 1, j = (e) => e && e & 2, F = (e) => (
   // oxlint-disable-next-line eslint(no-bitwise)
   e && e & 4
-), D = (e) => e.map((t, o) => ({
+), O = (e) => e.map((t, o) => ({
   key: `line-${o}`,
-  tokens: t.map((n, c) => ({
-    key: `line-${o}-${c}`,
+  tokens: t.map((n, r) => ({
+    key: `line-${o}-${r}`,
     token: n
   }))
-})), G = ({ token: e }) => /* @__PURE__ */ s(
+})), U = ({ token: e }) => /* @__PURE__ */ s(
   "span",
   {
     className: "dark:!bg-[var(--shiki-dark-bg)] dark:!text-[var(--shiki-dark)]",
     style: {
       backgroundColor: e.bgColor,
       color: e.color,
-      fontStyle: j(e.fontStyle) ? "italic" : void 0,
-      fontWeight: U(e.fontStyle) ? "bold" : void 0,
+      fontStyle: V(e.fontStyle) ? "italic" : void 0,
+      fontWeight: j(e.fontStyle) ? "bold" : void 0,
       textDecoration: F(e.fontStyle) ? "underline" : void 0,
       ...e.htmlStyle
     },
     children: e.content
   }
-), W = i(
+), D = a(
   "block",
   "before:content-[counter(line)]",
   "before:inline-block",
@@ -39,25 +39,42 @@ const j = (e) => e && e & 1, U = (e) => e && e & 2, F = (e) => (
   "before:text-muted-foreground/50",
   "before:font-mono",
   "before:select-none"
-), Y = ({
+), G = ({
   keyedLine: e,
   showLineNumbers: t
-}) => /* @__PURE__ */ s("span", { className: t ? W : "block", children: e.tokens.length === 0 ? `
-` : e.tokens.map(({ token: o, key: n }) => /* @__PURE__ */ s(G, { token: o }, n)) }), v = I({
+}) => /* @__PURE__ */ s("span", { className: t ? D : "block", children: e.tokens.length === 0 ? `
+` : e.tokens.map(({ token: o, key: n }) => /* @__PURE__ */ s(U, { token: o }, n)) }), y = I({
   code: ""
-}), b = /* @__PURE__ */ new Map(), C = /* @__PURE__ */ new Map(), g = /* @__PURE__ */ new Map(), k = 100, q = (e, t) => {
-  const o = e.slice(0, k), n = e.length > k ? e.slice(-k) : "";
+}), W = {
+  "github-light": {
+    "#24292e": "var(--shiki-fg)",
+    "#6a737d": "var(--shiki-comment)",
+    "#586069": "var(--shiki-comment)",
+    "#d73a49": "var(--shiki-keyword)",
+    "#b31d28": "var(--shiki-keyword)",
+    "#005cc5": "var(--shiki-constant)",
+    "#6f42c1": "var(--shiki-entity)",
+    "#22863a": "var(--shiki-tag)",
+    "#032f62": "var(--shiki-string)",
+    "#e36209": "var(--shiki-variable)"
+  },
+  "github-dark": {
+    "#e1e4e8": "var(--shiki-fg)",
+    "#6a737d": "var(--shiki-comment)",
+    "#d1d5da": "var(--shiki-comment)",
+    "#f97583": "var(--shiki-keyword)",
+    "#fdaeb7": "var(--shiki-keyword)",
+    "#79b8ff": "var(--shiki-constant)",
+    "#b392f0": "var(--shiki-entity)",
+    "#85e89d": "var(--shiki-tag)",
+    "#9ecbff": "var(--shiki-string)",
+    "#dbedff": "var(--shiki-string)",
+    "#ffab70": "var(--shiki-variable)"
+  }
+}, g = /* @__PURE__ */ new Map(), h = /* @__PURE__ */ new Map(), u = 100, Y = (e, t) => {
+  const o = e.slice(0, u), n = e.length > u ? e.slice(-u) : "";
   return `${t}:${e.length}:${o}:${n}`;
-}, J = (e) => {
-  const t = b.get(e);
-  if (t)
-    return t;
-  const o = A({
-    langs: [e],
-    themes: ["github-light", "github-dark"]
-  });
-  return b.set(e, o), o;
-}, O = (e) => ({
+}, q = (e) => ({
   bg: "transparent",
   fg: "inherit",
   tokens: e.split(`
@@ -69,63 +86,62 @@ const j = (e) => e && e & 1, U = (e) => e && e & 2, F = (e) => (
       }
     ]
   )
-}), p = (e, t, o) => {
-  const n = q(e, t), c = C.get(n);
-  return c || (o && (g.has(n) || g.set(n, /* @__PURE__ */ new Set()), g.get(n)?.add(o)), J(t).then((r) => {
-    const l = r.getLoadedLanguages().includes(t) ? t : "text", m = r.codeToTokens(e, {
-      lang: l,
+}), b = (e, t, o) => {
+  const n = Y(e, t), r = g.get(n);
+  return r || (o && (h.has(n) || h.set(n, /* @__PURE__ */ new Set()), h.get(n)?.add(o)), M(t).then(({ highlighter: l, lang: i }) => {
+    const c = l.codeToTokens(e, {
+      colorReplacements: W,
+      lang: i,
       themes: {
         dark: "github-dark",
         light: "github-light"
       }
-    }), d = {
-      bg: m.bg ?? "transparent",
-      fg: m.fg ?? "inherit",
-      tokens: m.tokens
+    }), k = {
+      bg: c.bg ?? "transparent",
+      fg: c.fg ?? "inherit",
+      tokens: c.tokens
     };
-    C.set(n, d);
-    const u = g.get(n);
-    if (u) {
-      for (const f of u)
-        f(d);
-      g.delete(n);
+    g.set(n, k);
+    const d = h.get(n);
+    if (d) {
+      for (const m of d)
+        m(k);
+      h.delete(n);
     }
-  }).catch((r) => {
-    console.error("Failed to highlight code:", r), g.delete(n);
+  }).catch((l) => {
+    console.error("Failed to highlight code:", l), h.delete(n);
   }), null);
-}, B = E(
+}, w = L(
   ({
     tokenized: e,
     showLineNumbers: t,
     className: o
   }) => {
-    const n = h(
-      () => ({
-        backgroundColor: e.bg,
-        color: e.fg
-      }),
-      [e.bg, e.fg]
-    ), c = h(
-      () => D(e.tokens),
+    const n = f(
+      () => O(e.tokens),
       [e.tokens]
     );
     return /* @__PURE__ */ s(
       "pre",
       {
-        className: i(
-          "dark:!bg-[var(--shiki-dark-bg)] dark:!text-[var(--shiki-dark)] m-0 p-4 text-sm",
+        className: a(
+          // Shiki's dual-theme codeToTokens() returns "transparent"/"inherit"
+          // for the top-level bg/fg in multi-theme mode — the real per-theme
+          // colors only exist per-token (read via CSS vars in TokenSpan).
+          // --shiki-bg/--shiki-fg re-resolve under .dark, so no dark: variant
+          // is needed here.
+          "!bg-[var(--shiki-bg)] !text-[var(--shiki-fg)] m-0 p-4 text-sm",
           o
         ),
-        style: n,
         children: /* @__PURE__ */ s(
           "code",
           {
-            className: i(
+            className: a(
               "font-mono text-sm",
               t && "[counter-increment:line_0] [counter-reset:line]"
             ),
-            children: c.map((r) => /* @__PURE__ */ s(
-              Y,
+            children: n.map((r) => /* @__PURE__ */ s(
+              G,
               {
                 keyedLine: r,
                 showLineNumbers: t
@@ -139,8 +155,8 @@ const j = (e) => e && e & 1, U = (e) => e && e & 2, F = (e) => (
   },
   (e, t) => e.tokenized === t.tokenized && e.showLineNumbers === t.showLineNumbers && e.className === t.className
 );
-B.displayName = "CodeBlockBody";
-const Q = ({
+w.displayName = "CodeBlockBody";
+const J = ({
   className: e,
   language: t,
   style: o,
@@ -148,7 +164,7 @@ const Q = ({
 }) => /* @__PURE__ */ s(
   "div",
   {
-    className: i(
+    className: a(
       "group relative w-full overflow-hidden rounded-md border bg-background text-foreground",
       e
     ),
@@ -160,69 +176,69 @@ const Q = ({
     },
     ...n
   }
-), re = ({
+), se = ({
   children: e,
   className: t,
   ...o
 }) => /* @__PURE__ */ s(
   "div",
   {
-    className: i(
+    className: a(
       "flex items-center justify-between border-b bg-muted/80 px-3 py-2 text-muted-foreground text-xs",
       t
     ),
     ...o,
     children: e
   }
-), ce = ({
+), re = ({
   children: e,
   className: t,
   ...o
-}) => /* @__PURE__ */ s("div", { className: i("flex items-center gap-2", t), ...o, children: e }), ie = ({
+}) => /* @__PURE__ */ s("div", { className: a("flex items-center gap-2", t), ...o, children: e }), ie = ({
   children: e,
   className: t,
   ...o
-}) => /* @__PURE__ */ s("span", { className: i("font-mono", t), ...o, children: e }), ae = ({
+}) => /* @__PURE__ */ s("span", { className: a("font-mono", t), ...o, children: e }), ce = ({
   children: e,
   className: t,
   ...o
 }) => /* @__PURE__ */ s(
   "div",
   {
-    className: i("-my-1 -mr-1 flex items-center gap-2", t),
+    className: a("-my-1 -mr-1 flex items-center gap-2", t),
     ...o,
     children: e
   }
-), X = ({
+), Q = ({
   code: e,
   language: t,
   showLineNumbers: o = !1
 }) => {
-  const n = h(() => O(e), [e]), c = h(
-    () => p(e, t) ?? n,
+  const n = f(() => q(e), [e]), r = f(
+    () => b(e, t) ?? n,
     [e, t, n]
-  ), [r, a] = y(null), l = x({ code: e, language: t });
-  return (l.current.code !== e || l.current.language !== t) && (l.current = { code: e, language: t }, a(null)), w(() => {
+  ), [l, i] = C(null), c = v({ code: e, language: t });
+  return (c.current.code !== e || c.current.language !== t) && (c.current = { code: e, language: t }, i(null)), p(() => {
     let d = !1;
-    return p(e, t, (u) => {
-      d || a(u);
+    return b(e, t, (m) => {
+      d || i(m);
     }), () => {
       d = !0;
     };
-  }, [e, t]), /* @__PURE__ */ s("div", { className: "relative overflow-auto", children: /* @__PURE__ */ s(B, { showLineNumbers: o, tokenized: r ?? c }) });
-}, le = ({
+  }, [e, t]), /* @__PURE__ */ s("div", { className: "relative overflow-auto", tabIndex: 0, children: /* @__PURE__ */ s(w, { showLineNumbers: o, tokenized: l ?? r }) });
+}, ae = ({
   code: e,
   language: t,
   showLineNumbers: o = !1,
   className: n,
-  children: c,
-  ...r
+  children: r,
+  ...l
 }) => {
-  const a = h(() => ({ code: e }), [e]);
-  return /* @__PURE__ */ s(v.Provider, { value: a, children: /* @__PURE__ */ T(Q, { className: n, language: t, ...r, children: [
-    c,
+  const i = f(() => ({ code: e }), [e]);
+  return /* @__PURE__ */ s(y.Provider, { value: i, children: /* @__PURE__ */ B(J, { className: n, language: t, ...l, children: [
+    r,
     /* @__PURE__ */ s(
-      X,
+      Q,
       {
         code: e,
         language: t,
@@ -230,77 +246,79 @@ const Q = ({
       }
     )
   ] }) });
-}, de = ({
+}, le = ({
   onCopy: e,
   onError: t,
   timeout: o = 2e3,
   children: n,
-  className: c,
-  ...r
+  className: r,
+  ...l
 }) => {
-  const [a, l] = y(!1), m = x(0), { code: d } = $(v), u = _(async () => {
+  const [i, c] = C(!1), k = v(0), { code: d } = E(y), m = z(async () => {
     if (typeof window > "u" || !navigator?.clipboard?.writeText) {
       t?.(new Error("Clipboard API not available"));
       return;
     }
     try {
-      a || (await navigator.clipboard.writeText(d), l(!0), e?.(), m.current = window.setTimeout(
-        () => l(!1),
+      i || (await navigator.clipboard.writeText(d), c(!0), e?.(), k.current = window.setTimeout(
+        () => c(!1),
         o
       ));
     } catch (S) {
       t?.(S);
     }
-  }, [d, e, t, o, a]);
-  w(
+  }, [d, e, t, o, i]);
+  p(
     () => () => {
-      window.clearTimeout(m.current);
+      window.clearTimeout(k.current);
     },
     []
   );
-  const f = a ? N : L;
+  const x = i ? T : N;
   return /* @__PURE__ */ s(
-    H,
+    R,
     {
-      className: i("shrink-0", c),
-      onClick: u,
+      "aria-label": "Copy code",
+      className: a("shrink-0", r),
+      onClick: m,
       size: "icon",
       variant: "ghost",
-      ...r,
-      children: n ?? /* @__PURE__ */ s(f, { size: 14 })
+      ...l,
+      children: n ?? /* @__PURE__ */ s(x, { size: 14 })
     }
   );
-}, me = (e) => /* @__PURE__ */ s(K, { ...e }), ue = ({
+}, de = (e) => /* @__PURE__ */ s(_, { ...e }), ke = ({
   className: e,
   ...t
 }) => /* @__PURE__ */ s(
-  z,
+  K,
   {
-    className: i(
+    "aria-label": "Select language",
+    className: a(
       "h-7 border-none bg-transparent px-2 text-xs shadow-none",
       e
     ),
     size: "sm",
     ...t
   }
-), ge = (e) => /* @__PURE__ */ s(V, { ...e }), he = ({
+), he = (e) => /* @__PURE__ */ s(H, { ...e }), me = ({
   align: e = "end",
   ...t
-}) => /* @__PURE__ */ s(M, { align: e, ...t }), fe = (e) => /* @__PURE__ */ s(R, { ...e });
+}) => /* @__PURE__ */ s($, { align: e, ...t }), fe = (e) => /* @__PURE__ */ s(A, { ...e });
 export {
-  le as CodeBlock,
-  ae as CodeBlockActions,
-  Q as CodeBlockContainer,
-  X as CodeBlockContent,
-  de as CodeBlockCopyButton,
+  ae as CodeBlock,
+  ce as CodeBlockActions,
+  J as CodeBlockContainer,
+  Q as CodeBlockContent,
+  le as CodeBlockCopyButton,
   ie as CodeBlockFilename,
-  re as CodeBlockHeader,
-  me as CodeBlockLanguageSelector,
-  he as CodeBlockLanguageSelectorContent,
+  se as CodeBlockHeader,
+  de as CodeBlockLanguageSelector,
+  me as CodeBlockLanguageSelectorContent,
   fe as CodeBlockLanguageSelectorItem,
-  ue as CodeBlockLanguageSelectorTrigger,
-  ge as CodeBlockLanguageSelectorValue,
-  ce as CodeBlockTitle,
-  p as highlightCode
+  ke as CodeBlockLanguageSelectorTrigger,
+  he as CodeBlockLanguageSelectorValue,
+  re as CodeBlockTitle,
+  b as highlightCode
 };
 //# sourceMappingURL=code-block.js.map