@openviking/react 0.1.7 → 0.1.8-beta.11.1.gc6def608a25e

package/dist/fi~0.js

@@ -0,0 +1,339 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useId, useRef, useState } from "react";
+import { resolveLocale } from "./nx~0.js";
+import { checkreact } from "./0~0.js";
+import { searchreact } from "./p0~0.js";
+import { input_Input } from "./c7r~0.js";
+import { chevron_downreact } from "./s~0.js";
+import { useLocale, LocaleProvider } from "./28~0.js";
+const messages = {
+    loading: 'Loading…',
+    searchPlaceholder: 'Search',
+    empty: 'No options',
+    noMatch: 'No matches',
+    error: 'Unable to load options'
+};
+const en_US = messages;
+const zh_CN_messages = {
+    loading: '加载中…',
+    searchPlaceholder: '搜索',
+    empty: '暂无选项',
+    noMatch: '没有匹配项',
+    error: '选项加载失败'
+};
+const zh_CN = zh_CN_messages;
+const LOCALES = {
+    'en-US': en_US,
+    'zh-CN': zh_CN
+};
+function resolveScopeLabels(locale = 'en-US', labels) {
+    const defaults = resolveLocale(LOCALES, locale, labels);
+    return {
+        ...defaults,
+        noMatch: labels?.noMatch ?? labels?.empty ?? defaults.noMatch
+    };
+}
+function moveScopeFocus(event) {
+    if (![
+        'ArrowDown',
+        'ArrowUp',
+        'Home',
+        'End'
+    ].includes(event.key)) return;
+    const target = event.target;
+    const isSearch = target.matches('input.ov-scope-switcher__search');
+    if (event.defaultPrevented || !target.matches('[role="option"]') && !isSearch || isSearch && !event.key.startsWith('Arrow')) return;
+    const options = Array.from(event.currentTarget.querySelectorAll('[role="option"]:not([aria-disabled="true"])'));
+    if (!options.length) return;
+    event.preventDefault();
+    const current = options.indexOf(document.activeElement);
+    const next = 'Home' === event.key ? 0 : 'End' === event.key ? options.length - 1 : 'ArrowDown' === event.key ? (current + 1) % options.length : current < 0 ? options.length - 1 : (current - 1 + options.length) % options.length;
+    options[next]?.focus();
+}
+function Highlight({ text, keyword }) {
+    const needle = keyword.trim().toLocaleLowerCase();
+    if (!needle) return /*#__PURE__*/ jsx(Fragment, {
+        children: text
+    });
+    const haystack = text.toLocaleLowerCase();
+    const parts = [];
+    let cursor = 0;
+    let hit = haystack.indexOf(needle);
+    while(hit >= 0){
+        if (hit > cursor) parts.push(text.slice(cursor, hit));
+        const end = hit + needle.length;
+        parts.push(/*#__PURE__*/ jsx("mark", {
+            children: text.slice(hit, end)
+        }, `${hit}-${end}`));
+        cursor = end;
+        hit = haystack.indexOf(needle, cursor);
+    }
+    if (cursor < text.length) parts.push(text.slice(cursor));
+    return /*#__PURE__*/ jsx(Fragment, {
+        children: parts
+    });
+}
+function ScopePanel({ label, data, state, slots, actions, onSelect, labels }) {
+    const focusPanel = useCallback((node)=>{
+        const target = node?.querySelector('input') ?? node?.querySelector('[role="option"][aria-selected="true"]:not([aria-disabled="true"])') ?? node?.querySelector('[role="option"]:not([aria-disabled="true"])');
+        (target ?? node)?.focus();
+    }, []);
+    const options = data.visibleOptions ?? data.options;
+    const keyword = state?.searchKeyword ?? '';
+    const hasKeyword = keyword.trim().length > 0;
+    const searchVisible = actions?.onSearchKeywordChange && (hasKeyword || Math.max(options.length, data.options.length, data.total ?? 0) > 10);
+    const search = searchVisible ? /*#__PURE__*/ jsx(input_Input, {
+        size: "small",
+        prefix: /*#__PURE__*/ jsx(searchreact, {
+            className: "ov-scope-switcher__search-icon"
+        }),
+        type: "search",
+        className: "ov-scope-switcher__search-field",
+        value: keyword,
+        "aria-label": labels.searchPlaceholder,
+        placeholder: labels.searchPlaceholder,
+        onChange: (event)=>actions?.onSearchKeywordChange?.(event.currentTarget.value)
+    }) : null;
+    let list;
+    list = state?.loading ? /*#__PURE__*/ jsx("div", {
+        className: "ov-scope-switcher__state",
+        role: "status",
+        children: labels.loading
+    }) : state?.error ? /*#__PURE__*/ jsx("div", {
+        className: "ov-scope-switcher__state",
+        role: "alert",
+        children: slots?.errorFallback ?? labels.error
+    }) : options.length ? /*#__PURE__*/ jsx("div", {
+        className: "ov-scope-switcher__list",
+        role: "listbox",
+        "aria-label": label,
+        "aria-busy": state?.busy,
+        onScroll: (event)=>{
+            const { scrollTop, scrollHeight, clientHeight } = event.currentTarget;
+            actions?.onScroll?.({
+                scrollTop,
+                scrollHeight,
+                clientHeight
+            });
+        },
+        children: options.map((option)=>{
+            const selected = option.id === data.selectedId;
+            const content = /*#__PURE__*/ jsxs(Fragment, {
+                children: [
+                    option.icon && /*#__PURE__*/ jsx("span", {
+                        className: "ov-scope-switcher__icon",
+                        "aria-hidden": "true",
+                        children: option.icon
+                    }),
+                    /*#__PURE__*/ jsxs("span", {
+                        className: "ov-scope-switcher__option-text",
+                        children: [
+                            /*#__PURE__*/ jsx("span", {
+                                children: /*#__PURE__*/ jsx(Highlight, {
+                                    text: option.label,
+                                    keyword: keyword
+                                })
+                            }),
+                            option.description && /*#__PURE__*/ jsx("small", {
+                                children: option.description
+                            })
+                        ]
+                    }),
+                    selected && /*#__PURE__*/ jsx("span", {
+                        className: "ov-scope-switcher__check",
+                        "aria-hidden": "true",
+                        children: /*#__PURE__*/ jsx(checkreact, {})
+                    })
+                ]
+            });
+            return /*#__PURE__*/ jsx("div", {
+                tabIndex: option.disabled || state?.busy ? -1 : 0,
+                role: "option",
+                "aria-selected": selected,
+                className: "ov-scope-switcher__option",
+                title: option.label,
+                "aria-disabled": option.disabled || state?.busy || void 0,
+                onClick: (event)=>{
+                    const target = event.target;
+                    if (option.disabled || state?.busy || target.closest('button, a, input, select, textarea, [role="button"]')) return;
+                    onSelect(option);
+                },
+                onKeyDown: (event)=>{
+                    if (event.target !== event.currentTarget || option.disabled || state?.busy) return;
+                    if ('Enter' === event.key || ' ' === event.key) {
+                        event.preventDefault();
+                        onSelect(option);
+                    }
+                },
+                children: slots?.renderOption ? slots?.renderOption(content, option) : content
+            }, option.id);
+        })
+    }, keyword) : /*#__PURE__*/ jsx("div", {
+        className: "ov-scope-switcher__state",
+        role: "status",
+        children: slots?.emptyFallback ?? (hasKeyword ? labels.noMatch : labels.empty)
+    });
+    return /*#__PURE__*/ jsx("div", {
+        role: "group",
+        tabIndex: -1,
+        ref: focusPanel,
+        className: "ov-scope-switcher__panel-inner",
+        onKeyDownCapture: moveScopeFocus,
+        children: slots?.renderPanel ? slots?.renderPanel({
+            search,
+            list
+        }) : /*#__PURE__*/ jsxs("div", {
+            className: "ov-scope-switcher__panel-body",
+            children: [
+                search,
+                list
+            ]
+        })
+    });
+}
+function ScopeSelector(props) {
+    const { identity, trigger: triggerContent } = props;
+    const locale = useLocale(props.locale);
+    const labels = resolveScopeLabels(locale, props.labels);
+    const selectable = 'selectable' === props.kind ? props : void 0;
+    const data = selectable?.data;
+    const state = selectable?.state;
+    const actions = selectable?.actions;
+    const slots = selectable?.slots;
+    const [localVisible, setLocalVisible] = useState(false);
+    const root = useRef(null);
+    const trigger = useRef(null);
+    const restoreSelectionFocus = useRef(false);
+    const panelId = useId();
+    const open = void 0 !== selectable && (state?.visible ?? localVisible) && !state?.disabled;
+    const onVisibleChange = actions?.onVisibleChange;
+    const changeVisible = useCallback((visible)=>{
+        setLocalVisible(visible);
+        onVisibleChange?.(visible);
+    }, [
+        onVisibleChange
+    ]);
+    useEffect(()=>{
+        if (!open) return;
+        const dismiss = (event)=>{
+            if (event.target instanceof Node && !root.current?.contains(event.target)) changeVisible(false);
+        };
+        const escape = (event)=>{
+            if ('Escape' === event.key) {
+                event.preventDefault();
+                changeVisible(false);
+                trigger.current?.focus();
+            }
+        };
+        document.addEventListener('pointerdown', dismiss);
+        document.addEventListener('keydown', escape);
+        return ()=>{
+            document.removeEventListener('pointerdown', dismiss);
+            document.removeEventListener('keydown', escape);
+        };
+    }, [
+        open,
+        changeVisible
+    ]);
+    useEffect(()=>{
+        if (open || !restoreSelectionFocus.current) return;
+        restoreSelectionFocus.current = false;
+        if (document.activeElement === document.body || root.current?.contains(document.activeElement)) trigger.current?.focus();
+    }, [
+        open
+    ]);
+    const selected = data?.options.find((o)=>o.id === data.selectedId);
+    const label = triggerContent?.label ?? selected?.label ?? '';
+    const icon = triggerContent?.icon ?? selected?.icon;
+    const content = /*#__PURE__*/ jsxs(Fragment, {
+        children: [
+            icon && /*#__PURE__*/ jsx("span", {
+                className: "ov-scope-switcher__icon",
+                "aria-hidden": "true",
+                children: icon
+            }),
+            /*#__PURE__*/ jsx("span", {
+                className: "ov-scope-switcher__label",
+                children: label
+            }),
+            identity.tag && /*#__PURE__*/ jsx("span", {
+                className: "ov-scope-switcher__tag",
+                children: identity.tag
+            })
+        ]
+    });
+    return /*#__PURE__*/ jsxs("div", {
+        ref: root,
+        role: "group",
+        className: "ov-scope-switcher__level",
+        onBlur: (event)=>{
+            if (open && event.relatedTarget instanceof Node && !event.currentTarget.contains(event.relatedTarget)) changeVisible(false);
+        },
+        children: [
+            void 0 === selectable ? /*#__PURE__*/ jsx("span", {
+                className: "ov-scope-switcher__trigger",
+                "aria-label": identity.ariaLabel,
+                title: label,
+                children: content
+            }) : /*#__PURE__*/ jsxs("button", {
+                ref: trigger,
+                type: "button",
+                className: "ov-scope-switcher__trigger",
+                "aria-label": identity.ariaLabel,
+                title: label,
+                disabled: state?.disabled,
+                "aria-expanded": open,
+                "aria-haspopup": "dialog",
+                "aria-controls": open ? panelId : void 0,
+                onClick: ()=>changeVisible(!open),
+                onKeyDown: (event)=>{
+                    if ('ArrowDown' === event.key || 'ArrowUp' === event.key) {
+                        event.preventDefault();
+                        if (open) root.current?.querySelector('[role="option"]:not([aria-disabled="true"])')?.focus();
+                        else changeVisible(true);
+                    }
+                },
+                children: [
+                    content,
+                    /*#__PURE__*/ jsx("span", {
+                        className: "ov-scope-switcher__arrow",
+                        "aria-hidden": "true",
+                        children: /*#__PURE__*/ jsx(chevron_downreact, {})
+                    })
+                ]
+            }),
+            open && void 0 !== selectable && void 0 !== data && /*#__PURE__*/ jsx("div", {
+                id: panelId,
+                className: slots?.renderPanel ? 'ov-scope-switcher__panel ov-scope-switcher__panel--custom' : 'ov-scope-switcher__panel',
+                role: "dialog",
+                "aria-label": identity.ariaLabel ?? label,
+                children: /*#__PURE__*/ jsx(ScopePanel, {
+                    label: identity.ariaLabel ?? label,
+                    data: data,
+                    state: state,
+                    slots: slots,
+                    actions: actions,
+                    onSelect: (option)=>{
+                        restoreSelectionFocus.current = true;
+                        changeVisible(false);
+                        actions?.onSelect?.(option);
+                    },
+                    labels: labels
+                })
+            })
+        ]
+    });
+}
+function ScopeSwitcher({ locale: localeProp, children, className = '', ...props }) {
+    const locale = useLocale(localeProp);
+    return /*#__PURE__*/ jsx(LocaleProvider, {
+        locale: locale,
+        children: /*#__PURE__*/ jsx("div", {
+            lang: locale,
+            ...props,
+            className: `ov-scope-switcher ${className}`,
+            children: children
+        })
+    });
+}
+export { ScopeSelector, ScopeSwitcher };

