import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { X } from "lucide-react";
import { Button } from "../../components/ui/button";
import { RuleElementPicker } from "./RuleElementPicker";
import { RuleParameterInput } from "./RuleParameterInput";
import { createAction } from "./utils";
function getElement(elements, id) {
    return elements.find((element) => element.id === id);
}
export function ActionList({ actions, elements, disabled, onChange, }) {
    return (_jsxs("div", { className: "space-y-2", children: [actions.length === 0 && (_jsx("div", { className: "border-border-default text-2xs text-neutral-grey-50 rounded border border-dashed px-3 py-2", children: "When the conditions match, this rule will run the actions you add here." })), actions.map((action, index) => {
                const element = getElement(elements, action.definitionItemId);
                return (_jsx("div", { className: "border-border-default rounded border border-l-2 border-l-violet-400 bg-white p-3", children: _jsxs("div", { className: "flex items-start justify-between gap-2", children: [_jsx("div", { className: "min-w-0 flex-1", children: element ? (_jsx(RuleParameterInput, { element: element, values: action.parameters, disabled: disabled, onChange: (parameters) => onChange(actions.map((existing, i) => i === index ? { ...existing, parameters } : existing)) })) : (_jsxs("div", { className: "text-neutral-grey-50 text-xs", children: ["Unknown action (", action.definitionItemId, ")"] })) }), _jsx(Button, { type: "button", size: "xxs", variant: "ghost", disabled: disabled, onClick: () => onChange(actions.filter((_, i) => i !== index)), "aria-label": "Remove action", title: "Remove action", className: "shrink-0 px-1", children: _jsx(X, { strokeWidth: 1, className: "size-3" }) })] }) }, action.uid || index));
            }), _jsx(RuleElementPicker, { elements: elements, kind: "action", label: "Add action", disabled: disabled, fullWidth: true, onPick: (element) => onChange([...actions, createAction(element.id)]) })] }));
}
//# sourceMappingURL=ActionList.js.map