import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import styled from "styled-components";
import { StateManager } from "../../../CommonUI/StateManagement/StateManager";
import { Connector } from "./Connector";
export const MissingRuleNode = ({ node, ruleDefinition }) => {
    const updateCallback = () => {
        StateManager.changed(node);
        StateManager.changed(ruleDefinition);
    };
    const onSetExpression = () => {
        node.setupEvaluation(ruleDefinition.getInputDefinition());
        updateCallback();
    };
    const onSetResult = () => {
        node.setupResult(ruleDefinition.getInputDefinition(), ruleDefinition.getRuleResult());
        updateCallback();
    };
    if (ruleDefinition.root === node) {
        return _jsx(RootEmptyRuleNodeRender, Object.assign({ onClick: onSetExpression }, { children: "Add Expression" }), void 0);
    }
    return (_jsxs(Wrapper, Object.assign({ id: node._id }, { children: [_jsxs(MissingRuleNodeRender, { children: [_jsx(MissingRuleNodeButton, Object.assign({ onClick: onSetResult }, { children: "Result" }), void 0),
                    _jsx(MissingRuleNodeButton, Object.assign({ onClick: onSetExpression }, { children: "Expression" }), void 0)] }, void 0),
            _jsx(Connector, { nodeid: node._id }, void 0)] }), void 0));
};
const MissingRuleNodeRender = styled.div `
    padding: 8px;
    border: 1px dashed rgba(39, 41, 50, 0.3);
    border-radius: 4px;

    display: flex;

    > * {
        margin-left: 8px;

        &:first-child {
            margin-left: 0px;
        }
    }
`;
const MissingRuleNodeButton = styled.div `
    background: #e1e3f0;

    color: #4050a6;

    box-shadow: 0px 2px 4px -2px rgba(39, 41, 50, 0.04);
    border-radius: 4px;

    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 17px;
    letter-spacing: 0em;
    text-align: center;

    padding: 5px 12px;

    cursor: pointer;

    &:hover {
        background: linear-gradient(0deg, rgba(64, 80, 166, 0.15), rgba(64, 80, 166, 0.15)), #e1e3f0;
    }
`;
const RootEmptyRuleNodeRender = styled.div `
    background: linear-gradient(0deg, rgba(64, 80, 166, 0.5), rgba(64, 80, 166, 0.5)), #ffffff;
    border-radius: 4px;

    padding: 13px 20px;

    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 17px;
    letter-spacing: 0px;
    text-align: center;

    color: #ffffff;
    cursor: pointer;

    max-width: 131px;

    &:hover {
        background: linear-gradient(0deg, rgba(64, 80, 166, 0.8), rgba(64, 80, 166, 0.8)), #ffffff;
    }
`;
const Wrapper = styled.div `
    padding: 4px;
    position: relative;
    border: 2px solid transparent;
`;
//# sourceMappingURL=MissingRuleNode.js.map