package/dist/fj~0.js

@@ -1,7 +1,7 @@
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useId, useRef, useState } from "react";
 import { mergeLabels } from "./nx~0.js";
-import { getFileTypeColor, getFileTypeIcon, WikiWarningIcon, WikiSuccessIcon, WikiEditIcon, WikiDiscussIcon, WikiHistoryIcon, resolveFileTypeIconKey } from "./k~0.js";
+import { getFileTypeColor, resolveFileTypeIconKey, WikiWarningIcon, WikiSuccessIcon, getFileTypeIcon } from "./k~0.js";
 import { Tooltip } from "./rt~0.js";
 import { button_Button } from "./e~0.js";
 import { Popover } from "./r~0.js";
@@ -10,7 +10,6 @@ import { DashboardState } from "./37~0.js";
 const en = {
     title: 'Generation results',
     pendingLabel: 'Pending',
-    discuss: 'VikingBot discussion',
     conflicts: 'All conflicts',
     conflictFiles: 'Conflicting files',
     pending: 'Pending conflicts',
@@ -27,20 +26,15 @@ const en = {
     failed: 'Could not load conflicts',
     retry: 'Retry',
     open: 'Open',
-    edit: 'Manual edit',
     solution: 'Solution',
     occurred: 'Detected',
     fixedAt: 'Resolved',
     evidence: 'Resolution basis',
-    history: 'Resolution history',
-    historyHint: 'View the resolution plan and evidence',
-    unavailable: 'Action unavailable',
     limited: 'Showing up to 100 conflicting files'
 };
 const zh = {
     title: '生成效果',
     pendingLabel: '待确认',
-    discuss: 'VikingBot 对话',
     conflicts: '全部冲突',
     conflictFiles: '冲突文件数',
     pending: '待确认冲突',
@@ -57,14 +51,10 @@ const zh = {
     failed: '冲突加载失败',
     retry: '重试',
     open: '打开',
-    edit: '人工修改',
     solution: '修复方案',
     occurred: '检测时间',
     fixedAt: '修复时间',
     evidence: '修复依据',
-    history: '修复回溯',
-    historyHint: '查看修复方案与依据',
-    unavailable: '当前不可操作',
     limited: '最多展示 100 个存在待确认冲突的文件'
 };
 const wikiLabels = (locale, labels)=>mergeLabels('zh-CN' === locale ? zh : en, labels);
@@ -80,24 +70,23 @@ function WikiFileIcon({ name }) {
         }
     });
 }
