npm - vue-agent-start - Versions diffs - 0.1.0 - Mend

vue-agent-start 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (169) hide show

package/package.json +30 -0
package/pnpm-workspace.yaml +3 -0
package/src/agent-flow/adapter/backend.ts +99 -0
package/src/agent-flow/components/ChatIframePanel.vue +773 -0
package/src/agent-flow/components/DatasetItemCard.vue +313 -0
package/src/agent-flow/components/MemoryWindow.vue +104 -0
package/src/agent-flow/components/PromptEditor.vue +804 -0
package/src/agent-flow/components/PromptEditorTagPanel.vue +460 -0
package/src/agent-flow/components/SvgIcon.vue +32 -0
package/src/agent-flow/components/ToolItemCard.vue +169 -0
package/src/agent-flow/components/VariableCard.vue +161 -0
package/src/agent-flow/components/VariableSelector.vue +162 -0
package/src/agent-flow/components/chat-iframe-types.ts +35 -0
package/src/agent-flow/components/stubs/DatasetChooser.vue +70 -0
package/src/agent-flow/components/stubs/Embedding.vue +22 -0
package/src/agent-flow/components/stubs/ModelSelect.vue +24 -0
package/src/agent-flow/components/stubs/RestfulSelectCard.vue +24 -0
package/src/agent-flow/components/stubs/ToolChooser.vue +96 -0
package/src/agent-flow/components/stubs/TriggersItemCard.vue +126 -0
package/src/agent-flow/components/stubs/VariableModal.vue +115 -0
package/src/agent-flow/index.ts +73 -0
package/src/agent-flow/stores/workflow.ts +72 -0
package/src/agent-flow/utils/langUtils.ts +173 -0
package/src/agent-flow/workflow/Ability.vue +65 -0
package/src/agent-flow/workflow/AuthorizationItem.vue +101 -0
package/src/agent-flow/workflow/ConversationVar.vue +42 -0
package/src/agent-flow/workflow/CustomEdge.vue +94 -0
package/src/agent-flow/workflow/EnvironmentVar.vue +40 -0
package/src/agent-flow/workflow/FlowDesigner.vue +2802 -0
package/src/agent-flow/workflow/Icon.vue +179 -0
package/src/agent-flow/workflow/NodeConfig.vue +509 -0
package/src/agent-flow/workflow/NodeConfigCard.vue +460 -0
package/src/agent-flow/workflow/NodeHandle.vue +147 -0
package/src/agent-flow/workflow/NodeHeaderToolbar.vue +77 -0
package/src/agent-flow/workflow/NodeHoverToolbar.vue +176 -0
package/src/agent-flow/workflow/OutputItemCard.vue +668 -0
package/src/agent-flow/workflow/ParamTableItem.vue +200 -0
package/src/agent-flow/workflow/StructTable.vue +202 -0
package/src/agent-flow/workflow/VarInsertField.vue +517 -0
package/src/agent-flow/workflow/VarSelectField.vue +223 -0
package/src/agent-flow/workflow/VariableSelectorItem.vue +48 -0
package/src/agent-flow/workflow/WfField.vue +206 -0
package/src/agent-flow/workflow/_config-base.css +470 -0
package/src/agent-flow/workflow/composables/useNode.js +55 -0
package/src/agent-flow/workflow/index.vue +53 -0
package/src/agent-flow/workflow/nodeCard/AgentNodeCard.vue +180 -0
package/src/agent-flow/workflow/nodeCard/AnswerNodeCard.vue +65 -0
package/src/agent-flow/workflow/nodeCard/ClassifierCard.vue +152 -0
package/src/agent-flow/workflow/nodeCard/CodeNodeCard.vue +139 -0
package/src/agent-flow/workflow/nodeCard/ConditionNodeCard.vue +323 -0
package/src/agent-flow/workflow/nodeCard/DocumentExtractorCard.vue +83 -0
package/src/agent-flow/workflow/nodeCard/EndNodeCard.vue +123 -0
package/src/agent-flow/workflow/nodeCard/HttpNodeCard.vue +451 -0
package/src/agent-flow/workflow/nodeCard/HumanInputCard.vue +152 -0
package/src/agent-flow/workflow/nodeCard/IterationCard.vue +66 -0
package/src/agent-flow/workflow/nodeCard/KnowledgeRetrievalCard.vue +48 -0
package/src/agent-flow/workflow/nodeCard/LLMNodeCard.vue +206 -0
package/src/agent-flow/workflow/nodeCard/ListOperatorCard.vue +188 -0
package/src/agent-flow/workflow/nodeCard/ParameterExtractorCard.vue +352 -0
package/src/agent-flow/workflow/nodeCard/ServiceApiNodeCard.vue +188 -0
package/src/agent-flow/workflow/nodeCard/StartNodeCard.vue +216 -0
package/src/agent-flow/workflow/nodeCard/VariableAssignerCard.vue +125 -0
package/src/agent-flow/workflow/nodeCard/VariableNodeCard.vue +121 -0
package/src/agent-flow/workflow/nodes/AgentNode.vue +122 -0
package/src/agent-flow/workflow/nodes/AnswerNode.vue +99 -0
package/src/agent-flow/workflow/nodes/ClassifierNode.vue +199 -0
package/src/agent-flow/workflow/nodes/CodeNode.vue +152 -0
package/src/agent-flow/workflow/nodes/ConditionNode.vue +232 -0
package/src/agent-flow/workflow/nodes/DocumentExtractorNode.vue +96 -0
package/src/agent-flow/workflow/nodes/EndNode.vue +119 -0
package/src/agent-flow/workflow/nodes/FileUploadNode.vue +97 -0
package/src/agent-flow/workflow/nodes/HttpNode.vue +204 -0
package/src/agent-flow/workflow/nodes/HumanInputNode.vue +110 -0
package/src/agent-flow/workflow/nodes/IterationNode.vue +98 -0
package/src/agent-flow/workflow/nodes/KnowledgeRetrievalNode.vue +253 -0
package/src/agent-flow/workflow/nodes/LLMNode.vue +134 -0
package/src/agent-flow/workflow/nodes/ListOperatorNode.vue +111 -0
package/src/agent-flow/workflow/nodes/LoopNode.vue +94 -0
package/src/agent-flow/workflow/nodes/ParameterExtractorNode.vue +147 -0
package/src/agent-flow/workflow/nodes/ServiceApiNode.vue +161 -0
package/src/agent-flow/workflow/nodes/StartNode.vue +199 -0
package/src/agent-flow/workflow/nodes/TemplateNode.vue +103 -0
package/src/agent-flow/workflow/nodes/UserInputNode.vue +92 -0
package/src/agent-flow/workflow/nodes/VariableAssignerNode.vue +145 -0
package/src/agent-flow/workflow/nodes/VariableNode.vue +130 -0
package/src/agent-flow/workflow/nodes/_node-base.css +338 -0
package/src/agent-flow/workflow/utils/node_card_form.ts +335 -0
package/src/agent-flow/workflow/utils/node_config.ts +63 -0
package/src/agent-flow/workflow/utils/workflow_utils.ts +151 -0
package/src/agent-studio/adapters/springAgentStart.ts +390 -0
package/src/agent-studio/api/index.ts +1 -0
package/src/agent-studio/api/types.ts +173 -0
package/src/agent-studio/components/AgentApiDocs.vue +500 -0
package/src/agent-studio/components/AgentAppsPage.vue +1601 -0
package/src/agent-studio/components/AgentCardGrid.vue +259 -0
package/src/agent-studio/components/AgentChatPage.vue +553 -0
package/src/agent-studio/components/AgentDebugPanel.vue +350 -0
package/src/agent-studio/components/AgentLogsPanel.vue +391 -0
package/src/agent-studio/components/AgentMonitorPanel.vue +204 -0
package/src/agent-studio/components/AgentOrchestrate.vue +505 -0
package/src/agent-studio/components/AgentPromptEditor.vue +237 -0
package/src/agent-studio/components/AgentStudioShell.vue +227 -0
package/src/agent-studio/components/AgentToolsPanel.vue +394 -0
package/src/agent-studio/components/AgentVariablesPanel.vue +205 -0
package/src/agent-studio/components/ApiKeyManager.vue +251 -0
package/src/agent-studio/components/AppDesignDrawer.vue +3391 -0
package/src/agent-studio/components/CreateAppModal.vue +737 -0
package/src/agent-studio/components/SparkChart.vue +200 -0
package/src/agent-studio/components/VariableEditorModal.vue +499 -0
package/src/agent-studio/composables/useAgentStudio.ts +347 -0
package/src/agent-studio/index.ts +60 -0
package/src/agent-studio/panels/DrawerFlowDesigner.vue +203 -0
package/src/agent-studio/panels/LogAnnotationPanel.vue +490 -0
package/src/agent-studio/panels/MonitorPanel.vue +535 -0
package/src/agent-studio/types.ts +242 -0
package/src/index.ts +155 -0
package/src/knowledge-hub/adapters/springAgentStart.ts +472 -0
package/src/knowledge-hub/components/AddDocumentsWizard.vue +1452 -0
package/src/knowledge-hub/components/CreateDatasetWizard.vue +1723 -0
package/src/knowledge-hub/components/DatasetCardGrid.vue +467 -0
package/src/knowledge-hub/components/DatasetDetailDrawer.vue +888 -0
package/src/knowledge-hub/components/DatasetPicker.vue +65 -0
package/src/knowledge-hub/components/DatasetPickerModal.vue +526 -0
package/src/knowledge-hub/components/DatasetSettingsPanel.vue +908 -0
package/src/knowledge-hub/components/DatasetSidebar.vue +781 -0
package/src/knowledge-hub/components/DocumentChunksView.vue +802 -0
package/src/knowledge-hub/components/DocumentTable.vue +552 -0
package/src/knowledge-hub/components/HitTestingPanel.vue +74 -0
package/src/knowledge-hub/components/KnowledgeApp.vue +66 -0
package/src/knowledge-hub/components/KnowledgeHubApp.vue +504 -0
package/src/knowledge-hub/components/RecallTestingPanelV2.vue +515 -0
package/src/knowledge-hub/components/RetrievalConfigPopover.vue +270 -0
package/src/knowledge-hub/components/RetrievalMethodPicker.vue +547 -0
package/src/knowledge-hub/components/RetrievedList.vue +24 -0
package/src/knowledge-hub/components/internal/KhDialog.vue +195 -0
package/src/knowledge-hub/composables/useKnowledge.ts +89 -0
package/src/knowledge-hub/i18n/index.ts +2 -0
package/src/knowledge-hub/i18n/messages.ts +422 -0
package/src/knowledge-hub/i18n/useKhI18n.ts +107 -0
package/src/knowledge-hub/index.ts +46 -0
package/src/knowledge-hub/styles/index.css +4 -0
package/src/knowledge-hub/styles/tokens.css +138 -0
package/src/knowledge-hub/types/api.ts +213 -0
package/src/knowledge-hub/types/dataset.ts +88 -0
package/src/knowledge-hub/types/document.ts +45 -0
package/src/knowledge-hub/types/index.ts +9 -0
package/src/knowledge-hub/types/retrieval.ts +46 -0
package/src/provider-hub/components/CredentialForm.vue +103 -0
package/src/provider-hub/components/DefaultModelsPanel.vue +270 -0
package/src/provider-hub/components/GroupedModelSelect.vue +445 -0
package/src/provider-hub/components/ModelCardGrid.vue +332 -0
package/src/provider-hub/components/ModelParameterDrawer.vue +739 -0
package/src/provider-hub/components/ModelPickerPopover.vue +1282 -0
package/src/provider-hub/components/ProviderApp.vue +159 -0
package/src/provider-hub/components/ProviderCredentialModal.vue +321 -0
package/src/provider-hub/components/ProviderGallery.vue +131 -0
package/src/provider-hub/components/ProviderHubShell.vue +1992 -0
package/src/provider-hub/components/ProviderIcon.vue +130 -0
package/src/provider-hub/composables/useProviderHub.ts +358 -0
package/src/provider-hub/index.ts +43 -0
package/src/provider-hub/svg/MiniMax.svg +1 -0
package/src/provider-hub/svg/Volcengine.svg +1 -0
package/src/provider-hub/svg/Zhipu.svg +1 -0
package/src/provider-hub/svg/deepseek.svg +1 -0
package/src/provider-hub/svg/moonshot.svg +1 -0
package/src/provider-hub/svg/openai.svg +1 -0
package/src/provider-hub/svg/qwen.svg +1 -0
package/src/provider-hub/svg/siliconflow.svg +1 -0
package/src/provider-hub/types.ts +256 -0

