Todos os componentes

Open In v0 Button

Open In v0 Button é um componente de botão para React e Tailwind CSS, da biblioteca Kokonut UI, com licença MIT. Copia e cola no teu projeto.

Kokonut UI MIT buttons

O que é

Open In v0 Button é um componente de botão para React e Tailwind CSS, da biblioteca Kokonut UI, com licença MIT. Copia e cola no teu projeto.

Como usar

Abre o componente no catálogo, carrega em copiar, e cola no teu projeto. O prompt copiado leva o código e as regras para o teu agente o reproduzir sem alterar nada.

Abrir no catálogo

Cinco cópias grátis por mês. Sem cartão.

Não precisa de pacotes além do que o projeto já tem

Licença

Este componente vem de Kokonut UI e é redistribuído sob a licença MIT, que permite uso comercial. O aviso de copyright viaja com o código.

Open In v0 Button

/components/kokonutui/v0-button.tsx
import { Button } from "@/components/ui/button";
import { cn } from "@/lib/utils";

const prePath = process.env.VERCEL_PROJECT_PRODUCTION_URL
  ? `https://${process.env.VERCEL_PROJECT_PRODUCTION_URL}`
  : `https://${process.env.NEXT_PUBLIC_SITE_URL}`;

export default function V0Button({
  name = "liquid-glass-card",
  className,
}: { name?: string } & React.ComponentProps<typeof Button>) {
  return (
    <Button
      aria-label="Open in v0"
      asChild
      className={cn(
        "not-prose gap-1 rounded-lg bg-black px-3 text-white text-xs shadow-none transition-colors duration-200 hover:bg-zinc-800 dark:bg-white dark:text-black dark:hover:bg-zinc-200",
        className
      )}
    >
      <a
        href={`https://v0.dev/chat/api/open?url=${prePath}/r/${name}.json`}
        rel="noreferrer"
        target="_blank"
      >
        Open in{" "}
        <svg
          className="h-5 w-5 text-current"
          fill="none"
          viewBox="0 0 40 20"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M23.3919 0H32.9188C36.7819 0 39.9136 3.13165 39.9136 6.99475V16.0805H36.0006V6.99475C36.0006 6.90167 35.9969 6.80925 35.9898 6.71766L26.4628 16.079C26.4949 16.08 26.5272 16.0805 26.5595 16.0805H36.0006V19.7762H26.5595C22.6964 19.7762 19.4788 16.6139 19.4788 12.7508V3.68923H23.3919V12.7508C23.3919 12.9253 23.4054 13.0977 23.4316 13.2668L33.1682 3.6995C33.0861 3.6927 33.003 3.68923 32.9188 3.68923H23.3919V0Z"
            fill="currentColor"
          />
          <path
            d="M13.7688 19.0956L0 3.68759H5.53933L13.6231 12.7337V3.68759H17.7535V17.5746C17.7535 19.6705 15.1654 20.6584 13.7688 19.0956Z"
            fill="currentColor"
          />
        </svg>
      </a>
    </Button>
  );
}

Componentes parecidos