@openviking/react 0.1.5 → 0.1.7

package/dist/fl~0.js

@@ -0,0 +1,709 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useId, useState } from "react";
+import { mergeLabels } from "./nx~0.js";
+import { FileInputIcon, ScanSearchIcon, ActivityIcon } from "./k~0.js";
+import { DashboardState } from "./37~0.js";
+import { button_Button } from "./e~0.js";
+import { useLocale } from "./28~0.js";
+function DashboardTabs({ tabs, active, label, onChange, children }) {
+    const id = useId();
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsx("div", {
+                className: "ov-dashboard-tabs",
+                role: "tablist",
+                tabIndex: -1,
+                "aria-label": label,
+                onKeyDown: (event)=>{
+                    const delta = 'ArrowRight' === event.key ? 1 : 'ArrowLeft' === event.key ? -1 : 0;
+                    if (!delta && 'Home' !== event.key && 'End' !== event.key) return;
+                    event.preventDefault();
+                    const index = 'Home' === event.key ? 0 : 'End' === event.key ? tabs.length - 1 : (tabs.findIndex((tab)=>tab.key === active) + delta + tabs.length) % tabs.length;
+                    onChange(tabs[index].key);
+                    const buttons = event.currentTarget.querySelectorAll('[role="tab"]');
+                    buttons[index]?.focus();
+                },
+                children: tabs.map((tab)=>/*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        id: `${id}-${tab.key}`,
+                        role: "tab",
+                        "aria-selected": active === tab.key,
+                        "aria-controls": `${id}-panel`,
+                        tabIndex: active === tab.key ? 0 : -1,
+                        onClick: ()=>onChange(tab.key),
+                        children: tab.title
+                    }, tab.key))
+            }),
+            /*#__PURE__*/ jsx("div", {
+                role: "tabpanel",
+                id: `${id}-panel`,
+                "aria-labelledby": `${id}-${active}`,
+                className: "ov-dashboard-tabpanel",
+                children: children
+            })
+        ]
+    });
+}
+const en = {
+    latest: 'Latest experience',
+    sourceCount: 'Generated from {count} trajectories',
+    sourceUri: 'Source Trajectory URI',
+    task: 'Task',
+    copy: 'Copy',
+    copied: 'Copied',
+    copyFailed: 'Copy failed',
+    title: 'Agent experiences',
+    allExperiences: 'All experiences',
+    index: 'No.',
+    impact: 'Application impact',
+    source: 'Source trace',
+    test: 'Test',
+    application: 'Experience application data',
+    notice: 'AI-generated data may contain errors',
+    injection: 'Context injections',
+    recall: 'Retrieval recalls',
+    listRecall: 'Experience recalls',
+    rate: 'Injection rate',
+    outcomes: 'Outcome distribution',
+    trajectories: 'Application trajectories',
+    empty: 'No experiences',
+    emptySource: 'No source records',
+    emptyTests: 'No test materials',
+    emptyOutcomes: 'No distribution data',
+    loading: 'Loading…',
+    failed: 'Could not load data',
+    retry: 'Retry',
+    previous: 'Previous',
+    next: 'Next',
+    all: 'All time',
+    week: 'Last 7 days',
+    month: 'Last 30 days',
+    range: 'Statistics period',
+    updated: 'Updated',
+    name: 'Experience',
+    success: 'Task success',
+    partial: 'Partial success',
+    unfinished: 'Unfinished',
+    failure: 'Failure',
+    unknown: 'Unknown',
+    unsupportedMetric: 'Metric not provided',
+    open: 'Open'
+};
+const zh = {
+    latest: '最新经验',
+    sourceCount: '由 {count} 条轨迹生成',
+    sourceUri: '来源 Trajectory URI',
+    task: '任务描述',
+    copy: '复制',
+    copied: '已复制',
+    copyFailed: '复制失败',
+    title: 'Agent 经验',
+    allExperiences: '全部经验',
+    index: '序号',
+    impact: '应用效果',
+    source: '来源追溯',
+    test: '测试',
+    application: '经验应用数据',
+    notice: '数据由 AI 生成，可能有误',
+    injection: '注入上下文次数',
+    recall: '检索召回次数',
+    listRecall: '经验召回次数',
+    rate: '注入率',
+    outcomes: '任务结果分布',
+    trajectories: '应用轨迹记录',
+    empty: '暂无经验',
+    emptySource: '暂无来源记录',
+    emptyTests: '暂无测试材料',
+    emptyOutcomes: '暂无可用分布数据',
+    loading: '加载中…',
+    failed: '数据加载失败',
+    retry: '重试',
+    previous: '上一页',
+    next: '下一页',
+    all: '全部时间',
+    week: '最近 7 天',
+    month: '最近 30 天',
+    range: '选择统计时间范围',
+    updated: '更新于',
+    name: '经验文件',
+    success: '任务成功',
+    partial: '部分成功',
+    unfinished: '未完成',
+    failure: '失败',
+    unknown: '未知',
+    unsupportedMetric: '未提供此指标',
+    open: '打开'
+};
+const experienceLabels = (locale, labels)=>mergeLabels('zh-CN' === locale ? zh : en, labels);
+function updatedAt(value, locale) {
+    const time = Date.parse(value);
+    if (!Number.isFinite(time)) return value;
+    const seconds = (time - Date.now()) / 1000;
+    const absolute = Math.abs(seconds);
+    if (absolute >= 604800) return new Intl.DateTimeFormat(locale).format(time);
+    const [unit, size] = absolute < 3600 ? [
+        'minute',
+        60
+    ] : absolute < 86400 ? [
+        'hour',
+        3600
+    ] : [
+        'day',
+        86400
+    ];
+    return new Intl.RelativeTimeFormat(locale, {
+        numeric: 'always'
+    }).format(Math.round(seconds / size), unit);
+}
+function ExperienceList({ items, total, startIndex = 0, locale = 'en-US', labels: t, onOpenUri }) {
+    return /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            /*#__PURE__*/ jsxs("h2", {
+                className: "ov-experience-dashboard__list-title",
+                children: [
+                    t.allExperiences,
+                    void 0 === total ? '' : ` · ${total}`
+                ]
+            }),
+            /*#__PURE__*/ jsx("div", {
+                className: "ov-experience-dashboard__table-scroll",
+                tabIndex: 0,
+                role: "region",
+                "aria-label": t.title,
+                children: /*#__PURE__*/ jsxs("table", {
+                    className: "ov-experience-dashboard__table",
+                    children: [
+                        /*#__PURE__*/ jsx("caption", {
+                            children: t.title
+                        }),
+                        /*#__PURE__*/ jsx("thead", {
+                            children: /*#__PURE__*/ jsxs("tr", {
+                                children: [
+                                    /*#__PURE__*/ jsx("th", {
+                                        scope: "col",
+                                        children: t.index
+                                    }),
+                                    /*#__PURE__*/ jsx("th", {
+                                        scope: "col",
+                                        children: t.name
+                                    }),
+                                    /*#__PURE__*/ jsx("th", {
+                                        scope: "col",
+                                        children: t.injection
+                                    }),
+                                    /*#__PURE__*/ jsx("th", {
+                                        scope: "col",
+                                        children: t.listRecall
+                                    })
+                                ]
+                            })
+                        }),
+                        /*#__PURE__*/ jsx("tbody", {
+                            children: items.map((item, index)=>/*#__PURE__*/ jsxs("tr", {
+                                    children: [
+                                        /*#__PURE__*/ jsxs("td", {
+                                            children: [
+                                                "# ",
+                                                startIndex + index + 1
+                                            ]
+                                        }),
+                                        /*#__PURE__*/ jsxs("th", {
+                                            scope: "row",
+                                            children: [
+                                                /*#__PURE__*/ jsx("button", {
+                                                    type: "button",
+                                                    disabled: !onOpenUri,
+                                                    onClick: ()=>onOpenUri?.(item.uri),
+                                                    children: item.name
+                                                }),
+                                                /*#__PURE__*/ jsxs("span", {
+                                                    children: [
+                                                        /*#__PURE__*/ jsx("code", {
+                                                            title: item.uri,
+                                                            children: item.uri
+                                                        }),
+                                                        item.modTime ? /*#__PURE__*/ jsxs("time", {
+                                                            dateTime: item.modTime,
+                                                            title: item.modTime,
+                                                            children: [
+                                                                "\xb7 ",
+                                                                t.updated,
+                                                                " ",
+                                                                updatedAt(item.modTime, locale)
+                                                            ]
+                                                        }) : null
+                                                    ]
+                                                })
+                                            ]
+                                        }),
+                                        /*#__PURE__*/ jsx("td", {
+                                            children: item.injectionCount ?? '—'
+                                        }),
+                                        /*#__PURE__*/ jsx("td", {
+                                            children: item.recallCount ?? '—'
+                                        })
+                                    ]
+                                }, item.uri))
+                        })
+                    ]
+                })
+            })
+        ]
+    });
+}
+function ExperienceTrajectories({ items, onOpenUri, source = false }) {
+    return /*#__PURE__*/ jsx("ul", {
+        className: `ov-experience-dashboard__timeline${source ? ' ov-experience-dashboard__timeline--source' : ''}`,
+        children: items.map((item)=>/*#__PURE__*/ jsxs("li", {
+                children: [
+                    item.created_at ? /*#__PURE__*/ jsx("time", {
+                        dateTime: item.created_at,
+                        children: item.created_at
+                    }) : null,
+                    /*#__PURE__*/ jsx("button", {
+                        type: "button",
+                        disabled: !onOpenUri,
+                        onClick: ()=>onOpenUri?.(item.uri),
+                        children: item.name
+                    }),
+                    /*#__PURE__*/ jsx("code", {
+                        children: item.uri
+                    }),
+                    item.description ? /*#__PURE__*/ jsx("p", {
+                        children: item.description
+                    }) : null
+                ]
+            }, item.uri))
+    });
+}
+const ORDER = [
+    'success',
+    'partial',
+    'unfinished',
+    'failure',
+    'unknown'
+];
+function ExperienceImpact({ data, labels: t, days, onDaysChange, outcomesState, trajectoriesState, onOpenUri }) {
+    const total = data.outcomes?.reduce((sum, item)=>sum + item.count, 0) ?? 0;
+    const metrics = [
+        {
+            label: t.injection,
+            value: data.effect?.injectionCount,
+            icon: /*#__PURE__*/ jsx(FileInputIcon, {
+                width: 14,
+                height: 14
+            })
+        },
+        {
+            label: t.recall,
+            value: data.effect?.recallCount,
+            icon: /*#__PURE__*/ jsx(ScanSearchIcon, {
+                width: 14,
+                height: 14
+            })
+        },
+        {
+            label: t.rate,
+            value: data.effect ? new Intl.NumberFormat('en-US', {
+                style: 'percent',
+                maximumFractionDigits: 1
+            }).format(data.effect.injectionRate) : void 0,
+            icon: /*#__PURE__*/ jsx(ActivityIcon, {
+                width: 14,
+                height: 14
+            })
+        }
+    ];
+    return /*#__PURE__*/ jsxs("div", {
+        className: "ov-experience-dashboard__impact",
+        children: [
+            /*#__PURE__*/ jsxs("div", {
+                className: "ov-experience-dashboard__heading",
+                children: [
+                    /*#__PURE__*/ jsxs("div", {
+                        children: [
+                            /*#__PURE__*/ jsx("h2", {
+                                children: t.application
+                            }),
+                            /*#__PURE__*/ jsx("span", {
+                                children: t.notice
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsxs("select", {
+                        "aria-label": t.range,
+                        value: days,
+                        onChange: (event)=>onDaysChange(Number(event.target.value)),
+                        children: [
+                            /*#__PURE__*/ jsx("option", {
+                                value: 7,
+                                children: t.week
+                            }),
+                            /*#__PURE__*/ jsx("option", {
+                                value: 30,
+                                children: t.month
+                            }),
+                            /*#__PURE__*/ jsx("option", {
+                                value: 0,
+                                children: t.all
+                            })
+                        ]
+                    })
+                ]
+            }),
+            /*#__PURE__*/ jsx("dl", {
+                className: "ov-experience-dashboard__metrics",
+                children: metrics.map((metric)=>/*#__PURE__*/ jsxs("div", {
+                        title: void 0 === metric.value ? t.unsupportedMetric : void 0,
+                        children: [
+                            metric.icon,
+                            /*#__PURE__*/ jsx("dd", {
+                                children: metric.value ?? '—'
+                            }),
+                            /*#__PURE__*/ jsx("dt", {
+                                children: metric.label
+                            })
+                        ]
+                    }, metric.label))
+            }),
+            /*#__PURE__*/ jsx("section", {
+                className: "ov-experience-dashboard__distribution",
+                "aria-label": t.outcomes,
+                children: data.outcomes?.length ? ORDER.map((outcome)=>{
+                    const count = data.outcomes?.find((item)=>item.outcome === outcome)?.count ?? 0;
+                    return /*#__PURE__*/ jsxs("div", {
+                        className: "ov-experience-dashboard__outcome",
+                        children: [
+                            /*#__PURE__*/ jsxs("div", {
+                                children: [
+                                    /*#__PURE__*/ jsx("span", {
+                                        children: t[outcome]
+                                    }),
+                                    /*#__PURE__*/ jsx("strong", {
+                                        children: count
+                                    })
+                                ]
+                            }),
+                            /*#__PURE__*/ jsx("div", {
+                                className: "ov-experience-dashboard__outcome-track",
+                                "aria-hidden": "true",
+                                children: /*#__PURE__*/ jsx("span", {
+                                    style: {
+                                        width: `${total > 0 ? Math.max(count / total * 100, count ? 2 : 0) : 0}%`
+                                    }
+                                })
+                            })
+                        ]
+                    }, outcome);
+                }) : /*#__PURE__*/ jsx(DashboardState, {
+                    state: outcomesState,
+                    empty: t.emptyOutcomes,
+                    loading: t.loading,
+                    failed: t.failed,
+                    retry: t.retry
+                })
+            }),
+            /*#__PURE__*/ jsxs("section", {
+                className: "ov-experience-dashboard__trajectories",
+                children: [
+                    /*#__PURE__*/ jsxs("h3", {
+                        children: [
+                            t.trajectories,
+                            void 0 === data.trajectoryTotal ? '' : ` · ${data.trajectoryTotal}`
+                        ]
+                    }),
+                    data.trajectories?.length ? /*#__PURE__*/ jsx(ExperienceTrajectories, {
+                        items: data.trajectories,
+                        onOpenUri: onOpenUri
+                    }) : /*#__PURE__*/ jsx(DashboardState, {
+                        state: trajectoriesState,
+                        empty: t.empty,
+                        loading: t.loading,
+                        failed: t.failed,
+                        retry: t.retry
+                    })
+                ]
+            })
+        ]
+    });
+}
+function CopyButton({ value, labels: t }) {
+    const [result, setResult] = useState();
+    const state = result?.value === value ? result.state : void 0;
+    const copy = async ()=>{
+        setResult({
+            value,
+            state: 'pending'
+        });
+        try {
+            await navigator.clipboard.writeText(value);
+            setResult({
+                value,
+                state: 'copied'
+            });
+        } catch  {
+            setResult({
+                value,
+                state: 'failed'
+            });
+        }
+    };
+    return /*#__PURE__*/ jsx(button_Button, {
+        size: "small",
+        type: "default",
+        htmlType: "button",
+        disabled: !value || 'pending' === state,
+        "aria-live": "polite",
+        onClick: ()=>void copy(),
+        children: 'copied' === state ? t.copied : 'failed' === state ? t.copyFailed : t.copy
+    });
+}
+function ExperienceTests({ items, labels: t, onOpenUri }) {
+    return /*#__PURE__*/ jsx("div", {
+        className: "ov-experience-dashboard__tests",
+        children: items.map((item)=>/*#__PURE__*/ jsxs("article", {
+                children: [
+                    /*#__PURE__*/ jsxs("header", {
+                        children: [
+                            /*#__PURE__*/ jsxs("div", {
+                                className: "ov-experience-dashboard__test-heading",
+                                children: [
+                                    /*#__PURE__*/ jsx("strong", {
+                                        children: item.title
+                                    }),
+                                    /*#__PURE__*/ jsxs("div", {
+                                        className: "ov-experience-dashboard__test-meta",
+                                        children: [
+                                            /*#__PURE__*/ jsx("span", {
+                                                children: t.sourceUri
+                                            }),
+                                            /*#__PURE__*/ jsx("code", {
+                                                title: item.uri,
+                                                children: item.uri ?? '—'
+                                            }),
+                                            item.uri ? /*#__PURE__*/ jsxs(Fragment, {
+                                                children: [
+                                                    /*#__PURE__*/ jsx(CopyButton, {
+                                                        value: item.uri,
+                                                        labels: t
+                                                    }),
+                                                    /*#__PURE__*/ jsx(button_Button, {
+                                                        size: "small",
+                                                        type: "default",
+                                                        htmlType: "button",
+                                                        disabled: !onOpenUri,
+                                                        onClick: ()=>item.uri && onOpenUri?.(item.uri),
+                                                        children: t.open
+                                                    })
+                                                ]
+                                            }) : null
+                                        ]
+                                    }),
+                                    item.taskQuery ? /*#__PURE__*/ jsxs("div", {
+                                        className: "ov-experience-dashboard__test-meta",
+                                        children: [
+                                            /*#__PURE__*/ jsx("span", {
+                                                children: t.task
+                                            }),
+                                            /*#__PURE__*/ jsx("p", {
+                                                children: item.taskQuery
+                                            })
+                                        ]
+                                    }) : null
+                                ]
+                            }),
+                            /*#__PURE__*/ jsx(CopyButton, {
+                                value: item.content,
+                                labels: t
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ jsx("div", {
+                        className: "ov-experience-dashboard__test-content",
+                        children: item.content.split('\n').map((line, index)=>{
+                            const role = line.match(/^(User|Assistant):(.*)$/);
+                            return /*#__PURE__*/ jsx("div", {
+                                children: role ? /*#__PURE__*/ jsxs(Fragment, {
+                                    children: [
+                                        /*#__PURE__*/ jsxs("strong", {
+                                            children: [
+                                                role[1],
+                                                ":"
+                                            ]
+                                        }),
+                                        role[2]
+                                    ]
+                                }) : line.startsWith('# ') ? /*#__PURE__*/ jsx("strong", {
+                                    children: line
+                                }) : line || '\u00a0'
+                            }, index);
+                        })
+                    })
+                ]
+            }, item.id))
+    });
+}
+function ExperiencePagination({ page, hasMore, loading, labels: t, onPageChange }) {
+    if (!page && !hasMore) return null;
+    return /*#__PURE__*/ jsxs("div", {
+        className: "ov-experience-dashboard__pagination",
+        children: [
+            /*#__PURE__*/ jsx(button_Button, {
+                size: "small",
+                type: "default",
+                htmlType: "button",
+                disabled: !page || loading || !onPageChange,
+                onClick: ()=>onPageChange?.(page - 1),
+                children: t.previous
+            }),
+            /*#__PURE__*/ jsx("span", {
+                children: page + 1
+            }),
+            /*#__PURE__*/ jsx(button_Button, {
+                size: "small",
+                type: "default",
+                htmlType: "button",
+                disabled: !hasMore || loading || !onPageChange,
+                onClick: ()=>onPageChange?.(page + 1),
+                children: t.next
+            })
+        ]
+    });
+}
+function ExperienceDashboard(props) {
+    return /*#__PURE__*/ jsx(ExperienceDashboardContent, {
+        ...props
+    }, props.uri);
+}
+function ExperienceDashboardContent({ uri, data = {}, kind, tab: controlledTab, days: controlledDays, page = 0, hasMore = false, startIndex = 0, states = {}, onTabChange, onDaysChange, onPageChange, locale: localeProp, onOpenUri, labels, className, ...rest }) {
+    const locale = useLocale(localeProp);
+    const [localTab, setLocalTab] = useState('impact');
+    const [localDays, setLocalDays] = useState(7);
+    const selectedTab = controlledTab ?? localTab;
+    const missingTest = void 0 === data.testMaterials;
+    const tab = 'test' === selectedTab && missingTest ? 'impact' : selectedTab;
+    if ('test' === localTab && missingTest) setLocalTab('impact');
+    const days = controlledDays ?? localDays;
+    const setTab = (value)=>{
+        setLocalTab(value);
+        onTabChange?.(value);
+    };
+    const setDays = (value)=>{
+        setLocalDays(value);
+        onDaysChange?.(value);
+    };
+    const t = experienceLabels(locale, labels);
+    const directory = 'directory' === kind;
+    const result = data;
+    const tabs = [
+        {
+            key: 'impact',
+            title: t.impact
+        },
+        {
+            key: 'source',
+            title: t.source
+        },
+        ...void 0 === result.testMaterials ? [] : [
+            {
+                key: 'test',
+                title: t.test
+            }
+        ]
+    ];
+    const activeState = directory ? states.list : 'source' === tab ? states.sources : states.trajectories;
+    const pagination = /*#__PURE__*/ jsx(ExperiencePagination, {
+        page: page,
+        hasMore: hasMore,
+        loading: activeState?.loading,
+        labels: t,
+        onPageChange: onPageChange
+    });
+    return /*#__PURE__*/ jsx("div", {
+        ...rest,
+        "data-resource-uri": uri,
+        className: [
+            'ov-experience-dashboard',
+            className
+        ].filter(Boolean).join(' '),
+        children: directory ? /*#__PURE__*/ jsxs("div", {
+            className: "ov-experience-dashboard__body",
+            children: [
+                result.experiences?.length ? /*#__PURE__*/ jsx(ExperienceList, {
+                    items: result.experiences,
+                    total: result.total,
+                    locale: locale,
+                    startIndex: startIndex,
+                    labels: t,
+                    onOpenUri: onOpenUri
+                }) : /*#__PURE__*/ jsx(DashboardState, {
+                    state: states.list,
+                    empty: t.empty,
+                    loading: t.loading,
+                    failed: t.failed,
+                    retry: t.retry
+                }),
+                pagination
+            ]
+        }) : /*#__PURE__*/ jsx(DashboardTabs, {
+            tabs: tabs,
+            active: tab,
+            label: t.title,
+            onChange: setTab,
+            children: /*#__PURE__*/ jsx("div", {
+                className: "ov-experience-dashboard__body",
+                children: 'impact' === tab ? /*#__PURE__*/ jsxs(Fragment, {
+                    children: [
+                        /*#__PURE__*/ jsx(ExperienceImpact, {
+                            data: result,
+                            labels: t,
+                            days: days,
+                            onDaysChange: setDays,
+                            outcomesState: states.outcomes ?? {},
+                            trajectoriesState: states.trajectories ?? {},
+                            onOpenUri: onOpenUri
+                        }),
+                        pagination
+                    ]
+                }) : 'source' === tab ? result.sources?.length ? /*#__PURE__*/ jsxs("details", {
+                    open: true,
+                    className: "ov-experience-dashboard__source-group",
+                    children: [
+                        /*#__PURE__*/ jsxs("summary", {
+                            children: [
+                                /*#__PURE__*/ jsx("strong", {
+                                    children: t.latest
+                                }),
+                                /*#__PURE__*/ jsx("span", {
+                                    children: t.sourceCount.replace('{count}', String(result.sources.length))
+                                })
+                            ]
+                        }),
+                        /*#__PURE__*/ jsx(ExperienceTrajectories, {
+                            items: result.sources,
+                            source: true,
+                            onOpenUri: onOpenUri
+                        })
+                    ]
+                }) : /*#__PURE__*/ jsx(DashboardState, {
+                    state: states.sources,
+                    empty: t.emptySource,
+                    loading: t.loading,
+                    failed: t.failed,
+                    retry: t.retry
+                }) : result.testMaterials?.length ? /*#__PURE__*/ jsx(ExperienceTests, {
+                    items: result.testMaterials,
+                    labels: t,
+                    onOpenUri: onOpenUri
+                }) : /*#__PURE__*/ jsx(DashboardState, {
+                    state: states.tests,
+                    empty: t.emptyTests,
+                    loading: t.loading,
+                    failed: t.failed,
+                    retry: t.retry
+                })
+            })
+        })
+    });
+}
+export { ExperienceDashboard };