package/src/knowledge-hub/components/RecallTestingPanelV2.vue ADDED Viewed

@@ -0,0 +1,515 @@
+<script setup lang="ts">
+/**
+ * RecallTestingPanelV2 — Dify-parity 召回测试 tab (screenshot 5).
+ *
+ * The 检索设置 lives in a floating {@link RetrievalConfigPopover} anchored to
+ * the top-right method button of the query textarea. Everything the popover
+ * carries (method + rerank + TopK + score threshold) round-trips through a
+ * single {@link RetrievalConfig} v-model, matching the shape the wizard and
+ * the settings panel already speak.
+ */
+import { computed, ref } from 'vue';
+import type { RecallHit, RecentQuery } from '../types';
+import type {
+  IndexingTechnique,
+  RetrievalConfig,
+} from '../types/dataset';
+import RetrievalConfigPopover from './RetrievalConfigPopover.vue';
+interface Props {
+  hits?: RecallHit[];
+  history?: RecentQuery[];
+  loading?: boolean;
+  /**
+   * Seed for the popover so the panel opens showing the dataset's current
+   * retrieval config, not defaults. Callers typically parse the dataset's
+   * {@code retrievalConfigJson} once and pass it in.
+   */
+  initialConfig?: RetrievalConfig;
+  rerankModels?: Array<{ id: string; label: string }>;
+  indexingTechnique?: IndexingTechnique;
+}
+const props = withDefaults(defineProps<Props>(), {
+  hits: () => [],
+  history: () => [],
+  loading: false,
+  initialConfig: () => ({ method: 'VECTOR', topK: 3 }),
+  rerankModels: () => [],
+});
+const emit = defineEmits<{
+  (
+    e: 'run',
+    payload: { query: string; method: string; config: RetrievalConfig },
+  ): void;
+  (e: 'replay', h: RecentQuery): void;
+}>();
+const query = ref('');
+const config = ref<RetrievalConfig>({ ...props.initialConfig });
+const methodLabel = computed(() => {
+  if (config.value.method === 'HYBRID') return '混合检索';
+  if (config.value.method === 'FULL_TEXT') return '全文检索';
+  return '向量检索';
+});
+const methodIcon = computed(() => {
+  if (config.value.method === 'HYBRID') return '⚡';
+  if (config.value.method === 'FULL_TEXT') return '≡';
+  return '◈';
+});
+const charCount = computed(() => query.value.length);
+const canRun = computed(() => query.value.trim().length > 0);
+// Popover trigger anchor + open state.
+const methodBtnRef = ref<HTMLElement | null>(null);
+const popoverOpen = ref(false);
+function toggleConfig() {
+  popoverOpen.value = !popoverOpen.value;
+}
+function run() {
+  if (!canRun.value) return;
+  emit('run', {
+    query: query.value,
+    method: config.value.method ?? 'VECTOR',
+    config: { ...config.value },
+  });
+}
+function replay(h: RecentQuery) {
+  query.value = h.query;
+  emit('replay', h);
+}
+</script>
+<template>
+  <div class="kh-recall">
+    <div class="kh-recall-header">
+      <div class="kh-recall-title">召回测试</div>
+      <div class="kh-recall-sub">根据给定的查询文本测试知识的召回效果。</div>
+    </div>
+    <div class="kh-recall-body">
+      <!-- LEFT -->
+      <div class="kh-recall-left">
+        <div class="kh-recall-input-wrap">
+          <div class="kh-recall-input-toolbar">
+            <span class="kh-recall-input-label">源文本</span>
+            <!-- 混合检索 icon button — opens the popover-style 检索设置 card.
+                 The button is only the anchor; the card is Teleport'd to <body>
+                 in RetrievalConfigPopover so it can float over anything. -->
+            <button
+              ref="methodBtnRef"
+              class="kh-recall-mode-btn"
+              @click="toggleConfig"
+            >
+              <span class="kh-recall-mode-icon">{{ methodIcon }}</span>
+              <span>{{ methodLabel }}</span>
+              <span class="kh-recall-mode-caret">▾</span>
+            </button>
+          </div>
+          <textarea
+            v-model="query"
+            class="kh-recall-textarea"
+            placeholder="请输入文本，建议使用简短的陈述句。"
+            maxlength="500"
+          />
+          <div class="kh-recall-input-footer">
+            <span class="kh-recall-char-count">
+              {{ charCount }}/500
+            </span>
+            <button
+              class="kh-btn kh-btn-primary"
+              :disabled="!canRun || loading"
+              @click="run"
+            >
+              测试
+            </button>
+          </div>
+        </div>
+        <!-- 记录 -->
+        <div class="kh-recall-history">
+          <div class="kh-recall-history-title">记录</div>
+          <div v-if="history.length === 0" class="kh-recall-history-empty">
+            <div class="kh-recall-empty-icon-wrap">
+              <div class="kh-recall-empty-clock">🕐</div>
+            </div>
+            <div class="kh-recall-empty-text">最近无查询结果</div>
+          </div>
+          <div v-else class="kh-recall-history-list">
+            <div
+              v-for="h in history"
+              :key="h.id"
+              class="kh-recall-history-row"
+              @click="replay(h)"
+            >
+              <span class="kh-recall-history-method">{{ h.method }}</span>
+              <span class="kh-recall-history-query">{{ h.query }}</span>
+              <span class="kh-recall-history-count">{{ h.hitCount }} 命中</span>
+              <span class="kh-recall-history-at">{{ h.at }}</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <!-- RIGHT — hit results always render their title at the very top so the
+           panel doesn't waste the upper half on whitespace. Empty / loading /
+           populated states now share the same anchor. -->
+      <div class="kh-recall-right">
+        <div class="kh-recall-results-title">
+          命中片段
+          <span v-if="hits.length > 0" class="kh-recall-results-count">
+            · {{ hits.length }} 个
+          </span>
+        </div>
+        <div v-if="hits.length === 0" class="kh-recall-right-empty">
+          <div class="kh-recall-empty-target">🎯</div>
+          <div class="kh-recall-empty-hint">召回测试结果显示在这里</div>
+        </div>
+        <div v-else class="kh-recall-results">
+          <div
+            v-for="(hit, i) in hits"
+            :key="hit.segmentId"
+            class="kh-recall-hit"
+          >
+            <div class="kh-recall-hit-head">
+              <span class="kh-recall-hit-tag">
+                {{ i + 1 }}
+              </span>
+              <span v-if="hit.documentName" class="kh-recall-hit-doc">
+                📄 {{ hit.documentName }}
+              </span>
+              <span class="kh-recall-flex" />
+              <span class="kh-recall-hit-score">
+                综合 {{ hit.score.toFixed(3) }}
+              </span>
+            </div>
+            <div class="kh-recall-hit-body">{{ hit.content }}</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- Floating 检索设置 card — Teleport'd to <body>, positioned against the
+         anchor button. Keeps the panel layout untouched even when open. -->
+    <RetrievalConfigPopover
+      v-model:open="popoverOpen"
+      :trigger-el="methodBtnRef"
+      v-model="config"
+      :rerank-models="rerankModels"
+      :indexing-technique="indexingTechnique"
+    />
+  </div>
+</template>
+<style scoped>
+.kh-recall {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  padding: 14px 24px 20px;
+}
+.kh-recall-header {
+  margin-bottom: 10px;
+}
+.kh-recall-title {
+  font-size: 15px;
+  font-weight: 600;
+  color: #0f172a;
+}
+.kh-recall-sub {
+  margin-top: 2px;
+  font-size: 11px;
+  color: #94a3b8;
+}
+.kh-recall-body {
+  flex: 1;
+  display: grid;
+  /* Give the hit-results side a bit more room — the query editor + history
+     list on the left doesn't need half the width, and the hit cards benefit
+     from extra text width. */
+  grid-template-columns: minmax(340px, 5fr) minmax(0, 7fr);
+  gap: 20px;
+  overflow: hidden;
+}
+/* LEFT */
+.kh-recall-left {
+  display: flex;
+  flex-direction: column;
+  gap: 22px;
+  min-width: 0;
+}
+.kh-recall-input-wrap {
+  border: 1.5px solid #6366f1;
+  border-radius: 10px;
+  padding: 12px 14px;
+  background: #fafbff;
+}
+.kh-recall-input-toolbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 8px;
+}
+.kh-recall-input-label {
+  font-size: 12px;
+  font-weight: 600;
+  color: #334155;
+}
+.kh-recall-mode-btn-wrap {
+  position: relative;
+}
+.kh-recall-mode-btn {
+  padding: 4px 10px;
+  border: 1px solid #e2e8f0;
+  border-radius: 6px;
+  background: #fff;
+  font-size: 11px;
+  color: #475569;
+  cursor: pointer;
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+}
+.kh-recall-mode-btn:hover {
+  border-color: #cbd5e1;
+}
+.kh-recall-mode-icon {
+  color: #4338ca;
+}
+.kh-recall-mode-caret {
+  font-size: 9px;
+  color: #94a3b8;
+}
+.kh-recall-mode-menu {
+  position: absolute;
+  right: 0;
+  top: 30px;
+  z-index: 20;
+  min-width: 160px;
+  padding: 4px;
+  background: #fff;
+  border: 1px solid #e2e8f0;
+  border-radius: 8px;
+  box-shadow: 0 6px 20px rgba(15, 23, 42, 0.1);
+}
+.kh-recall-mode-item {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 10px;
+  border-radius: 4px;
+  font-size: 12px;
+  color: #475569;
+  cursor: pointer;
+}
+.kh-recall-mode-item:hover {
+  background: #f8fafc;
+}
+.kh-recall-mode-item-active {
+  background: #eef2ff;
+  color: #4338ca;
+}
+.kh-recall-textarea {
+  width: 100%;
+  min-height: 140px;
+  padding: 8px 4px;
+  border: none;
+  outline: none;
+  resize: vertical;
+  background: transparent;
+  font-family: inherit;
+  font-size: 13px;
+  color: #0f172a;
+  line-height: 1.55;
+}
+.kh-recall-textarea::placeholder {
+  color: #94a3b8;
+}
+.kh-recall-input-footer {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-top: 8px;
+}
+.kh-recall-char-count {
+  font-size: 11px;
+  color: #94a3b8;
+}
+.kh-btn {
+  padding: 6px 20px;
+  border: none;
+  border-radius: 6px;
+  font-size: 12px;
+  font-weight: 500;
+  cursor: pointer;
+}
+.kh-btn-primary {
+  background: linear-gradient(135deg, #6366f1, #4f46e5);
+  color: #fff;
+}
+.kh-btn-primary:disabled {
+  background: #cbd5e1;
+  cursor: not-allowed;
+}
+/* History */
+.kh-recall-history-title {
+  font-size: 13px;
+  font-weight: 600;
+  color: #334155;
+  margin-bottom: 10px;
+}
+.kh-recall-history-empty {
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 8px;
+}
+.kh-recall-empty-icon-wrap {
+  width: 42px;
+  height: 42px;
+  border-radius: 10px;
+  background: #f8fafc;
+  border: 1px solid #e2e8f0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+.kh-recall-empty-clock {
+  font-size: 18px;
+  color: #94a3b8;
+}
+.kh-recall-empty-text {
+  font-size: 11px;
+  color: #94a3b8;
+}
+.kh-recall-history-list {
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+}
+.kh-recall-history-row {
+  display: grid;
+  grid-template-columns: 60px 1fr auto auto;
+  gap: 8px;
+  padding: 6px 8px;
+  border-radius: 6px;
+  cursor: pointer;
+  font-size: 11px;
+  align-items: center;
+}
+.kh-recall-history-row:hover {
+  background: #f8fafc;
+}
+.kh-recall-history-method {
+  padding: 1px 6px;
+  border-radius: 4px;
+  background: #eef2ff;
+  color: #4338ca;
+  font-size: 10px;
+  text-align: center;
+}
+.kh-recall-history-query {
+  color: #334155;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.kh-recall-history-count {
+  color: #64748b;
+}
+.kh-recall-history-at {
+  color: #94a3b8;
+}
+/* RIGHT — anchored to the top so both empty and populated states share the
+   same starting line as the query editor on the left. */
+.kh-recall-right {
+  min-width: 0;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  padding: 4px 4px 8px;
+  background: #f8fafc;
+  border: 1px solid #f1f5f9;
+  border-radius: 10px;
+}
+.kh-recall-results-title {
+  padding: 10px 12px 6px;
+  font-size: 12px;
+  font-weight: 600;
+  color: #334155;
+}
+.kh-recall-results-count {
+  color: #94a3b8;
+  font-weight: 400;
+}
+.kh-recall-right-empty {
+  padding: 32px 12px 40px;
+  text-align: center;
+  color: #94a3b8;
+}
+.kh-recall-empty-target {
+  font-size: 38px;
+  opacity: 0.5;
+}
+.kh-recall-empty-hint {
+  margin-top: 10px;
+  font-size: 12px;
+  color: #94a3b8;
+}
+.kh-recall-results {
+  width: 100%;
+  padding: 0 10px 6px;
+}
+.kh-recall-hit {
+  padding: 10px 12px;
+  margin-bottom: 8px;
+  background: #fff;
+  border: 1px solid #e2e8f0;
+  border-radius: 8px;
+}
+.kh-recall-hit-head {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  font-size: 11px;
+  color: #64748b;
+  margin-bottom: 8px;
+}
+.kh-recall-hit-tag {
+  padding: 2px 8px;
+  background: #4338ca;
+  color: #fff;
+  border-radius: 4px;
+  font-weight: 600;
+  font-size: 10px;
+}
+.kh-recall-hit-doc {
+  color: #4338ca;
+}
+.kh-recall-hit-score {
+  color: #b45309;
+  font-weight: 600;
+}
+.kh-recall-flex {
+  flex: 1;
+}
+.kh-recall-hit-body {
+  font-size: 12px;
+  color: #334155;
+  line-height: 1.55;
+}
+</style>