Source

Citation chip with a hover/focus preview of the source (title, host and excerpt).

Import

import { Source } from "@jcsoftdev/ui/ai";

Single-component entry points tree-shake to just this component: @jcsoftdev/ui/ai/source.

Usage

<Source
  index={1}
  title="Cuidado de la barba: guía para principiantes"
  url="https://www.barberia-ejemplo.pe/guias/cuidado-de-la-barba"
  snippet="Lava la barba dos o tres veces por semana, aplica aceite en pocas gotas y peina en la dirección del crecimiento."
/>

Props

Prop	Type	Default	Description
index	number		Citation number shown in the chip.
title *	string
url *	string		Only http(s) and mailto URLs are linked; anything else renders a non-clickable chip.
snippet	string		Short excerpt shown in the hover preview.

* marks a required prop.

It also accepts the native props of the element or primitive it renders (for example className, id, aria-* and event handlers).

Storybook stories

• Default
• Group
• Narrow
• Preset Brutal

Source

packages/ui/src/ai/source/source.tsx