SDAIA

Citation

Inline citations placed alongside an AI answer, each linking a claim back to the source it came from — across Brand, Neutral, and Outline styles.

Loading demo: citation-real-world

Installation

npx sdaia-ui@latest add citation

Usage

import { Citation } from "sdaia-ui"
1<Citation
2  variant="brand"
3  index="1"
4  source="knowledge_base_v3"
5  type="Vector File"
6/>

Examples

Brand

A success-green index badge on a raised surface — the default style.

Loading demo: citation-brand

Neutral

A neutral index badge on a subtle surface.

Loading demo: citation-neutral

Outline

An info-blue index badge on a transparent surface.

Loading demo: citation-outline

Optional slots

Hide the index badge with showIndex={false}, or the type badge with showType={false}.

Loading demo: citation-toggles

API Reference

Citation Props

Prop

Type

Default

Required

variant

'brand' | 'neutral' | 'outline'

'brand'

optional

source

ReactNode

—

required

index

ReactNode

—

optional

showIndex

boolean

true

optional

type

ReactNode

—

optional

showType

boolean

true

optional

dir

'ltr' | 'rtl'

'ltr'

optional

as

ElementType

'span'

optional