/**
 * KebabMenu component for consolidated field controls
 *
 * Renders a 3-dots menu button with dropdown for field controls
 * that are not shown inline.
 *
 * Uses Radix Popover for proper positioning that handles:
 * - Parent CSS transforms
 * - Scrollable containers
 * - Collision detection
 */
'use client';
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState, useCallback } from 'react';
import * as PopoverPrimitive from '@radix-ui/react-popover';
import { IoEllipsisVertical, IoChatbox, IoDocumentText, IoEye, IoEyeOff, IoLockClosed, IoLockOpen, IoTrashOutline, IoRefresh, } from 'react-icons/io5';
import { HiPencil } from 'react-icons/hi';
import { cn } from '../../../utils/cn.js';
import { HazoChat } from 'hazo_chat';
import { createClientLogger } from 'hazo_logs/ui';
import { CollabFormNotesIcon } from '../../hazo_collab_form_base.js';
// Create default logger for HazoChat
const chat_logger = createClientLogger({ packageName: 'hazo_chat' });
import { CONTROL_SIZE, NOTES_ICON_SIZE } from './constants.js';
/**
 * Get chat status display class
 * Matches form view: default is black (no class), colored only for activity
 */
function get_chat_status_class(status) {
    switch (status) {
        case 'has_unread':
            return 'text-destructive';
        case 'has_messages':
            return 'text-orange-500';
        default:
            return ''; // Black by default, matching form view
    }
}
/**
 * Resolve effective chat status from metadata
 */
function resolve_chat_status(metadata) {
    if (metadata.chat_status)
        return metadata.chat_status;
    if (metadata.has_chat_messages)
        return 'has_messages';
    return 'none';
}
/**
 * KebabMenu component
 */
