@openviking/react 0.1.5 → 0.1.7

package/dist/components/wiki-dashboard/types.d.ts

@@ -0,0 +1,92 @@
+import type { HTMLAttributes } from 'react';
+export interface WikiConflict {
+    id: string;
+    matchText: string;
+    description: string;
+    reason: string;
+    severity: 'high' | 'medium' | 'low';
+    state: 'unfixed' | 'fixed';
+    beginTime: number;
+    fixTime: number | null;
+    fixPlan: string;
+    resolutionBasis: string;
+    resolutionSource?: 'manual' | 'automatic';
+    location: {
+        status: 'unique';
+        start: number;
+        end: number;
+        line: number;
+    } | {
+        status: 'missing' | 'ambiguous';
+    };
+}
+export interface WikiDirectoryData {
+    files: readonly string[];
+    conflictFileCount?: number;
+    limited?: boolean;
+}
+export interface WikiFileData {
+    conflicts: readonly WikiConflict[];
+    /** Document path to display; omitted paths hide the path column. */
+    path?: string;
+}
+export type WikiDashboardData = WikiDirectoryData | WikiFileData;
+export interface WikiDashboardLabels {
+    title: string;
+    pendingLabel: string;
+    discuss: string;
+    conflicts: string;
+    conflictFiles: string;
+    pending: string;
+    all: string;
+    severity: string;
+    high: string;
+    medium: string;
+    low: string;
+    fixed: string;
+    reason: string;
+    file: string;
+    empty: string;
+    loading: string;
+    failed: string;
+    retry: string;
+    open: string;
+    edit: string;
+    solution: string;
+    occurred: string;
+    fixedAt: string;
+    evidence: string;
+    history: string;
+    historyHint: string;
+    unavailable: string;
+    limited: string;
+}
+interface WikiDashboardCommonProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    loading?: boolean;
+    error?: Error | null;
+    locale?: 'en-US' | 'zh-CN';
+    onRetry?: () => void;
+    labels?: Partial<WikiDashboardLabels>;
+}
+export type WikiDashboardProps = WikiDashboardCommonProps & ({
+    kind: 'directory';
+    data?: WikiDirectoryData;
+    editDisabledReason?: never;
+    discussDisabledReason?: never;
+    onOpenUri?: (uri: string) => void;
+    onOpenDashboard?: (uri: string) => void;
+    onEdit?: (uri: string) => void;
+    onDiscuss?: never;
+} | {
+    kind: 'file';
+    data?: WikiFileData;
+    /** Explanation shown when editing has no handler. Defaults to labels.unavailable. */
+    editDisabledReason?: string;
+    /** Explanation shown when discussion has no handler. Defaults to labels.unavailable. */
+    discussDisabledReason?: string;
+    onOpenUri?: () => void;
+    onOpenDashboard?: never;
+    onEdit?: (conflict: WikiConflict) => void;
+    onDiscuss?: (conflict: WikiConflict) => void;
+});
+export {};

package/dist/components/wiki-dashboard/wiki-action-button.d.ts

@@ -0,0 +1,9 @@
+import type { ReactNode } from 'react';
+export declare function WikiActionButton({ label, hint, onClick, children, ...aria }: {
+    label: string;
+    hint: string;
+    onClick?: () => void;
+    children: ReactNode;
+    'aria-expanded'?: boolean;
+    'aria-controls'?: string;
+}): import("react").JSX.Element;

package/dist/components/wiki-dashboard/wiki-conflict-card.d.ts

@@ -0,0 +1,15 @@
+import type { WikiConflict, WikiDashboardProps, WikiDashboardLabels } from './types.js';
+export declare function WikiConflictCard({ conflict, path, labels: t, editDisabledReason, discussDisabledReason, onOpenUri, onEdit, onDiscuss, }: {
+    conflict: WikiConflict;
+    path?: string;
+    labels: WikiDashboardLabels;
+    editDisabledReason?: string;
+    discussDisabledReason?: string;
+    onOpenUri?: () => void;
+    onEdit?: Extract<WikiDashboardProps, {
+        kind: 'file';
+    }>['onEdit'];
+    onDiscuss?: Extract<WikiDashboardProps, {
+        kind: 'file';
+    }>['onDiscuss'];
+}): import("react").JSX.Element;

