import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Box, Text } from "ink";
import { useTerminalSize } from "../hooks/useTerminalSize.js";
import { Pane } from "./design/Pane.js";
import { StatusBadge } from "./design/StatusBadge.js";
import { truncateCells } from "./design/textLayout.js";
import { ValidationErrorsList } from "./ValidationErrorsList.js";
export function SkillPanel(props) {
    const { columns } = useTerminalSize();
    const width = Math.max(52, Math.min(112, columns - 4));
    return (_jsx(Box, { flexDirection: "column", marginBottom: 1, children: _jsxs(Pane, { width: width, title: "skills", tone: "brand", paddingX: 1, children: [_jsxs(Box, { flexDirection: "row", justifyContent: "space-between", children: [_jsxs(Box, { flexDirection: "column", children: [_jsx(Text, { bold: true, color: "cyan", children: props.model.title }), _jsx(Text, { color: "gray", children: truncateCells(props.model.subtitle, Math.max(24, width - 20)) })] }), _jsx(StatusBadge, { label: `${props.model.rows.length}`, tone: props.model.rows.length > 0 ? "brand" : "muted" })] }), _jsx(Box, { flexDirection: "column", marginTop: 1, children: props.model.rows.length === 0 ? (_jsx(Text, { color: "gray", children: "No skills discovered" })) : props.model.rows.map((row) => (_jsx(SkillPanelRowView, { row: row, width: width }, row.key))) }), props.model.preview && props.model.preview.length > 0 ? (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsx(Text, { color: "gray", children: "skill preview" }), props.model.preview.map((line, index) => (_jsx(Text, { color: "gray", children: truncateCells(`  ${line}`, Math.max(24, width - 4)) }, `${index}-${line}`)))] })) : null, _jsx(ValidationErrorsList, { errors: props.model.validationErrors ?? [], width: width - 2 }), _jsx(Text, { color: "gray", children: truncateCells(props.model.footer, Math.max(24, width - 4)) })] }) }));
}
export function skillListPanelModel(skills) {
    return {
        title: "Skills",
        subtitle: `${skills.length} discovered skill${skills.length === 1 ? "" : "s"}`,
        rows: skills.map((skill) => skillRow(skill.name, skill.scope, skill.description, skill.path, false)),
        footer: "/skills show <name> | /skills run <name> <task> | /skills create <name> <description>",
    };
}
export function skillSearchPanelModel(skills, query) {
    return {
        title: "Skill search",
        subtitle: query ? `query: ${query}` : "all skills",
        rows: skills.map((skill) => skillRow(skill.name, skill.scope, skill.description, sourceNote(skill.path, skill.source?.sourcePath), skill.disableModelInvocation)),
        footer: "/skills show <name> | /skills install <path-or-git-url> | /skills install <source> <name>",
    };
}
export function skillDetailPanelModel(skill) {
    return {
        title: `Skill: ${skill.name}`,
        subtitle: `${skill.scope} / ${skill.path}`,
        rows: [skillRow(skill.name, skill.scope, skill.frontmatter.description ?? skill.description, skill.path, Boolean(skill.frontmatter.disableModelInvocation))],
        preview: previewLines(skill.prompt),
        footer: `/skills run ${skill.name} <task> | /skills validate ${skill.name}`,
    };
}
export function skillValidationPanelModel(results) {
    return {
        title: "Skill validation",
        subtitle: `${results.length} validation result${results.length === 1 ? "" : "s"}`,
        rows: results.map((result) => ({
            key: result.name,
            name: result.name,
            status: result.ok ? "ok" : "failed",
            tone: result.ok ? "success" : "error",
            detail: result.path || "(missing)",
            note: [
                ...result.errors.map((error) => `error: ${error}`),
                ...result.warnings.map((warning) => `warning: ${warning}`),
            ].join("; "),
        })),
        validationErrors: results.flatMap((result) => [
            ...result.errors.map((error) => ({
                file: result.path || result.name,
                path: result.name,
                message: error,
                severity: "error",
            })),
            ...result.warnings.map((warning) => ({
                file: result.path || result.name,
                path: result.name,
                message: warning,
                severity: "warning",
            })),
        ]),
        footer: "/skills list | /skills show <name>",
    };
}
function SkillPanelRowView(props) {
    const detailWidth = Math.max(20, props.width - 38);
    const noteWidth = Math.max(20, props.width - 12);
    return (_jsxs(Box, { flexDirection: "column", marginBottom: 1, children: [_jsxs(Box, { flexDirection: "row", children: [_jsx(StatusBadge, { label: props.row.status, tone: props.row.tone }), _jsx(Text, { children: " " }), _jsx(Text, { color: "cyan", children: truncateCells(props.row.name.padEnd(20), 20) }), _jsx(Text, { color: "gray", children: truncateCells(props.row.detail, detailWidth) })] }), props.row.note ? (_jsxs(Box, { flexDirection: "row", children: [_jsx(Text, { color: "gray", children: "  " }), _jsx(Text, { color: "gray", children: truncateCells(props.row.note, noteWidth) })] })) : null] }));
}
function skillRow(name, scope, description, note, disableModelInvocation) {
    return {
        key: `${scope}/${name}`,
        name: `${scope}/${name}`,
        status: disableModelInvocation ? "local" : scope,
        tone: disableModelInvocation ? "warning" : toneForScope(scope),
        detail: description || "(no description)",
        note: disableModelInvocation ? `${note} / disable-model-invocation` : note,
    };
}
function toneForScope(scope) {
    if (scope === "project")
        return "success";
    if (scope === "user")
        return "brand";
    return "muted";
}
function sourceNote(path, sourcePath) {
    return sourcePath ? `${path} source=${sourcePath}` : path;
}
function previewLines(prompt) {
    return prompt
        .split(/\r?\n/)
        .map((line) => line.trim())
        .filter((line) => line && line !== "---")
        .slice(0, 6);
}
