"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ConditionItemBody = ConditionItemBody;
exports.SortableConditionItem = SortableConditionItem;
const i18n_1 = __importDefault(require("../../../../../../locales/i18n.js"));
const react_1 = __importDefault(require("react"));
const cn_ui_1 = require("@cainiaofe/cn-ui");
const sortable_1 = require("@dnd-kit/sortable");
const utilities_1 = require("@dnd-kit/utilities");
const use_ai_table_icons_1 = require("../../../../../../cn-ai-table/view/hooks/use-ai-table-icons");
/**
 * 条件项内容(前缀 + 拖拽把手 + 业务内容 + 删除按钮),
 * SortableConditionItem 与 DragOverlay 共用,保证浮层与原项 1:1。
 */
function ConditionItemBody(props) {
    const { index, condition, conditions, showAndBeforeCondition, onRemove, renderConditionItem, dragEnabled, dragHandleRef, dragHandleListeners, dragHandleAttributes, } = props;
    const icons = (0, use_ai_table_icons_1.useAiTableIcons)();
    return (react_1.default.createElement(react_1.default.Fragment, null,
        showAndBeforeCondition ? (react_1.default.createElement("span", { className: "condition-item-and-slot" }, index === 0
            ? i18n_1.default.get({ id: 'When', dm: '当' })
            : i18n_1.default.get({ id: 'Moreover', dm: '且' }))) : null,
        dragEnabled && (react_1.default.createElement("div", { className: "drag-handle", ref: dragHandleRef, ...(dragHandleAttributes !== null && dragHandleAttributes !== void 0 ? dragHandleAttributes : {}), ...(dragHandleListeners !== null && dragHandleListeners !== void 0 ? dragHandleListeners : {}) },
            react_1.default.createElement("img", { src: icons.CONDITION_DRAG_HANDLE, alt: i18n_1.default.get({ id: 'Drag', dm: '拖拽' }), draggable: false }))),
        renderConditionItem(condition, index),
        react_1.default.createElement(cn_ui_1.CnButton, { text: true, onClick: () => onRemove(index), className: "delete-btn" },
            react_1.default.createElement("img", { src: icons.CONDITION_DELETE, alt: i18n_1.default.get({ id: 'Delete', dm: '删除' }), draggable: false }))));
}
/**
 * 可拖拽的条件项组件
 * 使用 @dnd-kit/sortable 的 useSortable 实现拖拽排序,
 * 通过 setActivatorNodeRef 将拖拽感知限定在把手区域,避免与内部控件交互冲突。
 */
function SortableConditionItem(props) {
    const { id, index, condition, conditions, showAndBeforeCondition, onRemove, renderConditionItem, dragEnabled, } = props;
    // 刚拖拽结束的项禁用 layout animation,防止出现回弹到原位的视觉闪烁
    const animateLayoutChanges = (args) => {
        if (args.wasDragging)
            return false;
        return (0, sortable_1.defaultAnimateLayoutChanges)(args);
    };
    const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging, } = (0, sortable_1.useSortable)({ id, disabled: !dragEnabled, animateLayoutChanges });
    const style = {
        transform: utilities_1.CSS.Transform.toString(transform),
        transition,
        opacity: isDragging ? 0.5 : undefined,
    };
    return (react_1.default.createElement("div", { ref: setNodeRef, style: style, className: "condition-item" },
        react_1.default.createElement(ConditionItemBody, { index: index, condition: condition, conditions: conditions, showAndBeforeCondition: showAndBeforeCondition, onRemove: onRemove, renderConditionItem: renderConditionItem, dragEnabled: dragEnabled, dragHandleRef: setActivatorNodeRef, dragHandleListeners: listeners, dragHandleAttributes: attributes })));
}