package/dist/components/wiki-dashboard/wiki-dashboard.d.ts

@@ -0,0 +1,2 @@
+import type { WikiDashboardProps } from './types.js';
+export declare function WikiDashboard(props: WikiDashboardProps): import("react").JSX.Element;

package/dist/components/wiki-dashboard/wiki-file-icon.d.ts

@@ -0,0 +1,3 @@
+export declare function WikiFileIcon({ name }: {
+    name: string;
+}): import("react").JSX.Element;

package/dist/components/wiki-dashboard/wiki-severity-filter.d.ts

@@ -0,0 +1,8 @@
+import type { WikiConflict, WikiDashboardLabels } from './types.js';
+type Severity = WikiConflict['severity'] | 'all';
+export declare function WikiSeverityFilter({ value, onChange, labels: t, }: {
+    value: Severity;
+    onChange: (value: Severity) => void;
+    labels: WikiDashboardLabels;
+}): import("react").JSX.Element;
+export {};

package/dist/components/wiki-dashboard.js

@@ -0,0 +1 @@
+export { WikiDashboard } from "../fj~0.js";

package/dist/c~0.js

@@ -2,9 +2,9 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { Suspense, createContext, forwardRef, lazy, useContext, useEffect, useId, useRef, useState, useSyncExternalStore } from "react";
 import { createPortal } from "react-dom";
 import { resolveLocale } from "./nx~0.js";
-import { useOverlayPosition } from "./o~0.js";
+import { Tooltip, useOverlayPosition } from "./rt~0.js";
 import { useLocale, LocaleProvider } from "./28~0.js";
