@meistrari/chat-nuxt 3.7.0 → 3.8.0

package/README.md

@@ -211,6 +211,7 @@ import type {
 | `loadingMessagesMode` | `'ordered' \| 'random' \| null` | `'ordered'` | Show custom messages sequentially or randomly |
 | `customComponents` | `Record<string, Component>` | `undefined` | Custom markdown renderers keyed by markdown node or tag name |
 | `customHtmlTags` | `readonly string[]` | `undefined` | Extra HTML tags allowed by the markdown renderer |
+| `citations` | `ChatCitationsConfig \| null` | `undefined` | Enables `cite://` citations in assistant messages (see Citations below) |
 | `feedbackConfig` | `MessageFeedbackConfig \| null` | `undefined` | Enables 👍/👎 feedback on assistant messages; providing the prop (even `{}`) shows the controls |
 | `messageFeedback` | `Record<string, MessageFeedbackRating> \| null` | `undefined` | Host-persisted votes keyed by message id; when provided, it is the single source of truth for the selected thumbs |
 
@@ -232,6 +233,31 @@ Scoped embeds only see conversations created with the same scope. Unscoped embed
 />
 ```
 
+**Citations (`cite://`):**
+
+Hosts whose agents cite retrievable documents can teach them (via prompt) the notation
+
+```
+[visible text](cite://<namespace>/<id>[#q=<term>&n=<nth>&p=<page>])
+```
+
+and pass `citations` to enable it. The lib detects the notation in assistant messages (markdown links and bare tokens), renders each citation as a chip with a metadata popover, and — when `getDocument` is provided — opens a built-in side panel that shows the document with the cited term highlighted (`#q`, nth occurrence via `#n`). What a namespace means, and every data access, belongs to the host: callbacks run against the host's own backend, carrying the viewing user's authorization. A citation that fails to resolve renders as "unverified" — an agent cannot fabricate a trusted-looking reference, and a viewer without access to a document learns nothing from a citation to it.
+
+```vue
+<MeistrariChatEmbed
+    tela-agent-id="agent_123"
+    :citations="{
+        resolve: ref => $fetch(`/api/citations/${ref.namespace}/${encodeURIComponent(ref.id)}`).catch(() => null),
+        getDocument: ref => $fetch(`/api/citations/${ref.namespace}/${encodeURIComponent(ref.id)}/document`).catch(() => null),
+        locate: (ref, term) => $fetch(`/api/citations/${ref.namespace}/${encodeURIComponent(ref.id)}/occurrences`, { query: { term } }).catch(() => null),
+    }"
+/>
+```
+
+`ref.id` arrives percent-decoded (natural identifiers may carry pipes, spaces, accents or slashes) — re-encode it when building URLs, as above.
+
+`ChatCitationsConfig` (exported from `@meistrari/chat-nuxt/types/citations`): `resolve` maps a citation to display metadata (`null` = unverified); `getDocument` enables the document panel; `locate` returns precise term offsets for highlighting (omit it for a client-side, accent-sensitive fallback); `component` replaces the built-in chip; `onOpen` takes over the click entirely. Without the `citations` prop nothing changes: `cite://` hrefs keep rendering as plain links.
+
 **Events:**
 
 | Event | Payload | Description |

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@meistrari/chat-nuxt",
   "configKey": "chatNuxt",
-  "version": "3.7.0",
+  "version": "3.8.0",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/module.mjs

@@ -151,8 +151,8 @@ function resolveWorkspaceSettingsResolverEntry(srcDir, fallbackResolverBase) {
 const _chatNuxtRequire = createRequire(import.meta.url);
 const _chatNuxtPackageVersion = _chatNuxtRequire("../package.json").version;
 const VUE_COMPONENT_EXTENSIONS = [".vue"];
-const FEATURE_DIRS = ["conversations", "embed", "files", "messages", "rendering", "shared", "usage", "workspace"];
-const FULL_NAME_COMPONENT_DIRS = ["conversations", "embed", "files", "messages", "usage"];
+const FEATURE_DIRS = ["citations", "conversations", "embed", "files", "messages", "rendering", "shared", "usage", "workspace"];
+const FULL_NAME_COMPONENT_DIRS = ["citations", "conversations", "embed", "files", "messages", "usage"];
 const PATH_PREFIX_COMPONENT_DIRS = ["rendering", "shared"];
 const DYNAMIC_ICON_SAFELIST = [
   "i-ph-folder-minus",

package/dist/runtime/citations/citation-links.d.ts

@@ -0,0 +1,32 @@
+/**
+ * The `cite://` notation: `[visible text](cite://<namespace>/<id>[#q=<term>&n=<nth>&p=<page>])`.
+ *
+ * Agents are taught (via prompt) to emit this scheme when citing a document they actually
+ * retrieved. The lib only parses the shape — what a namespace means and how a citation is
+ * resolved belongs to the host app through `ChatCitationsConfig`. The id is expected to be
+ * an identifier the agent could only know from a real retrieval, so a citation that fails
+ * to resolve is rendered as unverified instead of trusted.
+ */
+/**
+ * Bare cite tokens in prose; markdown link targets (`](cite://...`) are left to the link
+ * renderer. Unlike VAULT_REGEX, `_` is allowed: source namespaces use it (`stf_sumulas`).
+ */
+export declare const CITE_REGEX: RegExp;
+export type CitationLocator = {
+    /** Exact term whose occurrence the citation points at, for in-document highlight. */
+    term?: string;
+    /** 1-based nth occurrence of `term`; defaults to the first when absent. */
+    occurrence?: number;
+    /** 1-based page at the original source; only meaningful for paginated originals. */
+    page?: number;
+};
+export type CitationRef = {
+    namespace: string;
+    id: string;
+    locator?: CitationLocator;
+    raw: string;
+};
+export declare function isCitationUrl(url: string): boolean;
+export declare function parseCitationUrl(url: string): CitationRef | null;
+/** Cache key for resolution state: the locator addresses a spot inside the same document. */
+export declare function citationCacheKey(ref: Pick<CitationRef, 'namespace' | 'id'>): string;

package/dist/runtime/citations/citation-links.js

@@ -0,0 +1,56 @@
+const CITE_SCHEME = "cite://";
+export const CITE_REGEX = /(?<!\]\()cite:\/\/[^\s"'<>`\[\]()*~]+/gi;
+const NAMESPACE_PATTERN = /^[a-z0-9_-]+$/i;
+export function isCitationUrl(url) {
+  return url.toLowerCase().startsWith(CITE_SCHEME);
+}
+export function parseCitationUrl(url) {
+  if (!isCitationUrl(url))
+    return null;
+  const hashIndex = url.indexOf("#");
+  const body = hashIndex === -1 ? url.slice(CITE_SCHEME.length) : url.slice(CITE_SCHEME.length, hashIndex);
+  const separatorIndex = body.indexOf("/");
+  if (separatorIndex === -1)
+    return null;
+  const namespace = body.slice(0, separatorIndex);
+  const id = safeDecodeURIComponent(body.slice(separatorIndex + 1));
+  if (!namespace || !NAMESPACE_PATTERN.test(namespace) || !id)
+    return null;
+  const locator = hashIndex === -1 ? void 0 : parseCitationLocator(url.slice(hashIndex + 1));
+  return {
+    namespace: namespace.toLowerCase(),
+    id,
+    ...locator ? { locator } : {},
+    raw: url
+  };
+}
+function parseCitationLocator(hash) {
+  const params = new URLSearchParams(hash);
+  const locator = {};
+  const term = params.get("q")?.trim();
+  if (term)
+    locator.term = term;
+  const occurrence = parsePositiveInt(params.get("n"));
+  if (occurrence !== void 0)
+    locator.occurrence = occurrence;
+  const page = parsePositiveInt(params.get("p"));
+  if (page !== void 0)
+    locator.page = page;
+  return Object.keys(locator).length > 0 ? locator : void 0;
+}
+function safeDecodeURIComponent(value) {
+  try {
+    return decodeURIComponent(value);
+  } catch {
+    return value;
+  }
+}
+function parsePositiveInt(value) {
+  if (!value || !/^\d+$/.test(value))
+    return void 0;
+  const parsed = Number(value);
+  return Number.isSafeInteger(parsed) && parsed > 0 ? parsed : void 0;
+}
+export function citationCacheKey(ref) {
+  return `${ref.namespace}/${ref.id}`;
+}

package/dist/runtime/citations/components/chat-citation.d.vue.ts

@@ -0,0 +1,9 @@
+import type { CitationRef } from '../citation-links.js';
+type __VLS_Props = {
+    citation: CitationRef;
+    /** Visible text when the citation came from a markdown link. */
+    label?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/citations/components/chat-citation.vue

@@ -0,0 +1,186 @@
+<script setup>
+import { onClickOutside } from "@vueuse/core";
+import { useEmbedConfig } from "../../embed/composables/embed-config";
+import { useCitationPanel } from "../composables/citation-panel";
+import { useCitations } from "../composables/citations";
+const props = defineProps({
+  citation: { type: Object, required: true },
+  label: { type: String, required: false }
+});
+const embedConfig = useEmbedConfig();
+const config = computed(() => embedConfig?.citations.value);
+const { resolveCitation, retryCitation } = useCitations();
+const { openCitationDocument } = useCitationPanel();
+const entry = shallowRef(null);
+watchEffect(() => {
+  if (!entry.value && config.value)
+    entry.value = resolveCitation(config.value, props.citation);
+});
+const status = computed(() => entry.value?.status.value ?? "loading");
+const meta = computed(() => entry.value?.meta.value ?? null);
+const displayLabel = computed(() => props.label?.trim() || meta.value?.identifier || meta.value?.title || "Documento");
+const rootEl = ref(null);
+const popoverOpen = ref(false);
+onClickOutside(rootEl, () => {
+  popoverOpen.value = false;
+});
+function togglePopover() {
+  if (status.value === "loading")
+    return;
+  popoverOpen.value = !popoverOpen.value;
+}
+function retry() {
+  if (!config.value)
+    return;
+  entry.value = retryCitation(config.value, props.citation);
+  popoverOpen.value = false;
+}
+const canOpenDocument = computed(() => Boolean(config.value?.onOpen || config.value?.getDocument));
+function openDocument() {
+  popoverOpen.value = false;
+  const activeConfig = config.value;
+  if (!activeConfig)
+    return;
+  if (activeConfig.onOpen) {
+    activeConfig.onOpen(props.citation, meta.value);
+    return;
+  }
+  openCitationDocument(props.citation, meta.value);
+}
+const safeSourceUrl = computed(() => {
+  const url = meta.value?.url;
+  return url && /^https?:\/\//i.test(url) ? url : null;
+});
+const formattedDate = computed(() => {
+  if (!meta.value?.date)
+    return null;
+  const parsed = new Date(meta.value.date);
+  if (Number.isNaN(parsed.getTime()))
+    return meta.value.date;
+  return parsed.toLocaleDateString("pt-BR", { timeZone: "UTC" });
+});
+const chipIcon = computed(() => {
+  if (status.value === "loading")
+    return "i-ph-spinner animate-spin text-neutral-400";
+  if (status.value === "unresolved")
+    return "i-ph-warning-circle text-amber-600";
+  return "i-ph-file-text text-neutral-500";
+});
+const BADGE_TONE_CLASSES = {
+  neutral: "bg-neutral-100 text-neutral-700",
+  warning: "bg-amber-100 text-amber-800",
+  danger: "bg-red-100 text-red-700"
+};
+const badgeClasses = computed(() => BADGE_TONE_CLASSES[meta.value?.badge?.tone ?? "neutral"]);
+</script>
+
+<template>
+    <component
+        :is="config.component"
+        v-if="config?.component"
+        :citation="citation"
+        :label="label"
+        :status="status"
+        :meta="meta"
+    />
+    <span
+        v-else
+        ref="rootEl"
+        class="citation-ref"
+    >
+        <button
+            type="button"
+            class="citation-ref-anchor"
+            :class="{
+  'citation-ref-anchor--loading': status === 'loading',
+  'citation-ref-anchor--unresolved': status === 'unresolved'
+}"
+            :aria-expanded="popoverOpen"
+            @click="togglePopover"
+        ><span :class="chipIcon" class="citation-ref-icon" />{{ displayLabel }}</button>
+
+        <div
+            v-if="popoverOpen"
+            absolute bottom-full left-0 mb-6px z-50
+            w-300px
+            bg-white
+            border-0.5px border-solid border-neutral-300
+            rounded-12px p-12px
+            shadow-lg
+            cursor-default
+            flex="~ col" gap-8px
+        >
+            <template v-if="status === 'unresolved'">
+                <div flex items-start gap-6px>
+                    <span i-ph-warning-circle text-14px text-amber-600 mt-2px flex-shrink-0 />
+                    <p text-12px leading-16px text-neutral-700>
+                        Não foi possível verificar esta referência. Ela pode não existir ou não estar disponível para o seu perfil.
+                    </p>
+                </div>
+                <button
+                    type="button"
+                    self-start text-12px leading-16px text-neutral-700 underline cursor-pointer
+                    @click="retry"
+                >
+                    Tentar novamente
+                </button>
+            </template>
+
+            <template v-else-if="meta">
+                <div flex="~ col" gap-2px>
+                    <p text-13px leading-18px font-580 text-neutral-900>
+                        {{ meta.title }}
+                    </p>
+                    <p v-if="meta.sourceLabel || meta.identifier" text-12px leading-16px text-neutral-600>
+                        {{ [meta.sourceLabel, meta.identifier].filter(Boolean).join(" \xB7 ") }}
+                    </p>
+                    <p v-if="formattedDate" text-12px leading-16px text-neutral-500>
+                        {{ meta.dateLabel ? `${meta.dateLabel}: ` : "" }}{{ formattedDate }}
+                    </p>
+                </div>
+
+                <span
+                    v-if="meta.badge"
+                    self-start px-6px py-1px rounded-4px text-11px leading-15px font-580
+                    :class="badgeClasses"
+                >
+                    {{ meta.badge.label }}
+                </span>
+
+                <p v-if="meta.snippet" text-12px leading-17px text-neutral-600 line-clamp-3>
+                    {{ meta.snippet }}
+                </p>
+
+                <div v-if="canOpenDocument || safeSourceUrl" flex items-center gap-12px pt-2px>
+                    <button
+                        v-if="canOpenDocument"
+                        type="button"
+                        inline-flex items-center gap-4px
+                        text-12px leading-16px font-580 text-neutral-900
+                        cursor-pointer hover:underline
+                        @click="openDocument"
+                    >
+                        <span i-ph-file-magnifying-glass text-13px />
+                        Ver documento
+                    </button>
+                    <a
+                        v-if="safeSourceUrl"
+                        :href="safeSourceUrl"
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        inline-flex items-center gap-4px
+                        text-12px leading-16px text-neutral-600
+                        hover:underline
+                    >
+                        <span i-ph-arrow-square-out text-13px />
+                        Abrir na fonte
+                    </a>
+                </div>
+            </template>
+        </div>
+    </span>
+</template>
+
+<style scoped>
+.citation-ref{display:inline;position:relative}.citation-ref-anchor{background:transparent;border:0;border-radius:5px;color:inherit;cursor:pointer;display:inline;font:inherit;margin:0 -2px;padding:1px 3px;text-decoration:underline;text-decoration-color:#a3a3a3;text-decoration-style:dotted;text-decoration-thickness:1px;text-underline-offset:3px;transition:background-color .15s ease,text-decoration-color .15s ease}.citation-ref-anchor:hover{background-color:#f5f5f5;text-decoration-color:#525252}.citation-ref-anchor--loading{cursor:default;opacity:.6;text-decoration-color:#d4d4d4}.citation-ref-anchor--unresolved{text-decoration-color:#f59e0b}.citation-ref-anchor--unresolved:hover{background-color:#fffbeb}.citation-ref-icon{display:inline-block;font-size:.85em;margin-right:.25em;vertical-align:-.08em}
+</style>

package/dist/runtime/citations/components/chat-citation.vue.d.ts

@@ -0,0 +1,9 @@
+import type { CitationRef } from '../citation-links.js';
+type __VLS_Props = {
+    citation: CitationRef;
+    /** Visible text when the citation came from a markdown link. */
+    label?: string;
+};
+declare const __VLS_export: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/citations/components/citation-document-panel.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/citations/components/citation-document-panel.vue

@@ -0,0 +1,217 @@
+<script setup>
+import { useMagicKeys } from "@vueuse/core";
+import { useEmbedConfig } from "../../embed/composables/embed-config";
+import { useCitationPanel } from "../composables/citation-panel";
+import { locateTermClientSide, splitContentByOccurrences } from "../document-highlight";
+const { isOpen, active, closeCitationDocument } = useCitationPanel();
+const embedConfig = useEmbedConfig();
+const config = computed(() => embedConfig?.citations.value);
+const isLoading = ref(false);
+const loadFailed = ref(false);
+const documentData = ref(null);
+const occurrences = ref([]);
+const contentEl = ref(null);
+let loadToken = 0;
+const { escape } = useMagicKeys();
+watch(() => escape?.value, (pressed) => {
+  if (pressed && isOpen.value)
+    closeCitationDocument();
+});
+watch([isOpen, active], () => {
+  void load();
+}, { immediate: true });
+async function load() {
+  if (!isOpen.value || !active.value)
+    return;
+  const activeConfig = config.value;
+  if (!activeConfig?.getDocument)
+    return;
+  const token = ++loadToken;
+  const citation = active.value.citation;
+  isLoading.value = true;
+  loadFailed.value = false;
+  documentData.value = null;
+  occurrences.value = [];
+  try {
+    const loaded = await activeConfig.getDocument(citation);
+    if (token !== loadToken)
+      return;
+    documentData.value = loaded;
+    loadFailed.value = loaded === null;
+    const term = citation.locator?.term;
+    if (loaded && term) {
+      let located = null;
+      if (activeConfig.locate) {
+        try {
+          located = await activeConfig.locate(citation, term);
+        } catch {
+          located = null;
+        }
+      }
+      if (token !== loadToken)
+        return;
+      occurrences.value = located ?? locateTermClientSide(loaded.content, term);
+    }
+  } catch {
+    if (token === loadToken)
+      loadFailed.value = true;
+  } finally {
+    if (token === loadToken)
+      isLoading.value = false;
+  }
+  if (token !== loadToken)
+    return;
+  await nextTick();
+  scrollToTargetOccurrence();
+}
+const highlightSegments = computed(() => {
+  if (!documentData.value)
+    return [];
+  return splitContentByOccurrences(documentData.value.content, occurrences.value);
+});
+const totalOccurrences = computed(() => highlightSegments.value.filter((segment) => segment.occurrence !== void 0).length);
+const targetOccurrence = computed(() => {
+  if (totalOccurrences.value === 0)
+    return 0;
+  const wanted = active.value?.citation.locator?.occurrence ?? 1;
+  return Math.min(wanted, totalOccurrences.value);
+});
+const termNotFound = computed(() => Boolean(
+  !isLoading.value && documentData.value && active.value?.citation.locator?.term && totalOccurrences.value === 0
+));
+function scrollToTargetOccurrence() {
+  if (targetOccurrence.value === 0)
+    return;
+  const target = contentEl.value?.querySelector(`[data-occurrence="${targetOccurrence.value}"]`);
+  target?.scrollIntoView({ block: "center" });
+}
+const meta = computed(() => active.value?.meta ?? null);
+const subtitle = computed(() => [meta.value?.sourceLabel, meta.value?.identifier].filter(Boolean).join(" \xB7 "));
+const safeSourceUrl = computed(() => {
+  const url = meta.value?.url;
+  return url && /^https?:\/\//i.test(url) ? url : null;
+});
+</script>
+
+<template>
+    <Transition name="slide-panel">
+        <div
+            v-if="isOpen && active"
+            class="h-full w-full flex flex-col bg-neutral-50 b-l='.5px neutral-300'"
+            style="box-shadow: 0px 12px 20px 0px rgba(163, 163, 163, 0.06);"
+        >
+            <div
+                relative flex items-start gap-8px
+                pl-18px pr-56px py-12px
+                flex-shrink-0
+            >
+                <span i-ph-file-text text-16px text-neutral-600 mt-2px flex-shrink-0 />
+                <div flex="~ col" gap-2px min-w-0>
+                    <p
+                        text-13px font-580 text-secondary leading-17px
+                        :title="meta?.title ?? 'Documento'"
+                    >
+                        {{ meta?.title ?? "Documento" }}
+                    </p>
+                    <p v-if="subtitle" text-12px leading-16px text-neutral-500 truncate>
+                        {{ subtitle }}
+                    </p>
+                </div>
+
+                <div class="absolute top-8px right-12px flex items-center gap-4px">
+                    <a
+                        v-if="safeSourceUrl"
+                        :href="safeSourceUrl"
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        title="Abrir na fonte original"
+                        class="flex items-center justify-center w-28px h-28px rounded-8px hover:bg-neutral-200 transition-colors"
+                    >
+                        <span class="i-ph-arrow-square-out text-16px text-gray-700" />
+                    </a>
+                    <button
+                        type="button"
+                        title="Fechar"
+                        class="flex items-center justify-center w-28px h-28px rounded-8px hover:bg-neutral-200 transition-colors"
+                        @click="closeCitationDocument"
+                    >
+                        <span class="i-ph-x text-16px text-gray-700" />
+                    </button>
+                </div>
+            </div>
+
+            <div
+                v-if="documentData?.truncated || termNotFound"
+                flex="~ col" gap-6px px-18px pb-8px flex-shrink-0
+            >
+                <div
+                    v-if="termNotFound"
+                    flex items-start gap-6px
+                    px-10px py-8px rounded-8px
+                    bg-amber-50 border-0.5px border-solid border-amber-200
+                >
+                    <span i-ph-warning-circle text-13px text-amber-600 mt-1px flex-shrink-0 />
+                    <p text-12px leading-16px text-amber-800>
+                        Trecho citado não localizado neste documento.
+                    </p>
+                </div>
+                <div
+                    v-if="documentData?.truncated"
+                    flex items-start gap-6px
+                    px-10px py-8px rounded-8px
+                    bg-neutral-100 border-0.5px border-solid border-neutral-200
+                >
+                    <span i-ph-info text-13px text-neutral-500 mt-1px flex-shrink-0 />
+                    <p text-12px leading-16px text-neutral-600>
+                        Documento exibido parcialmente.
+                    </p>
+                </div>
+            </div>
+
+            <div
+                v-if="isLoading"
+                flex-1 flex items-center justify-center
+            >
+                <span i-ph-spinner animate-spin text-24px text-neutral-400 />
+            </div>
+
+            <div
+                v-else-if="loadFailed"
+                flex-1 flex="~ col" items-center justify-center gap-4px px-24px
+            >
+                <span i-ph-file-x text-24px text-neutral-400 />
+                <p text-13px leading-18px text-neutral-700 text-center>
+                    Documento não disponível.
+                </p>
+                <p text-12px leading-16px text-neutral-500 text-center>
+                    Ele pode não existir ou não estar acessível para o seu perfil.
+                </p>
+            </div>
+
+            <div
+                v-else-if="documentData"
+                ref="contentEl"
+                flex-1 overflow-y-auto
+                px-18px py-14px
+            >
+                <p text-13px leading-20px text-neutral-800 whitespace-pre-wrap break-words>
+                    <template v-for="(segment, index) in highlightSegments" :key="index">
+                        <mark
+                            v-if="segment.occurrence !== void 0"
+                            :data-occurrence="segment.occurrence"
+                            rounded-2px
+                            :class="segment.occurrence === targetOccurrence ? 'bg-amber-300' : 'bg-amber-100'"
+                        >{{ segment.text }}</mark>
+                        <template v-else>
+                            {{ segment.text }}
+                        </template>
+                    </template>
+                </p>
+            </div>
+        </div>
+    </Transition>
+</template>
+
+<style scoped>
+.slide-panel-enter-active,.slide-panel-leave-active{transition:all .2s ease}.slide-panel-enter-from,.slide-panel-leave-to{opacity:0;transform:translateX(100%)}
+</style>

package/dist/runtime/citations/components/citation-document-panel.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/citations/composables/citation-panel.d.ts

@@ -0,0 +1,8 @@
+import type { CitationRef } from '../citation-links.js';
+import type { CitationMeta } from '../types.js';
+export declare function useCitationPanel(): {
+    isOpen: any;
+    active: any;
+    openCitationDocument: (citation: CitationRef, meta: CitationMeta | null) => void;
+    closeCitationDocument: () => void;
+};

package/dist/runtime/citations/composables/citation-panel.js

@@ -0,0 +1,17 @@
+const isOpen = ref(false);
+const active = ref(null);
+export function useCitationPanel() {
+  function openCitationDocument(citation, meta) {
+    active.value = { citation, meta };
+    isOpen.value = true;
+  }
+  function closeCitationDocument() {
+    isOpen.value = false;
+  }
+  return {
+    isOpen: readonly(isOpen),
+    active: readonly(active),
+    openCitationDocument,
+    closeCitationDocument
+  };
+}

package/dist/runtime/citations/composables/citations.d.ts

@@ -0,0 +1,17 @@
+import type { Ref } from 'vue';
+import { type CitationRef } from '../citation-links.js';
+import type { ChatCitationsConfig, CitationMeta, CitationStatus } from '../types.js';
+export type CitationEntry = {
+    status: Ref<CitationStatus>;
+    meta: Ref<CitationMeta | null>;
+};
+/**
+ * Resolution cache shared by every chip in the session: one `resolve` call per document,
+ * no matter how many times (or with which locators) it is cited. Keyed by config identity
+ * so embeds with different resolvers (different backends/authorization scopes) never
+ * reuse each other's results.
+ */
+export declare function useCitations(): {
+    resolveCitation: (config: ChatCitationsConfig, citation: CitationRef) => CitationEntry;
+    retryCitation: (config: ChatCitationsConfig, citation: CitationRef) => CitationEntry;
+};

package/dist/runtime/citations/composables/citations.js

@@ -0,0 +1,44 @@
+import { citationCacheKey } from "../citation-links.js";
+export function useCitations() {
+  const nuxtApp = useNuxtApp();
+  const caches = nuxtApp._chatCitationEntries ??= /* @__PURE__ */ new WeakMap();
+  function entriesFor(config) {
+    let entries = caches.get(config);
+    if (!entries) {
+      entries = /* @__PURE__ */ new Map();
+      caches.set(config, entries);
+    }
+    return entries;
+  }
+  function resolveInto(entry, config, citation) {
+    entry.status.value = "loading";
+    config.resolve(citation).then((meta) => {
+      entry.meta.value = meta;
+      entry.status.value = meta ? "resolved" : "unresolved";
+    }).catch(() => {
+      entry.status.value = "unresolved";
+    });
+  }
+  function resolveCitation(config, citation) {
+    const entries = entriesFor(config);
+    const key = citationCacheKey(citation);
+    const existing = entries.get(key);
+    if (existing)
+      return existing;
+    const entry = {
+      status: ref("loading"),
+      meta: ref(null)
+    };
+    entries.set(key, entry);
+    resolveInto(entry, config, citation);
+    return entry;
+  }
+  function retryCitation(config, citation) {
+    const existing = entriesFor(config).get(citationCacheKey(citation));
+    if (!existing)
+      return resolveCitation(config, citation);
+    resolveInto(existing, config, citation);
+    return existing;
+  }
+  return { resolveCitation, retryCitation };
+}

package/dist/runtime/citations/document-highlight.d.ts

@@ -0,0 +1,13 @@
+import type { CitationOccurrence } from './types.js';
+export type HighlightSegment = {
+    text: string;
+    /** 1-based occurrence number when this segment is a highlighted match. */
+    occurrence?: number;
+};
+/**
+ * Fallback when the host provides no `locate` callback. Plain case-insensitive matching:
+ * accent variants won't match, which degrades to "term not found" rather than breaking.
+ */
+export declare function locateTermClientSide(content: string, term: string): CitationOccurrence[];
+/** Occurrence ranges are host data: invalid, out-of-bounds and overlapping ranges are dropped. */
+export declare function splitContentByOccurrences(content: string, occurrences: CitationOccurrence[]): HighlightSegment[];

package/dist/runtime/citations/document-highlight.js

@@ -0,0 +1,35 @@
+export function locateTermClientSide(content, term) {
+  const needle = term.toLowerCase();
+  if (!needle)
+    return [];
+  const haystack = content.toLowerCase();
+  const occurrences = [];
+  let cursor = 0;
+  while (true) {
+    const index = haystack.indexOf(needle, cursor);
+    if (index === -1)
+      break;
+    occurrences.push({ offset: index, end: index + needle.length });
+    cursor = index + needle.length;
+  }
+  return occurrences;
+}
+export function splitContentByOccurrences(content, occurrences) {
+  const ordered = [...occurrences].filter((occurrence) => Number.isInteger(occurrence.offset) && Number.isInteger(occurrence.end) && occurrence.offset >= 0 && occurrence.end > occurrence.offset && occurrence.offset < content.length).sort((a, b) => a.offset - b.offset);
+  const segments = [];
+  let lastEnd = 0;
+  let count = 0;
+  for (const occurrence of ordered) {
+    if (occurrence.offset < lastEnd)
+      continue;
+    const end = Math.min(occurrence.end, content.length);
+    if (occurrence.offset > lastEnd)
+      segments.push({ text: content.slice(lastEnd, occurrence.offset) });
+    count += 1;
+    segments.push({ text: content.slice(occurrence.offset, end), occurrence: count });
+    lastEnd = end;
+  }
+  if (lastEnd < content.length)
+    segments.push({ text: content.slice(lastEnd) });
+  return segments.length > 0 ? segments : [{ text: content }];
+}

package/dist/runtime/citations/types.d.ts

@@ -0,0 +1,57 @@
+import type { Component } from 'vue';
+import type { CitationRef } from './citation-links.js';
+export type { CitationLocator, CitationRef } from './citation-links.js';
+export type CitationMeta = {
+    /** Human-readable document title. Hosts must never surface internal ids here. */
+    title: string;
+    /** Display name of the base/source the document belongs to. */
+    sourceLabel?: string;
+    /** Identifier of the document at its origin (case number, súmula number, ...). */
+    identifier?: string;
+    /** Link to the document at its original source, when one exists. */
+    url?: string;
+    /** ISO date associated with the document. */
+    date?: string;
+    /** What `date` refers to (julgamento, aprovação, publicação, ...). */
+    dateLabel?: string;
+    /** Short excerpt shown in the citation popover. */
+    snippet?: string;
+    /** Status badge, e.g. a súmula that is no longer in force. */
+    badge?: {
+        label: string;
+        tone?: 'neutral' | 'warning' | 'danger';
+    };
+};
+export type CitationDocument = {
+    /** Plain-text document content as stored by the host. */
+    content: string;
+    /** True when the host cut `content` short; the panel discloses it. */
+    truncated?: boolean;
+};
+export type CitationOccurrence = {
+    /** Inclusive char offset of the occurrence in the document content. */
+    offset: number;
+    /** Exclusive end offset of the occurrence. */
+    end: number;
+};
+/**
+ * Host-provided citation behavior. The lib owns detection, rendering and interaction
+ * states; the host owns data access (and with it, authorization: every callback runs
+ * against the host's own backend with the viewing user's identity).
+ *
+ * A `resolve` that returns `null` renders the citation as unverified — deliberately
+ * indistinguishable between "does not exist" and "not visible to this viewer".
+ */
+export type ChatCitationsConfig = {
+    /** Resolve a citation to display metadata; `null` marks it unverified. */
+    resolve: (ref: CitationRef) => Promise<CitationMeta | null>;
+    /** Fetch the document body; providing this enables the built-in document panel. */
+    getDocument?: (ref: CitationRef) => Promise<CitationDocument | null>;
+    /** Locate a term's occurrences for highlighting; absent = client-side best effort. */
+    locate?: (ref: CitationRef, term: string) => Promise<CitationOccurrence[] | null>;
+    /** Replaces the built-in citation chip. */
+    component?: Component;
+    /** Takes over the click entirely; the built-in panel is not opened. */
+    onOpen?: (ref: CitationRef, meta: CitationMeta | null) => void;
+};
+export type CitationStatus = 'loading' | 'resolved' | 'unresolved';

package/dist/runtime/conversations/components/chat-conversation-list.vue

@@ -84,7 +84,7 @@ const {
 
         <template v-else>
             <div
-                v-if="showGroupCreationPrompt"
+                v-if="showGroupCreationPrompt && !hideFolderHint"
                 mx-8px
                 flex="~ col" gap-10px
             >
@@ -113,7 +113,7 @@ const {
                         <span h-10px w-84px rounded-full bg-neutral-100 />
                     </div>
                 </div>
-                <p v-if="!hideFolderHint" px-4px text-14px text-neutral-500 leading-20px>
+                <p px-4px text-14px text-neutral-500 leading-20px>
                     Suas pastas aparecem aqui. Crie uma para começar a agrupar conversas.
                 </p>
                 <ChatConversationNewGroupButton label="Criar pasta" variant="empty-state" />

package/dist/runtime/embed/components/chat-embed-inner.vue

@@ -81,6 +81,7 @@ const effectiveWorkspaceSettings = computed(() => {
 });
 const { closePanel: closeFilesPanel } = useConversationFilesPanel();
 const { isOpen: isPreviewPanelOpen, panelWidth: previewPanelWidth, currentFile: currentPreviewFile, closePreview } = useFilePreviewPanel();
+const { isOpen: isCitationPanelOpen } = useCitationPanel();
 const activeConversationId = ref(
   normalizeConversationId(props.conversationId) ?? normalizeConversationId(props.initialConversationId)
 );
@@ -975,6 +976,20 @@ async function handleDelete() {
         >
             <FilePreviewPanel />
         </div>
+
+        <div
+            v-if="isCitationPanelOpen && !isMobile"
+            h-full flex-shrink-0 pt-64px
+            w-440px
+        >
+            <CitationDocumentPanel />
+        </div>
+        <div
+            v-else-if="isCitationPanelOpen && isMobile"
+            fixed inset-0 z-50 bg-neutral-50
+        >
+            <CitationDocumentPanel />
+        </div>
     </div>
 </template>
 

package/dist/runtime/embed/components/chat-embed.vue

@@ -20,6 +20,7 @@ const props = defineProps({
   loadingMessagesMode: { type: [String, null], required: false },
   customComponents: { type: Object, required: false },
   customHtmlTags: { type: Array, required: false },
+  citations: { type: [Object, null], required: false },
   feedbackConfig: { type: [Object, null], required: false },
   messageFeedback: { type: [Object, null], required: false },
   telaAgentId: { type: null, required: false },
@@ -49,6 +50,7 @@ provideEmbedConfig({
   loadingMessagesMode: computed(() => props.loadingMessagesMode),
   customComponents: computed(() => props.customComponents),
   customHtmlTags: computed(() => props.customHtmlTags),
+  citations: computed(() => props.citations),
   feedbackConfig: computed(() => props.feedbackConfig),
   messageFeedback: computed(() => props.messageFeedback)
 }, { syncGlobal: !parentEmbedConfig });

package/dist/runtime/embed/components/meistrari-chat-embed.vue

@@ -13,6 +13,7 @@ const props = defineProps({
   loadingMessagesMode: { type: [String, null], required: false },
   customComponents: { type: Object, required: false },
   customHtmlTags: { type: Array, required: false },
+  citations: { type: [Object, null], required: false },
   feedbackConfig: { type: [Object, null], required: false },
   messageFeedback: { type: [Object, null], required: false },
   telaAgentId: { type: null, required: false },
@@ -44,6 +45,7 @@ const hideSettings = computed(() => props.hideSettings ?? false);
         :loading-messages-mode="loadingMessagesMode"
         :custom-components="customComponents"
         :custom-html-tags="customHtmlTags"
+        :citations="citations"
         :feedback-config="feedbackConfig"
         :message-feedback="messageFeedback"
         @update:conversation-id="$emit('update:conversationId', $event)"
@@ -72,6 +74,7 @@ const hideSettings = computed(() => props.hideSettings ?? false);
         :loading-messages-mode="loadingMessagesMode"
         :custom-components="customComponents"
         :custom-html-tags="customHtmlTags"
+        :citations="citations"
         :feedback-config="feedbackConfig"
         :message-feedback="messageFeedback"
         @update:conversation-id="$emit('update:conversationId', $event)"

package/dist/runtime/embed/components/mobile/chat-mobile-drawer.vue

@@ -310,7 +310,7 @@ async function handleConversationDrop(event, groupId) {
             </div>
             <div v-else flex="~ col" gap-8px>
                 <div
-                    v-if="showGroupCreationPrompt"
+                    v-if="showGroupCreationPrompt && !hideFolderHint"
                     mx-4px
                     flex="~ col" gap-10px
                 >
@@ -339,7 +339,7 @@ async function handleConversationDrop(event, groupId) {
                             <span h-10px w-84px rounded-full bg-neutral-100 />
                         </div>
                     </div>
-                    <p v-if="!hideFolderHint" px-4px text-14px text-neutral-500 leading-20px>
+                    <p px-4px text-14px text-neutral-500 leading-20px>
                         Suas pastas aparecem aqui. Crie uma para começar a agrupar conversas.
                     </p>
                     <ChatConversationNewGroupButton label="Criar pasta" variant="empty-state" />

package/dist/runtime/embed/composables/embed-config.d.ts

@@ -3,6 +3,7 @@ import type { ConversationCreatorFilter } from '../../types/schemas/chat/primiti
 import type { WorkspaceSettingsResponse as WorkspaceSettings } from '../../types/schemas/chat/workspace-settings.js';
 import type { TelaAgentExecutionInput } from '../../types/schemas/integrations/tela-agent-api.js';
 import type { ChatLoadingMessageMode } from '../loading-messages.js';
+import type { ChatCitationsConfig } from '../../citations/types.js';
 import type { MessageFeedbackConfig, MessageFeedbackRating } from '../../messages/composables/chat-feedback.js';
 type ConfiguredTelaAgentInputs = DeepReadonly<TelaAgentExecutionInput[]> | null | undefined;
 type ConfiguredMessageFeedback = Readonly<Record<string, MessageFeedbackRating>> | null | undefined;
@@ -19,6 +20,7 @@ export type EmbedConfig = {
     loadingMessagesMode: Ref<ChatLoadingMessageMode | null | undefined>;
     customComponents: Ref<Record<string, Component> | undefined>;
     customHtmlTags: Ref<readonly string[] | undefined>;
+    citations: Ref<ChatCitationsConfig | null | undefined>;
     feedbackConfig: Ref<MessageFeedbackConfig | null | undefined>;
     messageFeedback: Ref<ConfiguredMessageFeedback>;
 };
@@ -35,6 +37,7 @@ type EmbedConfigInput = {
     loadingMessagesMode?: MaybeRefOrGetter<ChatLoadingMessageMode | null | undefined>;
     customComponents?: MaybeRefOrGetter<Record<string, Component> | undefined>;
     customHtmlTags?: MaybeRefOrGetter<readonly string[] | undefined>;
+    citations?: MaybeRefOrGetter<ChatCitationsConfig | null | undefined>;
     feedbackConfig?: MaybeRefOrGetter<MessageFeedbackConfig | null | undefined>;
     messageFeedback?: MaybeRefOrGetter<ConfiguredMessageFeedback>;
 };

package/dist/runtime/embed/composables/embed-config.js

@@ -5,6 +5,11 @@ function useGlobalCustomComponentsState() {
   nuxtApp._chatEmbedConfigCustomComponents ??= shallowRef(void 0);
   return nuxtApp._chatEmbedConfigCustomComponents;
 }
+function useGlobalCitationsState() {
+  const nuxtApp = useNuxtApp();
+  nuxtApp._chatEmbedConfigCitations ??= shallowRef(void 0);
+  return nuxtApp._chatEmbedConfigCitations;
+}
 function useGlobalEmbedConfigState() {
   return {
     provided: useState("chat-embed-config-provided", () => false),
@@ -20,6 +25,7 @@ function useGlobalEmbedConfigState() {
     loadingMessagesMode: useState("chat-embed-config-loading-messages-mode", () => void 0),
     customComponents: useGlobalCustomComponentsState(),
     customHtmlTags: useState("chat-embed-config-custom-html-tags", () => void 0),
+    citations: useGlobalCitationsState(),
     feedbackConfig: useState("chat-embed-config-feedback-config", () => void 0),
     messageFeedback: useState("chat-embed-config-message-feedback", () => void 0)
   };
@@ -38,6 +44,7 @@ export function provideEmbedConfig(input, options = {}) {
     loadingMessagesMode: computed(() => toValue(input.loadingMessagesMode)),
     customComponents: computed(() => toValue(input.customComponents)),
     customHtmlTags: computed(() => toValue(input.customHtmlTags)),
+    citations: computed(() => toValue(input.citations)),
     feedbackConfig: computed(() => toValue(input.feedbackConfig)),
     messageFeedback: computed(() => toValue(input.messageFeedback))
   };
@@ -57,6 +64,7 @@ export function provideEmbedConfig(input, options = {}) {
       globalConfig.loadingMessagesMode.value = config.loadingMessagesMode.value;
       globalConfig.customComponents.value = config.customComponents.value;
       globalConfig.customHtmlTags.value = config.customHtmlTags.value;
+      globalConfig.citations.value = config.citations.value;
       globalConfig.feedbackConfig.value = config.feedbackConfig.value;
       globalConfig.messageFeedback.value = config.messageFeedback.value;
     });
@@ -83,6 +91,7 @@ export function useEmbedConfig() {
     loadingMessagesMode: computed(() => globalConfig.loadingMessagesMode.value),
     customComponents: computed(() => globalConfig.customComponents.value),
     customHtmlTags: computed(() => globalConfig.customHtmlTags.value),
+    citations: computed(() => globalConfig.citations.value),
     feedbackConfig: computed(() => globalConfig.feedbackConfig.value),
     messageFeedback: computed(() => globalConfig.messageFeedback.value)
   };

package/dist/runtime/embed/types.d.ts

@@ -4,6 +4,7 @@ import type { TelaAgentExecutionInput } from '../types/schemas/integrations/tela
 import type { ConversationCreatorFilter } from '../types/schemas/chat/primitives.js';
 import type { ChatLoadingMessageMode } from './loading-messages.js';
 import type { ChatFeatureConfig } from './feature-config.js';
+import type { ChatCitationsConfig } from '../citations/types.js';
 import type { MessageFeedbackConfig, MessageFeedbackRating } from '../messages/composables/chat-feedback.js';
 export type ChatActor = {
     name?: string | null;
@@ -44,7 +45,11 @@ export type ChatEmbedSharedProps = {
     sidebar?: ChatSidebarConfig;
     /** Hide workspace settings actions while keeping the chat header and content unchanged. */
     hideSettings?: boolean;
-    /** Hide the folder onboarding hint while keeping folder creation actions available. */
+    /**
+     * Hide the empty-state folder onboarding block (PASTAS header, ghost rows, hint
+     * text and inline create button). Folder creation stays available through the
+     * new-group button in the sidebar header.
+     */
     hideFolderHint?: boolean;
     /** Custom pending-response messages shown while the assistant is working. */
     loadingMessages?: readonly string[] | null;
@@ -54,6 +59,12 @@ export type ChatEmbedSharedProps = {
     customComponents?: Record<string, Component>;
     /** Extra HTML tags allowed by the markdown renderer. */
     customHtmlTags?: readonly string[];
+    /**
+     * Enables `cite://` citations in assistant messages. The host resolves each
+     * citation against its own backend (carrying the viewing user's authorization);
+     * the lib renders chips, the metadata popover and the document panel.
+     */
+    citations?: ChatCitationsConfig | null;
     /**
      * Enables 👍/👎 feedback on assistant messages and configures the reason
      * popovers. Providing the prop (even `{}`) shows the controls; votes reach

package/dist/runtime/files/components/chat-vault-link.vue

@@ -1,11 +1,19 @@
 <script setup>
+import { parseCitationUrl } from "../../citations/citation-links";
+import { useEmbedConfig } from "../../embed/composables/embed-config";
 import { detectFileFromUrl } from "../content-detection";
 const props = defineProps({
   node: { type: Object, required: true },
   indexKey: { type: [Number, String], required: true },
   customId: { type: String, required: false }
 });
+const embedConfig = useEmbedConfig();
 const detectedFile = computed(() => detectFileFromUrl(props.node.href));
+const detectedCitation = computed(() => {
+  if (!embedConfig?.citations.value)
+    return null;
+  return parseCitationUrl(props.node.href);
+});
 const linkText = computed(() => {
   if (props.node.children?.length > 0) {
     return props.node.children.map((c) => c.raw).join("");
@@ -23,6 +31,11 @@ const linkText = computed(() => {
         w-full
         my-4px
     />
+    <ChatCitation
+        v-else-if="detectedCitation"
+        :citation="detectedCitation"
+        :label="linkText"
+    />
     <a
         v-else
         :href="node.href"

package/dist/runtime/files/content-detection.d.ts

@@ -1,3 +1,4 @@
+import { type CitationRef } from '../citations/citation-links.js';
 import { type VaultHashParams } from './vault-links.js';
 export type DetectedFile = {
     type: 'vault' | 'url';
@@ -12,7 +13,14 @@ export type ContentSegment = {
 } | {
     type: 'file';
     file: DetectedFile;
+} | {
+    type: 'citation';
+    citation: CitationRef;
+};
+export type ParseContentOptions = {
+    /** Detect bare `cite://` tokens as citation segments. Off by default: only hosts that configured citations opt in. */
+    detectCitations?: boolean;
 };
 export declare function detectFilesInText(text: string): DetectedFile[];
-export declare function parseContentWithFiles(text: string): ContentSegment[];
+export declare function parseContentWithFiles(text: string, options?: ParseContentOptions): ContentSegment[];
 export declare function detectFileFromUrl(url: string): DetectedFile | null;

package/dist/runtime/files/content-detection.js

@@ -1,3 +1,4 @@
+import { CITE_REGEX, parseCitationUrl } from "../citations/citation-links.js";
 import { getExtensionFromUrl, getMimeTypeFromExtension, isFileUrl } from "./mime.js";
 import {
   getPermalinkId,
@@ -128,7 +129,7 @@ export function detectFilesInText(text) {
   }
   return files;
 }
-export function parseContentWithFiles(text) {
+export function parseContentWithFiles(text, options) {
   const segments = [];
   const fileMatches = collectMarkdownFileLinkMatches(text);
   for (const match of text.matchAll(VAULT_REGEX)) {
@@ -198,18 +199,38 @@ export function parseContentWithFiles(text) {
       });
     }
   }
-  if (fileMatches.length === 0)
+  const matches = fileMatches.map((fm) => ({
+    start: fm.start,
+    end: fm.end,
+    segment: { type: "file", file: fm.file }
+  }));
+  if (options?.detectCitations) {
+    for (const match of text.matchAll(CITE_REGEX)) {
+      const url = stripTrailingPunctuation(match[0]);
+      if (overlapsFileMatch(match.index, match.index + url.length, fileMatches))
+        continue;
+      const citation = parseCitationUrl(url);
+      if (!citation)
+        continue;
+      matches.push({
+        start: match.index,
+        end: match.index + url.length,
+        segment: { type: "citation", citation }
+      });
+    }
+  }
+  if (matches.length === 0)
     return [{ type: "text", content: text }];
-  fileMatches.sort((a, b) => a.start - b.start);
+  matches.sort((a, b) => a.start - b.start);
   let lastEnd = 0;
-  for (const fm of fileMatches) {
-    if (fm.start > lastEnd) {
-      const textContent = text.slice(lastEnd, fm.start);
+  for (const m of matches) {
+    if (m.start > lastEnd) {
+      const textContent = text.slice(lastEnd, m.start);
       if (textContent)
         segments.push({ type: "text", content: textContent });
     }
-    segments.push({ type: "file", file: fm.file });
-    lastEnd = fm.end;
+    segments.push(m.segment);
+    lastEnd = m.end;
   }
   if (lastEnd < text.length) {
     const textContent = text.slice(lastEnd);

package/dist/runtime/messages/components/chat-message-bubble.vue

@@ -98,9 +98,9 @@ const contentSegments = computed(() => {
   const content = displayContent.value;
   if (!content)
     return [];
-  return parseContentWithFiles(content);
+  return parseContentWithFiles(content, { detectCitations: Boolean(embedConfig?.citations.value) });
 });
-const hasDetectedFiles = computed(() => contentSegments.value.some((s) => s.type === "file"));
+const hasDetectedFiles = computed(() => contentSegments.value.some((s) => s.type !== "text"));
 </script>
 
 <template>
@@ -258,13 +258,17 @@ const hasDetectedFiles = computed(() => contentSegments.value.some((s) => s.type
                                 />
                             </ClientOnly>
                             <ChatFilePreview
-                                v-else
+                                v-else-if="segment.type === 'file'"
                                 :file="segment.file"
                                 inline-block
                                 align-middle
                                 w-full
                                 my-4px
                             />
+                            <ChatCitation
+                                v-else
+                                :citation="segment.citation"
+                            />
                         </template>
                     </div>
                     <ClientOnly v-else>

package/dist/runtime/types/citations.d.ts

@@ -0,0 +1 @@
+export type { ChatCitationsConfig, CitationDocument, CitationLocator, CitationMeta, CitationOccurrence, CitationRef, CitationStatus, } from '../citations/types.js';

package/dist/runtime/types/embed.d.ts

@@ -1,3 +1,4 @@
+export type { ChatCitationsConfig, CitationMeta, CitationRef, } from '../citations/types.js';
 export type { ChatFeatureConfig } from '../embed/feature-config.js';
 export type { ChatActor, ChatEmbedSharedProps, ChatSidebarConfig, DefaultChatEmbedProps, MeistrariChatEmbedProps, TelaAgentChatEmbedProps, } from '../embed/types.js';
 export type { ChatActionPayload } from '../messages/composables/chat-action.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@meistrari/chat-nuxt",
-  "version": "3.7.0",
+  "version": "3.8.0",
   "type": "module",
   "exports": {
     ".": {