export function KebabMenu({ controls, control_states, metadata, callbacks, config, has_indicator, indicator_status, field_id, class_name, }) {
    const [is_open, set_is_open] = useState(false);
    const [chat_open, set_chat_open] = useState(false);
    const [notes_dialog_open, set_notes_dialog_open] = useState(false);
    // If no controls, don't render
    if (controls.length === 0) {
        return null;
    }
    // Determine which controls are in the menu
    const has_chat = controls.includes('control_chat');
    const has_notes = controls.includes('control_notes');
    const has_visibility = controls.includes('control_visibility');
    const has_lock = controls.includes('control_lock');
    const has_delete = controls.includes('control_delete');
    const has_edit_field = controls.includes('control_edit_field');
    const has_delete_field = controls.includes('control_delete_field');
    const has_edit_elements = controls.includes('control_edit_elements');
    const has_revalidate = controls.includes('control_revalidate');
    // Get states
    const chat_state = control_states.control_chat;
    const notes_state = control_states.control_notes;
    const visibility_state = control_states.control_visibility;
    const lock_state = control_states.control_lock;
    const delete_state = control_states.control_delete;
    const edit_field_state = control_states.control_edit_field;
    const delete_field_state = control_states.control_delete_field;
    const edit_elements_state = control_states.control_edit_elements;
    const revalidate_state = control_states.control_revalidate;
    const effective_chat_status = resolve_chat_status(metadata);
    const has_notes_data = (metadata.notes?.length ?? 0) > 0;
    // Determine indicator color class
    const get_indicator_icon_class = () => {
        if (!has_indicator)
            return 'text-muted-foreground';
        if (indicator_status === 'unread')
            return 'text-destructive';
        return 'text-orange-500';
    };
    // Handle menu item clicks
    const handle_chat_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        set_chat_open(!chat_open);
        set_is_open(false);
    }, [chat_open]);
    const handle_notes_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        set_notes_dialog_open(true);
        set_is_open(false);
    }, []);
    const handle_visibility_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (visibility_state.enabled) {
            callbacks.on_visibility_change?.(metadata.visibility === 'hidden' ? 'visible' : 'hidden');
            set_is_open(false);
        }
    }, [visibility_state.enabled, callbacks, metadata.visibility]);
    const handle_lock_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (lock_state.enabled) {
            callbacks.on_lock_change?.(!(metadata.locked === true));
            set_is_open(false);
        }
    }, [lock_state.enabled, callbacks, metadata.locked]);
    const handle_delete_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (delete_state.enabled) {
            callbacks.on_delete?.();
            set_is_open(false);
        }
    }, [delete_state.enabled, callbacks]);
    const handle_edit_elements_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (edit_elements_state.enabled) {
            callbacks.on_edit_elements?.();
            set_is_open(false);
        }
    }, [edit_elements_state.enabled, callbacks]);
    const handle_edit_field_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (edit_field_state.enabled) {
            callbacks.on_edit_field?.();
            set_is_open(false);
        }
    }, [edit_field_state.enabled, callbacks]);
    const handle_delete_field_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (delete_field_state.enabled) {
            callbacks.on_delete_field?.();
            set_is_open(false);
        }
    }, [delete_field_state.enabled, callbacks]);
    const handle_revalidate_click = useCallback((e) => {
        e.preventDefault();
        e.stopPropagation();
        if (revalidate_state.enabled) {
            callbacks.on_revalidate?.();
            set_is_open(false);
        }
    }, [revalidate_state.enabled, callbacks]);
    // Determine if separator is needed
    const has_top_section = has_chat || has_notes;
    const has_bottom_section = has_visibility || has_lock || has_delete || has_edit_field || has_delete_field || has_edit_elements || has_revalidate;
    const show_separator = has_top_section && has_bottom_section;
    return (_jsxs(_Fragment, { children: [_jsx("div", { className: cn('relative', class_name), children: _jsxs(PopoverPrimitive.Root, { open: is_open, onOpenChange: set_is_open, children: [_jsx(PopoverPrimitive.Trigger, { asChild: true, children: _jsx("button", { type: "button", className: cn('cls_unified_controls_kebab flex items-center justify-center rounded-md bg-transparent text-muted-foreground transition-colors hover:bg-accent hover:text-accent-foreground', CONTROL_SIZE.button, has_indicator && 'bg-slate-100'), title: "More options", children: _jsx(IoEllipsisVertical, { className: cn(CONTROL_SIZE.icon, get_indicator_icon_class()) }) }) }), _jsx(PopoverPrimitive.Portal, { children: _jsxs(PopoverPrimitive.Content, { className: "cls_unified_kebab_menu z-50 border rounded-lg shadow-lg py-1 whitespace-nowrap animate-in fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=top]:slide-in-from-bottom-2", style: { backgroundColor: 'var(--popover, white)' }, align: "end", sideOffset: 4, collisionPadding: 16, children: [has_chat && (_jsxs("button", { type: "button", onClick: handle_chat_click, disabled: !chat_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', chat_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [_jsx(IoChatbox, { className: cn('h-4 w-4 flex-shrink-0', get_chat_status_class(effective_chat_status)) }), _jsx("span", { children: "Open chat" }), effective_chat_status === 'has_unread' && _jsx("span", { className: "text-xs text-destructive", children: "(unread)" }), effective_chat_status === 'has_messages' && _jsx("span", { className: "text-xs text-orange-500", children: "(messages)" })] })), has_notes && (_jsxs("button", { type: "button", onClick: handle_notes_click, disabled: !notes_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', notes_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [_jsx(IoDocumentText, { className: cn('h-4 w-4 flex-shrink-0', has_notes_data && 'text-amber-600') }), _jsx("span", { children: "Notes" }), has_notes_data && metadata.notes && metadata.notes.length > 0 && (_jsxs("span", { className: "text-xs text-amber-600", children: ["(", metadata.notes.length, ")"] }))] })), show_separator && (_jsx("div", { className: "border-t my-1" })), has_lock && (_jsxs("button", { type: "button", onClick: handle_lock_click, disabled: !lock_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', lock_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [metadata.locked === true ? (_jsx(IoLockClosed, { className: "h-4 w-4 flex-shrink-0 text-slate-600" })) : (_jsx(IoLockOpen, { className: "h-4 w-4 flex-shrink-0" })), _jsx("span", { children: metadata.locked === true ? 'Unlock field' : 'Lock field' })] })), has_visibility && (_jsxs("button", { type: "button", onClick: handle_visibility_click, disabled: !visibility_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', visibility_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [metadata.visibility === 'hidden' ? (_jsx(IoEyeOff, { className: "h-4 w-4 flex-shrink-0 text-amber-600" })) : (_jsx(IoEye, { className: "h-4 w-4 flex-shrink-0" })), _jsx("span", { children: metadata.visibility === 'hidden' ? 'Show to responders' : 'Hide from responders' })] })), has_edit_field && (_jsxs("button", { type: "button", onClick: handle_edit_field_click, disabled: !edit_field_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', edit_field_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [_jsx(HiPencil, { className: "h-4 w-4 flex-shrink-0 text-amber-500" }), _jsx("span", { children: "Edit field" })] })), has_edit_elements && (_jsxs("button", { type: "button", onClick: handle_edit_elements_click, disabled: !edit_elements_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', edit_elements_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [_jsx(HiPencil, { className: "h-4 w-4 flex-shrink-0" }), _jsx("span", { children: "Edit element" })] })), has_revalidate && metadata.has_validation_rules && (_jsxs("button", { type: "button", onClick: handle_revalidate_click, disabled: !revalidate_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', revalidate_state.enabled ? 'hover:bg-muted' : 'opacity-50 cursor-not-allowed'), children: [_jsx(IoRefresh, { className: "h-4 w-4 flex-shrink-0" }), _jsx("span", { children: "Re-validate" })] })), has_delete_field && (_jsxs("button", { type: "button", onClick: handle_delete_field_click, disabled: !delete_field_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', delete_field_state.enabled ? 'hover:bg-muted text-destructive' : 'opacity-50 cursor-not-allowed text-muted-foreground'), children: [_jsx(IoTrashOutline, { className: "h-4 w-4 flex-shrink-0" }), _jsx("span", { children: "Remove field" })] })), has_delete && (_jsxs("button", { type: "button", onClick: handle_delete_click, disabled: !delete_state.enabled, className: cn('w-full flex items-center gap-2 px-3 py-2 text-sm transition-colors text-left', delete_state.enabled ? 'hover:bg-muted text-destructive' : 'opacity-50 cursor-not-allowed text-muted-foreground'), children: [_jsx(IoTrashOutline, { className: "h-4 w-4 flex-shrink-0" }), _jsx("span", { children: metadata.deleted ? 'Restore field' : 'Delete field' })] }))] }) })] }) }), chat_open && config?.chat_group_id && (_jsx("div", { className: "cls_unified_chat_container mt-2", children: _jsx(HazoChat, { ...{
                        chat_group_id: config.chat_group_id,
                        logger: chat_logger,
                        reference_id: field_id,
                        reference_type: "field",
                        api_base_url: config.chat_api_base_url,
                        timezone: config.chat_timezone,
                        read_only: config.chat_read_only,
                        log_polling: config.chat_log_polling ?? false,
                        on_close: () => set_chat_open(false),
                    } }) })), notes_dialog_open && (_jsx("div", { className: "cls_unified_notes_container", children: _jsx(CollabFormNotesIcon, { label: config?.label ?? field_id, ...(config?.notes_mode === 'api' ? {} : {
                        has_notes: has_notes_data,
                        notes: metadata.notes || [],
                        on_notes_change: notes_state.enabled ? (updated_notes) => {
                            callbacks.on_notes_change?.(updated_notes);
                            // Close the kebab notes panel when first note is added,
                            // so extraction takes over and shows inline notes icon
                            if (updated_notes.length > 0 && (metadata.notes?.length ?? 0) === 0) {
                                set_notes_dialog_open(false);
                            }
                        } : undefined,
                    }), disabled: !notes_state.enabled, current_user: config?.current_user, field_data_id: config?.field_data_id ?? field_id, icon_size: NOTES_ICON_SIZE, show_border: false, panel_style: "popover", background_color: config?.notes_background_color, save_mode: config?.notes_save_mode, open: true, onOpenChange: (open) => {
                        if (!open)
                            set_notes_dialog_open(false);
                    } }) }))] }));
}
//# sourceMappingURL=kebab_menu.js.map