-import { Tooltip } from "./r~0.js";
+import { button_Button } from "./e~0.js";
 import { VikingBotIcon } from "./lg~0.js";
 import { VikingBotInteraction } from "./w~0.js";
 const en_US_messages = {
@@ -204,9 +204,12 @@ function VikingBotSessionActions({ sessions, extra, labels: overrides, locale: l
                             trigger: (props)=>/*#__PURE__*/ jsx(Tooltip, {
                                     content: labels.sessionHistory,
                                     disabled: true === props['aria-expanded'],
-                                    children: /*#__PURE__*/ jsx("button", {
+                                    children: /*#__PURE__*/ jsx(button_Button, {
                                         ...props,
-                                        type: "button",
+                                        size: "mini",
+                                        type: "text",
+                                        iconOnly: true,
+                                        htmlType: "button",
                                         className: "ov-viking-bot__header-action",
                                         "aria-label": labels.sessionHistory,
                                         children: /*#__PURE__*/ jsx(VikingBotIcon, {
@@ -258,8 +261,10 @@ function VikingBotSessionActions({ sessions, extra, labels: overrides, locale: l
                                                 }, item.id);
                                             })
                                         }),
-                                        sessions.hasMore && sessions.onLoadMore ? /*#__PURE__*/ jsx("button", {
-                                            type: "button",
+                                        sessions.hasMore && sessions.onLoadMore ? /*#__PURE__*/ jsx(button_Button, {
+                                            size: "small",
+                                            type: "default",
+                                            htmlType: "button",
                                             disabled: sessions.isLoading,
                                             onClick: sessions.onLoadMore,
                                             children: labels.loadMore
@@ -269,8 +274,11 @@ function VikingBotSessionActions({ sessions, extra, labels: overrides, locale: l
                         }),
                         /*#__PURE__*/ jsx(Tooltip, {
                             content: labels.newSession,
-                            children: /*#__PURE__*/ jsx("button", {
-                                type: "button",
+                            children: /*#__PURE__*/ jsx(button_Button, {
+                                size: "mini",
+                                type: "text",
+                                iconOnly: true,
+                                htmlType: "button",
                                 className: "ov-viking-bot__header-action",
                                 "aria-label": labels.newSession,
                                 onClick: sessions.onNew,

package/dist/ep~0.js

@@ -0,0 +1,345 @@
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useEffect, useId, useRef, useState } from "react";
+import { createPortal } from "react-dom";
+import { useLocale } from "./28~0.js";
+import { resolveLocale } from "./nx~0.js";
+import { button_Button } from "./e~0.js";
+function useTourAnchor(target, locateTarget, timeout, attempt) {
+    const [state, setState] = useState({
+        anchor: null,
+        failed: false
+    });
+    useEffect(()=>{
+        const controller = new AbortController();
+        setState({
+            anchor: null,
+            failed: false
+        });
+        const timer = window.setTimeout(()=>{
+            controller.abort();
+            setState({
+                anchor: null,
+                failed: true
+            });
+        }, timeout);
+        Promise.resolve().then(()=>locateTarget?.(target, controller.signal) ?? null).then((anchor)=>{
+            if (controller.signal.aborted) return;
+            window.clearTimeout(timer);
+            if (anchor?.isConnected) {
+                anchor.scrollIntoView({
+                    block: 'nearest',
+                    inline: 'nearest'
+                });
+                setState({
+                    anchor,
+                    failed: false
+                });
+            } else setState({
+                anchor: null,
+                failed: true
+            });
+        }, ()=>{
+            if (controller.signal.aborted) return;
+            window.clearTimeout(timer);
+            setState({
+                anchor: null,
+                failed: true
+            });
+        });
+        return ()=>{
+            controller.abort();
+            window.clearTimeout(timer);
+        };
+    }, [
+        target,
+        locateTarget,
+        timeout,
+        attempt
+    ]);
+    return state;
+}
+function useTourPosition(anchor, surface, placement) {
+    const [position, setPosition] = useState();
+    useEffect(()=>{
+        if (!surface) return;
+        surface.showPopover?.();
+        const update = ()=>{
+            const a = anchor?.getBoundingClientRect();
+            const box = surface.getBoundingClientRect();
+            const width = window.innerWidth;
+            const height = window.innerHeight;
+            const margin = 8;
+            let left = (width - box.width) / 2;
+            let top = (height - box.height) / 2;
+            const missing = Boolean(anchor && !anchor.isConnected);
+            let visible = !anchor || missing;
+            if (anchor && a && !missing) {
+                let clip = {
+                    left: 0,
+                    top: 0,
+                    right: width,
+                    bottom: height
+                };
+                for(let parent = anchor.parentElement; parent; parent = parent.parentElement){
+                    const css = window.getComputedStyle(parent);
+                    const rect = parent.getBoundingClientRect();
+                    if (/(auto|scroll|hidden|clip)/.test(css.overflowX)) clip = {
+                        ...clip,
+                        left: Math.max(clip.left, rect.left),
+                        right: Math.min(clip.right, rect.right)
+                    };
+                    if (/(auto|scroll|hidden|clip)/.test(css.overflowY)) clip = {
+                        ...clip,
+                        top: Math.max(clip.top, rect.top),
+                        bottom: Math.min(clip.bottom, rect.bottom)
+                    };
+                }
+                visible = anchor.isConnected && a.width > 0 && a.height > 0 && a.top < clip.bottom && a.bottom > clip.top && a.left < clip.right && a.right > clip.left;
+                const right = a.right + 6;
+                const leftSide = a.left - box.width - 6;
+                left = 'right' === placement ? right + box.width <= width - margin || leftSide < margin ? right : leftSide : leftSide >= margin || right + box.width > width - margin ? leftSide : right;
+                top = a.top - 16;
+                const css = window.getComputedStyle(anchor);
+                for(let i = 0; i < css.length; i++){
+                    const name = css[i];
+                    if (name?.startsWith('--ov-ui-')) surface.style.setProperty(name, css.getPropertyValue(name));
+                }
+            }
+            const next = {
+                left: Math.max(margin, Math.min(left, width - box.width - margin)),
+                top: Math.max(margin, Math.min(top, height - box.height - margin)),
+                targetTop: a?.top ?? 0,
+                targetLeft: a?.left ?? 0,
+                targetWidth: a?.width ?? 0,
+                targetHeight: a?.height ?? 0,
+                visible,
+                missing
+            };
+            setPosition((old)=>old && Object.keys(next).every((key)=>old[key] === next[key]) ? old : next);
+        };
+        update();
+        const resize = new ResizeObserver(update);
+        resize.observe(surface);
+        for(let node = anchor; node; node = node.parentElement)resize.observe(node);
+        const mutation = new MutationObserver(update);
+        mutation.observe(document.body, {
+            childList: true,
+            subtree: true
+        });
+        window.addEventListener('scroll', update, true);
+        window.addEventListener('resize', update);
+        window.visualViewport?.addEventListener('resize', update);
+        window.visualViewport?.addEventListener('scroll', update);
+        return ()=>{
+            resize.disconnect();
+            mutation.disconnect();
+            window.removeEventListener('scroll', update, true);
+            window.removeEventListener('resize', update);
+            window.visualViewport?.removeEventListener('resize', update);
+            window.visualViewport?.removeEventListener('scroll', update);
+            if (surface.isConnected) surface.hidePopover?.();
+        };
+    }, [
+        anchor,
+        surface,
+        placement
+    ]);
+    return position;
+}
+const messages = {
+    close: 'Close guide',
+    next: 'Next',
+    done: 'Got it',
+    locating: 'Locating directory…',
+    unavailable: 'This directory is unavailable. Retry or skip this step.',
+    retry: 'Retry',
+    skip: 'Skip',
+    progress: (current, total)=>`${current}/${total}`
+};
+const en_US = messages;
+const zh_CN_messages = {
+    close: '关闭引导',
+    next: '下一步',
+    done: '知道了',
+    locating: '正在定位目录…',
+    unavailable: '此目录暂不可用，请重试或跳过这一步。',
+    retry: '重试',
+    skip: '跳过',
+    progress: (current, total)=>`${current}/${total}`
+};
+const zh_CN = zh_CN_messages;
+function DirectoryTour(props) {
+    if (!props.open || 0 === props.steps.length) return null;
+    return /*#__PURE__*/ jsx(TourSession, {
+        ...props
+    });
+}
+function TourSession(props) {
+    const [index, setIndex] = useState(props.defaultStep ?? 0);
+    const skipped = useRef(new Set());
+    const current = props.currentStep ?? index;
+    const step = props.steps[current];
+    if (!step) return null;
+    const advance = (skip)=>{
+        if (skip) skipped.current.add(step.id);
+        if (current === props.steps.length - 1) props.onComplete?.({
+            skippedStepIds: [
+                ...skipped.current
+            ]
+        });
+        else {
+            if (void 0 === props.currentStep) setIndex(current + 1);
+            props.onStepChange?.(current + 1);
+        }
+    };
+    return /*#__PURE__*/ jsx(TourStep, {
+        ...props,
+        step: step,
+        index: current,
+        advance: advance
+    }, step.id);
+}
+function TourStep({ step, index, advance, steps, locateTarget, locateTimeout = 10000, placement = 'right', onClose, labels, locale: localeProp, className, style }) {
+    const locale = useLocale(localeProp);
+    const text = resolveLocale({
+        'en-US': en_US,
+        'zh-CN': zh_CN
+    }, locale, labels);
+    const [attempt, retry] = useState(0);
+    const [surface, setSurface] = useState(null);
+    const { anchor, failed } = useTourAnchor(step.target, locateTarget, locateTimeout, attempt);
+    const position = useTourPosition(anchor, surface, placement);
+    const titleId = useId();
+    const bodyId = useId();
+    useEffect(()=>{
+        const close = (event)=>{
+            if ('Escape' === event.key) {
+                event.preventDefault();
+                onClose?.();
+            }
+        };
+        document.addEventListener('keydown', close);
+        return ()=>document.removeEventListener('keydown', close);
+    }, [
+        onClose
+    ]);
+    useEffect(()=>{
+        const previous = document.activeElement;
+        return ()=>{
+            if (previous instanceof HTMLElement && previous.isConnected) previous.focus({
+                preventScroll: true
+            });
+        };
+    }, []);
+    const visible = position?.visible;
+    useEffect(()=>{
+        if (surface && visible) surface.focus({
+            preventScroll: true
+        });
+    }, [
+        surface,
+        visible
+    ]);
+    if ("u" < typeof document) return null;
+    const unavailable = failed || position?.missing;
+    const locating = !anchor && !failed;
+    return /*#__PURE__*/ createPortal(/*#__PURE__*/ jsxs("div", {
+        ref: setSurface,
+        popover: "manual",
+        role: "dialog",
+        "aria-modal": "false",
+        "aria-labelledby": titleId,
+        "aria-describedby": bodyId,
+        "aria-busy": locating,
+        tabIndex: -1,
+        className: [
+            'ov-directory-tour',
+            className
+        ].filter(Boolean).join(' '),
+        style: {
+            ...style,
+            top: position?.top ?? 0,
+            left: position?.left ?? 0,
+            visibility: position?.visible ? 'visible' : 'hidden'
+        },
+        children: [
+            anchor && !unavailable && position?.visible && /*#__PURE__*/ jsx("div", {
+                className: "ov-directory-tour__highlight",
+                "aria-hidden": "true",
+                style: {
+                    top: position.targetTop,
+                    left: position.targetLeft,
+                    width: position.targetWidth,
+                    height: position.targetHeight
+                }
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: "ov-directory-tour__card",
+                children: [
+                    onClose && /*#__PURE__*/ jsx(button_Button, {
+                        size: "mini",
+                        type: "text",
+                        iconOnly: true,
+                        className: "ov-directory-tour__close",
+                        htmlType: "button",
+                        "aria-label": text.close,
+                        onClick: onClose,
+                        children: "\xd7"
+                    }),
+                    !locating && !unavailable && step.illustration && /*#__PURE__*/ jsx("div", {
+                        className: "ov-directory-tour__illustration",
+                        children: step.illustration
+                    }),
+                    /*#__PURE__*/ jsx("h2", {
+                        id: titleId,
+                        className: "ov-directory-tour__title",
+                        children: step.title
+                    }),
+                    /*#__PURE__*/ jsx("div", {
+                        id: bodyId,
+                        className: "ov-directory-tour__description",
+                        role: unavailable ? 'alert' : void 0,
+                        children: unavailable ? text.unavailable : locating ? text.locating : step.description
+                    }),
+                    /*#__PURE__*/ jsxs("footer", {
+                        className: "ov-directory-tour__actions",
+                        children: [
+                            /*#__PURE__*/ jsx("span", {
+                                className: "ov-directory-tour__progress",
+                                "aria-live": "polite",
+                                children: text.progress(index + 1, steps.length)
+                            }),
+                            unavailable ? /*#__PURE__*/ jsxs(Fragment, {
+                                children: [
+                                    /*#__PURE__*/ jsx(button_Button, {
+                                        size: "small",
+                                        type: "default",
+                                        htmlType: "button",
+                                        onClick: ()=>retry((value)=>value + 1),
+                                        children: text.retry
+                                    }),
+                                    /*#__PURE__*/ jsx(button_Button, {
+                                        size: "small",
+                                        type: "default",
+                                        htmlType: "button",
+                                        onClick: ()=>advance(true),
+                                        children: text.skip
+                                    })
+                                ]
+                            }) : /*#__PURE__*/ jsx(button_Button, {
+                                size: "small",
+                                type: "primary",
+                                htmlType: "button",
+                                className: "ov-directory-tour__primary",
+                                disabled: locating,
+                                onClick: ()=>advance(false),
+                                children: step.nextLabel ?? (index === steps.length - 1 ? text.done : text.next)
+                            })
+                        ]
+                    })
+                ]
+            })
+        ]
+    }), document.body);
+}
+export { DirectoryTour };