/**
 * File Textbox Options component
 * Configuration for HazoCollabFormFileTextbox fields:
 * classification prompt_area/prompt_key, available tags, file_accept, max_files
 */
'use client';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useCallback, useState } from 'react';
import { HiPlus, HiX } from 'react-icons/hi';
const TAG_COLORS = [
    'bg-blue-100 text-blue-800',
    'bg-green-100 text-green-800',
    'bg-amber-100 text-amber-800',
    'bg-purple-100 text-purple-800',
    'bg-pink-100 text-pink-800',
    'bg-cyan-100 text-cyan-800',
    'bg-orange-100 text-orange-800',
    'bg-red-100 text-red-800',
];
export function FileTextboxOptions({ config, on_config_change, id_prefix = 'ftx', hide_classification = false, hide_tags = false, }) {
    const [new_tag_label, set_new_tag_label] = useState('');
    const update = useCallback((partial) => {
        on_config_change({ ...config, ...partial });
    }, [config, on_config_change]);
    const handle_add_tag = useCallback(() => {
        const label = new_tag_label.trim();
        if (!label)
            return;
        const tag_id = label.toLowerCase().replace(/\s+/g, '_');
        const existing = config.available_tags ?? [];
        if (existing.some((t) => t.tag_id === tag_id))
            return;
        const color = TAG_COLORS[existing.length % TAG_COLORS.length];
        update({ available_tags: [...existing, { tag_id, tag_label: label, color }] });
        set_new_tag_label('');
    }, [new_tag_label, config.available_tags, update]);
    const handle_remove_tag = useCallback((tag_id) => {
        update({
            available_tags: (config.available_tags ?? []).filter((t) => t.tag_id !== tag_id),
        });
    }, [config.available_tags, update]);
    const handle_update_tag_description = useCallback((tag_id, description) => {
        update({
            available_tags: (config.available_tags ?? []).map((t) => t.tag_id === tag_id ? { ...t, description: description || undefined } : t),
        });
    }, [config.available_tags, update]);
    return (_jsxs("div", { className: "cls_file_textbox_options space-y-4", children: [!hide_classification && (_jsxs("div", { className: "space-y-3", children: [_jsx("label", { className: "text-sm font-medium leading-none", children: "Classification" }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("label", { htmlFor: `${id_prefix}-prompt-area`, className: "text-xs text-muted-foreground", children: "Prompt Area" }), _jsx("input", { id: `${id_prefix}-prompt-area`, type: "text", value: config.prompt_area ?? '', onChange: (e) => update({ prompt_area: e.target.value || undefined }), placeholder: "e.g. tax_forms", className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { htmlFor: `${id_prefix}-prompt-key`, className: "text-xs text-muted-foreground", children: "Prompt Key" }), _jsx("input", { id: `${id_prefix}-prompt-key`, type: "text", value: config.prompt_key ?? '', onChange: (e) => update({ prompt_key: e.target.value || undefined }), placeholder: "e.g. classify_documents", className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2" })] })] })] })), !hide_tags && (_jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-sm font-medium leading-none", children: "Classification Tags" }), (config.available_tags ?? []).length > 0 && (_jsx("div", { className: "space-y-1.5", children: (config.available_tags ?? []).map((tag) => (_jsxs("div", { className: "flex items-start gap-2 p-2 rounded border bg-muted/20", children: [_jsx("span", { className: `inline-flex items-center px-2 py-0.5 rounded text-xs font-medium flex-shrink-0 mt-0.5 ${tag.color ?? 'bg-gray-100 text-gray-800'}`, children: tag.tag_label }), _jsx("input", { type: "text", value: tag.description ?? '', onChange: (e) => handle_update_tag_description(tag.tag_id, e.target.value), placeholder: "Description (optional, used in LLM prompt)", className: "flex-1 h-7 rounded border border-input bg-background px-2 text-xs placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring" }), _jsx("button", { type: "button", onClick: () => handle_remove_tag(tag.tag_id), className: "p-0.5 text-muted-foreground hover:text-destructive flex-shrink-0 mt-0.5", title: `Remove "${tag.tag_label}"`, children: _jsx(HiX, { className: "h-3.5 w-3.5" }) })] }, tag.tag_id))) })), _jsxs("div", { className: "flex gap-2", children: [_jsx("input", { type: "text", value: new_tag_label, onChange: (e) => set_new_tag_label(e.target.value), onKeyDown: (e) => {
                                    if (e.key === 'Enter') {
                                        e.preventDefault();
                                        handle_add_tag();
                                    }
                                }, placeholder: "New tag label...", className: "flex-1 h-8 rounded-md border border-input bg-background px-2 text-sm placeholder:text-muted-foreground focus:outline-none focus:ring-1 focus:ring-ring" }), _jsx("button", { type: "button", onClick: handle_add_tag, disabled: !new_tag_label.trim(), className: "h-8 px-2 rounded-md border border-input text-sm hover:bg-accent disabled:opacity-50 disabled:cursor-not-allowed", title: "Add tag", children: _jsx(HiPlus, { className: "h-4 w-4" }) })] })] })), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("div", { className: "space-y-1", children: [_jsx("label", { htmlFor: `${id_prefix}-file-accept`, className: "text-xs text-muted-foreground", children: "Accepted File Types" }), _jsx("input", { id: `${id_prefix}-file-accept`, type: "text", value: config.file_accept ?? '', onChange: (e) => update({ file_accept: e.target.value || undefined }), placeholder: ".pdf,.jpg,.png", className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2" })] }), _jsxs("div", { className: "space-y-1", children: [_jsx("label", { htmlFor: `${id_prefix}-max-files`, className: "text-xs text-muted-foreground", children: "Max Files" }), _jsx("input", { id: `${id_prefix}-max-files`, type: "number", min: 1, max: 100, value: config.max_files ?? '', onChange: (e) => update({ max_files: e.target.value ? parseInt(e.target.value, 10) : undefined }), placeholder: "10", className: "flex h-9 w-full rounded-md border border-input bg-background px-3 py-1 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2" })] })] })] }));
}
//# sourceMappingURL=file_textbox_options.js.map