-function WikiActionButton({ label, hint, onClick, children, ...aria }) {
+function WikiActionButton({ icon, tooltip, disabled, onClick }) {
+    const inactive = disabled || !onClick;
     return /*#__PURE__*/ jsx(Tooltip, {
-        content: hint,
+        content: tooltip,
         children: /*#__PURE__*/ jsx(button_Button, {
             size: "mini",
             type: "text",
             iconOnly: true,
-            ...aria,
             htmlType: "button",
-            "aria-label": label,
-            "aria-disabled": !onClick || void 0,
-            "aria-description": onClick ? void 0 : hint,
-            onClick: ()=>onClick?.(),
-            children: children
+            "aria-label": tooltip,
+            "aria-disabled": inactive || void 0,
+            icon: icon,
+            onClick: onClick
         })
     });
 }
-function WikiConflictCard({ conflict, path, labels: t, editDisabledReason, discussDisabledReason, onOpenUri, onEdit, onDiscuss }) {
+function WikiConflictCard({ conflict, path, labels: t, actions = [], onOpenUri }) {
     const [expanded, setExpanded] = useState(false);
     const id = useId();
     const fixed = 'fixed' === conflict.state;
@@ -106,7 +95,11 @@ function WikiConflictCard({ conflict, path, labels: t, editDisabledReason, discu
         className: "ov-wiki-dashboard__conflict",
         children: [
             /*#__PURE__*/ jsxs("div", {
-                className: `ov-wiki-dashboard__conflict-row${path ? '' : ' ov-wiki-dashboard__conflict-row--without-path'}`,
+                className: [
+                    'ov-wiki-dashboard__conflict-row',
+                    !path && 'ov-wiki-dashboard__conflict-row--without-path',
+                    actions.length > 0 && 'ov-wiki-dashboard__conflict-row--with-actions'
+                ].filter(Boolean).join(' '),
                 children: [
                     /*#__PURE__*/ jsxs("span", {
                         className: `ov-wiki-dashboard__status ov-wiki-dashboard__status--${conflict.state}`,
@@ -163,41 +156,12 @@ function WikiConflictCard({ conflict, path, labels: t, editDisabledReason, discu
                         className: `ov-wiki-dashboard__severity ov-wiki-dashboard__severity--${conflict.severity}`,
                         children: t[conflict.severity]
                     }),
-                    /*#__PURE__*/ jsx("div", {
+                    actions.length > 0 ? /*#__PURE__*/ jsx("div", {
                         className: "ov-wiki-dashboard__actions",
-                        children: fixed ? /*#__PURE__*/ jsx(WikiActionButton, {
-                            label: t.history,
-                            hint: t.historyHint,
-                            "aria-expanded": expanded,
-                            "aria-controls": id,
-                            onClick: ()=>setExpanded(!expanded),
-                            children: /*#__PURE__*/ jsx(WikiHistoryIcon, {
-                                width: 14,
-                                height: 14
-                            })
-                        }) : /*#__PURE__*/ jsxs(Fragment, {
-                            children: [
-                                /*#__PURE__*/ jsx(WikiActionButton, {
-                                    label: `${t.edit}: ${conflict.description}`,
-                                    hint: onEdit ? t.edit : editDisabledReason || t.unavailable,
-                                    onClick: onEdit ? ()=>onEdit(conflict) : void 0,
-                                    children: /*#__PURE__*/ jsx(WikiEditIcon, {
-                                        width: 14,
-                                        height: 14
-                                    })
-                                }),
-                                /*#__PURE__*/ jsx(WikiActionButton, {
-                                    label: `${t.discuss}: ${conflict.description}`,
-                                    hint: onDiscuss ? t.discuss : discussDisabledReason || t.unavailable,
-                                    onClick: onDiscuss ? ()=>onDiscuss(conflict) : void 0,
-                                    children: /*#__PURE__*/ jsx(WikiDiscussIcon, {
-                                        width: 14,
-                                        height: 14
-                                    })
-                                })
-                            ]
-                        })
-                    })
+                        children: actions.map(({ key, ...action })=>/*#__PURE__*/ jsx(WikiActionButton, {
+                                ...action
+                            }, key))
+                    }) : null
                 ]
             }),
             /*#__PURE__*/ jsx("div", {
@@ -388,7 +352,7 @@ function WikiSeverityFilter({ value, onChange, labels: t }) {
     });
 }
 function WikiDashboard(props) {
-    const { kind, data, editDisabledReason, discussDisabledReason, locale: localeProp, onOpenUri, onOpenDashboard, onEdit, onDiscuss, labels, loading, error, onRetry, className, ...rest } = props;
+    const { kind, data, locale: localeProp, onOpenUri, onOpenDashboard, defineActions, labels, loading, error, onRetry, className, ...rest } = props;
     const locale = useLocale(localeProp);
     const t = wikiLabels(locale, labels);
     const [severity, setSeverity] = useState('all');
@@ -449,15 +413,14 @@ function WikiDashboard(props) {
                                 conflict: conflict,
                                 path: data?.path,
                                 labels: t,
-                                editDisabledReason: editDisabledReason,
-                                discussDisabledReason: discussDisabledReason,
                                 onOpenUri: onOpenUri,
-                                onEdit: onEdit,
-                                onDiscuss: onDiscuss
+                                actions: defineActions?.(conflict)
                             }, conflict.id))
                     }) : 'directory' === kind && data?.files.length ? /*#__PURE__*/ jsx("ul", {
                         className: "ov-wiki-dashboard__files",
-                        children: data.files.map((file)=>/*#__PURE__*/ jsxs("li", {
+                        children: data.files.map((file)=>{
+                            const actions = defineActions?.(file) ?? [];
+                            return /*#__PURE__*/ jsxs("li", {
                                 children: [
                                     /*#__PURE__*/ jsx(WikiFileIcon, {
                                         name: file
@@ -477,13 +440,15 @@ function WikiDashboard(props) {
                                             })
                                         ]
                                     }),
-                                    onEdit ? /*#__PURE__*/ jsx(button_Button, {
-                                        size: "small",
-                                        onClick: ()=>onEdit(file),
-                                        children: t.edit
+                                    actions.length > 0 ? /*#__PURE__*/ jsx("div", {
+                                        className: "ov-wiki-dashboard__actions",
+                                        children: actions.map(({ key, ...action })=>/*#__PURE__*/ jsx(WikiActionButton, {
+                                                ...action
+                                            }, key))
                                     }) : null
                                 ]
-                            }, file))
+                            }, file);
+                        })
                     }) : /*#__PURE__*/ jsx(DashboardState, {
                         state: {
                             loading,

package/dist/fl~0.js

@@ -283,7 +283,7 @@ const ORDER = [
     'failure',
     'unknown'
 ];
-function ExperienceImpact({ data, labels: t, days, onDaysChange, outcomesState, trajectoriesState, onOpenUri }) {
+function ExperienceImpact({ data, labels: t, locale, days, onDaysChange, outcomesState, trajectoriesState, onOpenUri }) {
     const total = data.outcomes?.reduce((sum, item)=>sum + item.count, 0) ?? 0;
     const metrics = [
         {
@@ -304,7 +304,7 @@ function ExperienceImpact({ data, labels: t, days, onDaysChange, outcomesState,
         },
         {
             label: t.rate,
-            value: data.effect ? new Intl.NumberFormat('en-US', {
+            value: data.effect ? new Intl.NumberFormat(locale, {
                 style: 'percent',
                 maximumFractionDigits: 1
             }).format(data.effect.injectionRate) : void 0,
@@ -657,6 +657,7 @@ function ExperienceDashboardContent({ uri, data = {}, kind, tab: controlledTab,
                         /*#__PURE__*/ jsx(ExperienceImpact, {
                             data: result,
                             labels: t,
+                            locale: locale,
                             days: days,
                             onDaysChange: setDays,
                             outcomesState: states.outcomes ?? {},