"use client"; import * as React from "react"; import { cn } from "@/lib/utils"; import { CopySnippetButton } from "./code-snippet"; export interface TerminalProps extends Omit, "children"> { /** The command, without the prompt. Also what the copy button copies. */ command: string; prompt?: string; copyable?: boolean; /** Runs after the clipboard write succeeds, never on a denied one. */ onCopied?: (value: string) => void; } /* Scoped packages and URLs are what the eye scans a command for. Unscoped package names have no such marker, so an install verb makes the words after it hot too, which is the only way `bun add react` reads like `bun add @scope/x`. */ const INSTALL_VERBS = new Set(["add", "install", "i"]); const isHot = (word: string) => word.startsWith("@") || /^https?:/.test(word); export const Terminal = React.forwardRef( ( { command, prompt = "$", copyable = true, onCopied, className, ...rest }, ref, ) => { const words: { text: string; hot: boolean; at: number }[] = []; let at = 0; let installing = false; for (const text of command.split(" ")) { words.push({ text, hot: isHot(text) || (installing && !text.startsWith("-")), at, }); if (INSTALL_VERBS.has(text)) installing = true; at += text.length + 1; } return (


          
            {prompt}{" "}
          
          {words.map((word) => (
            
              {word.at > 0 ? " " : ""}
              {word.hot ? (
                {word.text}
              ) : (
                word.text
              )}
            
          ))}

{copyable && ( )}

); }, ); Terminal.displayName = "Terminal";