Source

Renders website sources with hover details. Displays URL titles, descriptions, and domain names on hover. Used to show AI-generated content sources with clickable links and favicon previews.

byJulien Thibeaut from Prompt Kit

Installation

terminal

pnpm dlx layro-cli add @ibelick/source

npx layro-cli add @ibelick/source

npx layro-cli add @ibelick/source

bunx layro-cli add @ibelick/source

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Dependencies

Demo

"use client"

import {
  HoverCard,
  HoverCardContent,
  HoverCardTrigger,
} from "@/components/ui/hover-card"
import { cn } from "@/lib/utils"
import { createContext, useContext } from "react"

const SourceContext = createContext<{
  href: string
  domain: string
} | null>(null)