@openviking/react 0.1.2 → 0.1.4

package/dist/components/file-tree/file-tree-row-shared.d.ts

@@ -1,9 +1,6 @@
-/** 每一级缩进与祖先连线的宽度。Indent per level, and the guide through it. */
-export declare const INDENT = 20;
-export declare const CHEVRON_SIZE = 16;
 /** 行按深度缩进。Indents a row by its depth. */
 export declare function rowStyle(depth: number): {
-    paddingLeft: number;
+    paddingLeft: string;
 };
 /** 每一级祖先画一条竖线，上下各溢出 1px 让相邻行接上。 */
 export declare function Guides({ depth }: {

package/dist/components/file-tree/file-tree-toolbar.d.ts

@@ -0,0 +1,11 @@
+import type { ResolvedLabels } from './file-tree-row-context.js';
+import type { FileTreeProps } from './types.js';
+type ToolbarProps = Pick<FileTreeProps, 'search' | 'refresh'> & {
+    text: ResolvedLabels;
+    refreshing: boolean;
+    onSearch?: () => void;
+    onRefresh?: () => void;
+};
+/** Optional host-driven search and refresh controls; no data fetching here. */
+export declare function FileTreeToolbar({ search, refresh, text, refreshing, onSearch, onRefresh, }: ToolbarProps): import("react").JSX.Element | null;
+export {};

package/dist/components/file-tree/file-tree-tooltip-surface.d.ts

@@ -1,22 +1,22 @@
 import type { ReactNode } from 'react';
 import type { FileTreeEntryRow, FileTreeInfoLabels } from './types.js';
 /**
- * 行浮层的外壳。宿主提供 `renderRowTooltip` 时只渲染它返回的内容；它返回 `null`
+ * 行浮层的内容。宿主提供 `renderRowTooltip` 时只渲染它返回的内容；它返回 `null`
  * 表示这一行不显示浮层，不回退到内置内容。
  *
- * 宿主没有提供时，用按 `uri` 解析的内置浮层。先解析内容、再决定是否创建外壳，
+ * 宿主没有提供时，用按 `uri` 解析的内置内容。先解析内容、再决定是否渲染，
  * 因此没有可显示内容时不会留下一个只有背景和内边距的空壳。
  *
- * The shell around a row tooltip. When the host supplies `renderRowTooltip`, only
- * its result renders; returning `null` hides the tooltip for that row and does
+ * The content of a row surface. When the host supplies `renderRowTooltip`, only
+ * its result renders; returning `null` hides the surface for that row and does
  * not fall back to the built-in content.
  *
- * When the host supplies none, the built-in tooltip resolved from the row `uri`
- * renders. The content is resolved before the shell is created, so with nothing
+ * When the host supplies none, the built-in content resolved from the row `uri`
+ * renders. The content is resolved before anything is rendered, so with nothing
  * to show no empty shell with just background and padding is left behind.
  */
-export declare function FileTreeTooltipSurface({ row, infoLabels, renderRowTooltip, }: {
+export declare function FileTreeTooltipContent({ row, infoLabels, renderRowTooltip, }: {
     row: FileTreeEntryRow;
     infoLabels?: FileTreeInfoLabels;
     renderRowTooltip?: (row: FileTreeEntryRow) => ReactNode;
-}): import("react").JSX.Element | null;
+}): ReactNode;

package/dist/components/file-tree/locales/en-US.d.ts

@@ -0,0 +1,69 @@
+declare const messages: {
+    search: string;
+    refresh: string;
+    empty: string;
+    error: string;
+    retry: string;
+    loadMore: string;
+    loading: string;
+    expand: string;
+    collapse: string;
+    info: {
+        description: {
+            userRoot: string;
+            memories: string;
+            peers: string;
+            privacy: string;
+            userResources: string;
+            sessions: string;
+            skills: string;
+            profile: string;
+            preferences: string;
+            entities: string;
+            events: string;
+            identity: string;
+            soul: string;
+            cases: string;
+            trajectories: string;
+            experiences: string;
+            sharedResources: string;
+            agentRoot: string;
+            agentEndpoints: string;
+            agentPayments: string;
+            agentSkills: string;
+            agentTools: string;
+            memoryRoot: string;
+            resourceRoot: string;
+            sessionRoot: string;
+            systemRoot: string;
+        };
+        triggerBehavior: {
+            userRoot: string;
+            memories: string;
+            peers: string;
+            userResources: string;
+            sessions: string;
+            skills: string;
+            profile: string;
+            preferences: string;
+            entities: string;
+            events: string;
+            identity: string;
+            soul: string;
+            cases: string;
+            trajectories: string;
+            experiences: string;
+            sharedResources: string;
+            agentEndpoints: string;
+            agentPayments: string;
+            agentSkills: string;
+            agentTools: string;
+        };
+        field: {
+            description: string;
+            triggerBehavior: string;
+            path: string;
+        };
+    };
+};
+export default messages;

package/dist/components/file-tree/locales/zh-CN.d.ts

@@ -0,0 +1,69 @@
+declare const messages: {
+    search: string;
+    refresh: string;
+    empty: string;
+    error: string;
+    retry: string;
+    loadMore: string;
+    loading: string;
+    expand: string;
+    collapse: string;
+    info: {
+        description: {
+            userRoot: string;
+            memories: string;
+            peers: string;
+            privacy: string;
+            userResources: string;
+            sessions: string;
+            skills: string;
+            profile: string;
+            preferences: string;
+            entities: string;
+            events: string;
+            identity: string;
+            soul: string;
+            cases: string;
+            trajectories: string;
+            experiences: string;
+            sharedResources: string;
+            agentRoot: string;
+            agentEndpoints: string;
+            agentPayments: string;
+            agentSkills: string;
+            agentTools: string;
+            memoryRoot: string;
+            resourceRoot: string;
+            sessionRoot: string;
+            systemRoot: string;
+        };
+        triggerBehavior: {
+            userRoot: string;
+            memories: string;
+            peers: string;
+            userResources: string;
+            sessions: string;
+            skills: string;
+            profile: string;
+            preferences: string;
+            entities: string;
+            events: string;
+            identity: string;
+            soul: string;
+            cases: string;
+            trajectories: string;
+            experiences: string;
+            sharedResources: string;
+            agentEndpoints: string;
+            agentPayments: string;
+            agentSkills: string;
+            agentTools: string;
+        };
+        field: {
+            description: string;
+            triggerBehavior: string;
+            path: string;
+        };
+    };
+};
+export default messages;

package/dist/components/file-tree/style.css

@@ -1,7 +1,11 @@
-.ov-agent-connect, .ov-file-browser, .ov-file-preview, .ov-file-tree, .ov-module-placeholder, .ov-scope-switcher, .ov-tooltip, .ov-tui, .ov-viking-bot, .ov-viking-bot__interaction {
+.ov-directory-tour, .ov-agent-connect, .ov-console, .ov-divider, .ov-file-browser-entries, .ov-drawer, .ov-file-browser, .ov-file-preview, .ov-file-tree, .ov-module-placeholder, .ov-popover, .ov-scope-switcher, .ov-tooltip, .ov-tui, .ov-viking-bot, .ov-viking-bot__popover, .ov-viking-bot__reference-picker--mention, .ov-viking-bot__interaction {
+  --ov-ui-tour-shadow-default: 0 15px 35px #0000000d, 0 5px 15px #0000000d;
+  --ov-ui-tour-highlight-default: #5252ff14;
   --ov-ui-primary-default: #5252ff;
   --ov-ui-primary-hover-default: #7075ff;
   --ov-ui-primary-active-default: #3833d2;
+  --ov-ui-primary-disabled-default: #acb4ff;
+  --ov-ui-text-on-primary-default: #fff;
   --ov-ui-primary-light-default: #f5f7ff;
   --ov-ui-connect-glow-warm-default: #ff952b0a;
   --ov-ui-connect-glow-pink-default: #fb4fbc0f;
@@ -19,18 +23,21 @@
   --ov-ui-bg-3-default: #f7f8fd;
   --ov-ui-bg-4-default: #f6f7fa;
   --ov-ui-bg-5-default: #f1f2f9;
+  --ov-ui-code-bg-default: #fbfbfc;
   --ov-ui-status-success-default: #1f9d55;
   --ov-ui-shadow-default: #0f172a;
+  --ov-ui-shadow-control-default: #0000000d;
   --ov-ui-focus-default: #5252ff;
   --ov-ui-fill-hover-default: #f1f2f9;
   --ov-ui-status-error-default: #c43838;
   --ov-ui-warning-default: #b26a00;
   --ov-ui-warning-light-default: #fff0b3;
+  --ov-ui-overlay-default: #0006;
   --ov-ui-tooltip-bg-default: #1f2329;
   --ov-ui-tooltip-text-default: #fff;
 }
 
-.dark .ov-agent-connect, .dark .ov-file-browser, .dark .ov-file-preview, .dark .ov-file-tree, .dark .ov-module-placeholder, .dark .ov-scope-switcher, .dark .ov-tooltip, .dark .ov-tui, .dark .ov-viking-bot, .dark .ov-viking-bot__interaction {
+.dark .ov-directory-tour, .dark .ov-agent-connect, .dark .ov-console, .dark .ov-divider, .dark .ov-file-browser-entries, .dark .ov-drawer, .dark .ov-file-browser, .dark .ov-file-preview, .dark .ov-file-tree, .dark .ov-module-placeholder, .dark .ov-popover, .dark .ov-scope-switcher, .dark .ov-tooltip, .dark .ov-tui, .dark .ov-viking-bot, .dark .ov-viking-bot__popover, .dark .ov-viking-bot__reference-picker--mention, .dark .ov-viking-bot__interaction {
   --ov-ui-primary-default: #5f5fff;
   --ov-ui-primary-hover-default: #7075ff;
   --ov-ui-primary-active-default: #4242ba;
@@ -56,9 +63,14 @@
   --ov-ui-warning-default: #e0a04a;
   --ov-ui-warning-light-default: #3a2f14;
   --ov-ui-tooltip-bg-default: #2a2d33;
+  --ov-ui-overlay-default: #000000a3;
   --ov-ui-tooltip-text-default: #f0f1f3;
 }
 
+.dark .ov-viking-bot {
+  --ov-ui-code-bg-default: var(--ov-ui-bg-3-default);
+}
+
 .ov-agent-connect {
   --ov-ui-connect-card-default: #fbfbfc;
   --ov-ui-connect-tabs-default: #f7f7f9;
@@ -79,22 +91,61 @@
   --ov-ui-connect-notice-default: var(--ov-ui-text-2-default);
 }
 
+.ov-popover {
+  --ov-ui-popover-bg: var(--ov-ui-color-bg-1, var(--ov-ui-bg-1-default, #fff));
+  --ov-ui-popover-text: var(--ov-ui-color-text-1, var(--ov-ui-text-1-default, #0b0b0f));
+  --ov-ui-popover-border: var(--ov-ui-color-border-2, var(--ov-ui-border-2-default, #e1e4f2));
+  z-index: 1000;
+  box-sizing: border-box;
+  border: 1px solid var(--ov-ui-popover-border);
+  background: var(--ov-ui-popover-bg);
+  max-width: 320px;
+  color: var(--ov-ui-popover-text);
+  overflow-wrap: break-word;
+  border-radius: 8px;
+  padding: 12px;
+  font-family: inherit;
+  font-size: 12px;
+  line-height: 20px;
+  animation: .12s ease-out ov-popover-enter;
+  position: fixed;
+  box-shadow: 0 15px 35px -2px #0000000d, 0 5px 15px #0000000d;
+}
+
+@keyframes ov-popover-enter {
+  from {
+    opacity: 0;
+  }
+
+  to {
+    opacity: 1;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ov-popover {
+    animation: none;
+  }
+}
+
 .ov-file-tree {
   --ov-ui-file-tree-row-height: 32px;
   --ov-ui-file-tree-row-radius: 4px;
   --ov-ui-file-tree-indent: 20px;
-  --ov-ui-file-tree-text: var(--ov-ui-color-text-1, var(--ov-ui-text-1-default, #0b0b0f));
-  --ov-ui-file-tree-text-muted: var(--ov-ui-color-text-3, var(--ov-ui-text-3-default, #6e718c));
-  --ov-ui-file-tree-icon: var(--ov-ui-color-text-2, var(--ov-ui-text-2-default, #3f3f51));
-  --ov-ui-file-tree-row-hover: var(--ov-ui-color-bg-5, var(--ov-ui-bg-5-default, #f1f2f9));
-  --ov-ui-file-tree-row-selected: var(--ov-ui-color-bg-4, var(--ov-ui-bg-4-default, #f6f7fa));
-  --ov-ui-file-tree-guide: var(--ov-ui-color-border-2, var(--ov-ui-border-2-default, #e1e4f2));
-  --ov-ui-file-tree-spinner-track: var(--ov-ui-color-border-3, var(--ov-ui-border-3-default, #d7daea));
-  --ov-ui-file-tree-spinner: var(--ov-ui-color-primary, var(--ov-ui-primary-default, #5252ff));
-  --ov-ui-file-tree-action: var(--ov-ui-color-primary, var(--ov-ui-primary-default, #5252ff));
-  --ov-ui-file-tree-warning: var(--ov-ui-color-warning, var(--ov-ui-warning-default, #b26a00));
+  --ov-ui-file-tree-text: var(--ov-ui-color-text-1, var(--ov-ui-text-1-default));
+  --ov-ui-file-tree-text-muted: var(--ov-ui-color-text-3, var(--ov-ui-text-3-default));
+  --ov-ui-file-tree-icon: var(--ov-ui-color-text-3, var(--ov-ui-text-3-default));
+  --ov-ui-file-tree-row-hover: var(--ov-ui-color-bg-5, var(--ov-ui-bg-5-default));
+  --ov-ui-file-tree-row-selected: var(--ov-ui-color-primary-light, var(--ov-ui-primary-light-default));
+  --ov-ui-file-tree-guide: var(--ov-ui-color-border-1, var(--ov-ui-border-1-default));
+  --ov-ui-file-tree-spinner-track: var(--ov-ui-color-border-3, var(--ov-ui-border-3-default));
+  --ov-ui-file-tree-spinner: var(--ov-ui-color-primary, var(--ov-ui-primary-default));
+  --ov-ui-file-tree-action: var(--ov-ui-color-primary, var(--ov-ui-primary-default));
+  --ov-ui-file-tree-warning: var(--ov-ui-color-warning, var(--ov-ui-warning-default));
   box-sizing: border-box;
   min-width: 0;
+  max-width: 100%;
+  height: 100%;
   min-height: 0;
   color: var(--ov-ui-file-tree-text);
   flex-direction: column;
@@ -117,20 +168,29 @@
 
 .ov-file-tree__rows {
   flex-direction: column;
+  width: max-content;
+  min-width: 100%;
   display: flex;
 }
 
 .ov-file-tree__row, .ov-file-tree__state-row {
   box-sizing: border-box;
+  width: max-content;
+  min-width: 100%;
   height: var(--ov-ui-file-tree-row-height);
+  min-height: var(--ov-ui-file-tree-row-height);
   border-radius: var(--ov-ui-file-tree-row-radius);
-  cursor: default;
+  cursor: pointer;
   -webkit-user-select: none;
   user-select: none;
   outline: none;
+  flex: none;
   align-items: center;
-  gap: 4px;
+  gap: 2px;
   padding-right: 8px;
+  font-family: inherit;
+  font-size: 13px;
+  line-height: 20px;
   display: flex;
   position: relative;
 }
@@ -175,6 +235,12 @@
   display: inline-flex;
 }
 
+.ov-file-tree__toggle svg {
+  width: 12px;
+  height: 12px;
+  display: block;
+}
+
 .ov-file-tree__toggle {
   color: var(--ov-ui-file-tree-text-muted);
   cursor: pointer;
@@ -236,25 +302,26 @@
 }
 
 .ov-file-tree__label-group {
-  flex: auto;
+  flex: none;
   align-items: center;
   gap: 8px;
-  min-width: 0;
   display: flex;
-  overflow: hidden;
 }
 
 .ov-file-tree__label {
-  text-overflow: ellipsis;
   white-space: nowrap;
-  overflow: hidden;
+  flex: none;
 }
 
 .ov-file-tree__description {
+  max-width: 200px;
   color: var(--ov-ui-file-tree-text-muted);
+  letter-spacing: .03px;
   text-overflow: ellipsis;
   white-space: nowrap;
-  font-size: 12px;
+  flex: none;
+  font-size: 10px;
+  line-height: 20px;
   overflow: hidden;
 }
 
@@ -287,32 +354,18 @@
   display: inline-flex;
 }
 
-.ov-file-tree__tooltip {
-  z-index: 1;
-  border-radius: var(--ov-ui-file-tree-row-radius);
-  background: var(--ov-ui-color-tooltip-bg, var(--ov-ui-tooltip-bg-default, #1f2329));
-  max-width: 320px;
-  color: var(--ov-ui-color-tooltip-text, var(--ov-ui-tooltip-text-default, #fff));
-  pointer-events: none;
-  padding: 6px 8px;
-  font-size: 12px;
-  line-height: 18px;
-  position: absolute;
-  top: calc(100% + 4px);
-  left: 0;
-}
-
 .ov-file-tree__info {
   flex-direction: column;
-  gap: 4px;
+  gap: 8px;
   display: flex;
 }
 
 .ov-file-tree__info-title {
+  color: var(--ov-ui-file-tree-text);
   word-break: break-all;
   font-size: 13px;
   font-weight: 500;
-  line-height: 20px;
+  line-height: 22px;
 }
 
 .ov-file-tree__info-row {
@@ -322,19 +375,20 @@
 }
 
 .ov-file-tree__info-label {
-  opacity: .65;
+  color: var(--ov-ui-file-tree-text-muted);
   flex: none;
 }
 
 .ov-file-tree__info-value {
-  word-break: break-word;
   min-width: 0;
+  color: var(--ov-ui-file-tree-text);
+  word-break: break-word;
 }
 
 .ov-file-tree__info-path {
-  opacity: .8;
-  word-break: break-all;
   min-width: 0;
+  color: var(--ov-ui-file-tree-text-muted);
+  word-break: break-all;
 }
 
 .ov-file-tree__state-row {
@@ -342,7 +396,7 @@
 }
 
 .ov-file-tree__state-row[data-tone="error"] {
-  color: var(--ov-ui-color-status-error, var(--ov-ui-status-error-default, #c43838));
+  color: var(--ov-ui-color-status-error, var(--ov-ui-status-error-default));
 }
 
 .ov-file-tree__state {
@@ -408,5 +462,116 @@
   }
 }
 
+.ov-file-tree__file-type-icon {
+  color: var(--ov-file-tree-icon-light, var(--ov-ui-file-tree-icon));
+}
+
+.dark .ov-file-tree__file-type-icon {
+  color: var(--ov-file-tree-icon-dark, var(--ov-ui-file-tree-icon));
+}
+
+.ov-file-tree__controls {
+  flex: none;
+  align-items: center;
+  gap: 8px;
+  min-width: 0;
+  padding: 1px 1px 7px;
+  display: flex;
+}
+
+.ov-file-tree__search, .ov-file-tree__refresh {
+  box-sizing: border-box;
+  border: 1px solid var(--ov-ui-color-border-2, var(--ov-ui-border-2-default));
+  background: var(--ov-ui-color-bg-1, var(--ov-ui-bg-1-default));
+  height: 32px;
+  color: var(--ov-ui-file-tree-icon);
+  box-shadow: 0 1px 1px
+    var(--ov-ui-color-shadow-control, var(--ov-ui-shadow-control-default));
+  cursor: pointer;
+  border-radius: 6px;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  margin: 0;
+  padding: 0;
+  font-family: inherit;
+  font-size: 12px;
+  font-weight: 400;
+  line-height: 22px;
+  transition: border-color .16s, background-color .16s;
+  display: inline-flex;
+}
+
+.ov-file-tree__search {
+  min-width: 0;
+  color: var(--ov-ui-file-tree-text-muted);
+  text-align: left;
+  flex: auto;
+  justify-content: flex-start;
+  gap: 4px;
+  padding: 4px 12px;
+}
+
+.ov-file-tree__search svg {
+  flex: none;
+  width: 16px;
+  height: 16px;
+  display: block;
+}
+
+.ov-file-tree__search-label {
+  letter-spacing: .036px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+  overflow: hidden;
+}
+
+.ov-file-tree__refresh {
+  width: 32px;
+}
+
+.ov-file-tree__refresh svg {
+  flex: none;
+  display: block;
+}
+
+.ov-file-tree__search:hover:not(:disabled), .ov-file-tree__refresh:hover:not(:disabled) {
+  border-color: var(--ov-ui-color-border-3, var(--ov-ui-border-3-default));
+}
+
+.ov-file-tree__refresh:hover:not(:disabled) {
+  background: var(--ov-ui-file-tree-row-hover);
+}
+
+.ov-file-tree__search:focus-visible, .ov-file-tree__refresh:focus-visible {
+  outline: 2px solid var(--ov-ui-file-tree-action);
+  outline-offset: 2px;
+}
+
+.ov-file-tree__search:disabled, .ov-file-tree__refresh:disabled {
+  cursor: not-allowed;
+  opacity: .6;
+}
+
+.ov-file-tree__refresh[aria-busy="true"] {
+  cursor: wait;
+  opacity: 1;
+}
+
+.ov-file-tree__refresh-spinning {
+  animation: .9s linear infinite ov-file-tree-spin;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .ov-file-tree__search, .ov-file-tree__refresh {
+    transition: none;
+  }
+
+  .ov-file-tree__refresh-spinning {
+    animation-duration: 2s;
+  }
+}
+