Function NodeOutputHandler

packages/ui/src/views/canvas/NodeOutputHandler.jsx:21–225

({ outputAnchor, data, disabled = false })

// ===========================|| NodeOutputHandler ||=========================== //

const NodeOutputHandler = ({ outputAnchor, data, disabled = false }) => {
    const theme = useTheme()
    const ref = useRef(null)
    const updateNodeInternals = useUpdateNodeInternals()
    const [position, setPosition] = useState(0)
    const [clientHeight, setClientHeight] = useState(0)
    const [offsetTop, setOffsetTop] = useState(0)
    const [dropdownValue, setDropdownValue] = useState(null)
    const { reactFlowInstance } = useContext(flowContext)

    const getAvailableOptions = (options = []) => {
        return options.filter((option) => !option.hidden && !option.isAnchor)
    }

    const getAnchorOptions = (options = []) => {
        return options.filter((option) => !option.hidden && option.isAnchor)
    }

    const getAnchorPosition = (options, index) => {
        const spacing = clientHeight / (getAnchorOptions(options).length + 1)
        return offsetTop + spacing * (index + 1)
    }

    useEffect(() => {
        if (ref.current && ref.current?.offsetTop && ref.current?.clientHeight) {
            setTimeout(() => {
                setClientHeight(ref.current?.clientHeight)
                setOffsetTop(ref.current?.offsetTop)
                setPosition(ref.current?.offsetTop + ref.current?.clientHeight / 2)
                updateNodeInternals(data.id)
            }, 0)
        }
    }, [data.id, ref, updateNodeInternals])

    useEffect(() => {
        setTimeout(() => {
            updateNodeInternals(data.id)
        }, 0)
    }, [data.id, position, updateNodeInternals])

    useEffect(() => {
        if (dropdownValue) {
            setTimeout(() => {
                updateNodeInternals(data.id)
            }, 0)
        }
    }, [data.id, dropdownValue, updateNodeInternals])

    return (
        <div ref={ref}>
            {outputAnchor.type !== 'options' && !outputAnchor.options && (
                <>
                    <CustomWidthTooltip placement='right' title={outputAnchor.type}>
                        <Handle
                            type='source'
                            position={Position.Right}
                            key={outputAnchor.id}
                            id={outputAnchor.id}