{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"glimpse","type":"registry:ui","title":"glimpse","description":"A component that shows a preview of a URL when hovering over a link.","author":"Hayden Bleasel <hello@haydenbleasel.com>","dependencies":[],"devDependencies":[],"registryDependencies":["hover-card"],"files":[{"type":"registry:ui","path":"index.tsx","content":"\"use client\";\n\nimport { cn } from \"@repo/shadcn-ui/lib/utils\";\nimport type { ComponentProps } from \"react\";\nimport {\n  HoverCard,\n  HoverCardContent,\n  HoverCardTrigger,\n} from \"@/components/ui/hover-card\";\n\nexport type GlimpseProps = ComponentProps<typeof HoverCard>;\n\nexport const Glimpse = (props: GlimpseProps) => {\n  return <HoverCard {...props} />;\n};\n\nexport type GlimpseContentProps = ComponentProps<typeof HoverCardContent>;\n\nexport const GlimpseContent = (props: GlimpseContentProps) => (\n  <HoverCardContent {...props} />\n);\n\nexport type GlimpseTriggerProps = ComponentProps<typeof HoverCardTrigger>;\n\nexport const GlimpseTrigger = (props: GlimpseTriggerProps) => (\n  <HoverCardTrigger {...props} />\n);\n\nexport type GlimpseTitleProps = ComponentProps<\"p\">;\n\nexport const GlimpseTitle = ({ className, ...props }: GlimpseTitleProps) => {\n  return (\n    <p className={cn(\"truncate font-semibold text-sm\", className)} {...props} />\n  );\n};\n\nexport type GlimpseDescriptionProps = ComponentProps<\"p\">;\n\nexport const GlimpseDescription = ({\n  className,\n  ...props\n}: GlimpseDescriptionProps) => {\n  return (\n    <p\n      className={cn(\"line-clamp-2 text-muted-foreground text-sm\", className)}\n      {...props}\n    />\n  );\n};\n\nexport type GlimpseImageProps = ComponentProps<\"img\">;\n\nexport const GlimpseImage = ({\n  className,\n  alt,\n  ...props\n}: GlimpseImageProps) => (\n  // biome-ignore lint/performance/noImgElement: \"Kibo UI is framework agnostic\"\n  <img\n    alt={alt ?? \"\"}\n    className={cn(\n      \"mb-4 aspect-[120/63] w-full rounded-md border object-cover\",\n      className\n    )}\n    {...props}\n  />\n);\n","target":"components/kibo-ui/glimpse/index.tsx"},{"type":"registry:ui","path":"server.tsx","content":"const TITLE_REGEX = /<title[^>]*>([^<]+)<\\/title>/;\nconst OG_TITLE_REGEX = /<meta[^>]*property=\"og:title\"[^>]*content=\"([^\"]+)\"/;\nconst DESCRIPTION_REGEX = /<meta[^>]*name=\"description\"[^>]*content=\"([^\"]+)\"/;\nconst OG_DESCRIPTION_REGEX =\n  /<meta[^>]*property=\"og:description\"[^>]*content=\"([^\"]+)\"/;\nconst OG_IMAGE_REGEX = /<meta[^>]*property=\"og:image\"[^>]*content=\"([^\"]+)\"/;\n\nexport const glimpse = async (url: string) => {\n  const response = await fetch(url);\n  const data = await response.text();\n  const titleMatch = data.match(TITLE_REGEX) || data.match(OG_TITLE_REGEX);\n  const descriptionMatch =\n    data.match(DESCRIPTION_REGEX) || data.match(OG_DESCRIPTION_REGEX);\n  const imageMatch = data.match(OG_IMAGE_REGEX);\n\n  return {\n    title: titleMatch?.at(1) ?? null,\n    description: descriptionMatch?.at(1) ?? null,\n    image: imageMatch?.at(1) ?? null,\n  };\n};\n","target":"components/kibo-ui/glimpse/server.tsx"}],"css":{}}