/
githubmirror
/
next.js
Обзор
Документация
Войти
/
githubmirror
/
next.js
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
canary
examples/with-supabase/components/tutorial/code-block.tsx
61 строка
1 KB
Jonathan Summers-Muir
examples: fix supabase build (#69394)
28 авг 2024, 07:37
Не верифицирован
28 авг 2024, 07:37
7da39c7
Код
Авторство
О чём код?
"use client"; import { useState } from "react"; import { Button } from "../ui/button"; const CopyIcon = () => ( <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" > <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect> <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path> </svg> ); const CheckIcon = () => ( <svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" > <polyline points="20 6 9 17 4 12"></polyline> </svg> ); export function CodeBlock({ code }: { code: string }) { const [icon, setIcon] = useState(CopyIcon); const copy = async () => { await navigator?.clipboard?.writeText(code); setIcon(CheckIcon); setTimeout(() => setIcon(CopyIcon), 2000); }; return ( <pre className="bg-muted rounded-md p-6 my-6 relative"> <Button size="icon" onClick={copy} variant={"outline"} className="absolute right-2 top-2" > {icon} </Button> <code className="text-xs p-3">{code}</code> </pre> ); }