import { debounce } from '@reltio/mdm-sdk';
import { useCallback, useEffect, useState } from 'react';
var AttributeStates;
(function (AttributeStates) {
    AttributeStates["Reading"] = "Reading";
    AttributeStates["Hovered"] = "Hovered";
    AttributeStates["Editing"] = "Editing";
})(AttributeStates || (AttributeStates = {}));
var HIDE_INTERVAL = 50;
export var useAttributeState = function () {
    var _a = useState(null), attributeState = _a[0], setAttributeState = _a[1];
    var isReadingMode = attributeState === AttributeStates.Reading;
    var isEditingMode = attributeState === AttributeStates.Editing;
    var isHovered = attributeState === AttributeStates.Hovered;
    useEffect(function () {
        setAttributeState(AttributeStates.Reading);
    }, []);
    // eslint-disable-next-line react-hooks/exhaustive-deps
    var setAttributeStateDebounced = useCallback(debounce(setAttributeState, HIDE_INTERVAL), []);
    var onMouseEnter = useCallback(function () {
        if (!isEditingMode)
            setAttributeStateDebounced(AttributeStates.Hovered);
    }, [setAttributeStateDebounced, isEditingMode]);
    var onMouseLeave = useCallback(function () {
        if (!isEditingMode)
            setAttributeStateDebounced(AttributeStates.Reading);
    }, [setAttributeStateDebounced, isEditingMode]);
    var setReadingMode = useCallback(function () { return setAttributeState(AttributeStates.Reading); }, [setAttributeState]);
    var setEditingMode = useCallback(function () { return setAttributeState(AttributeStates.Editing); }, [setAttributeState]);
    return {
        setReadingMode: setReadingMode,
        setEditingMode: setEditingMode,
        onMouseLeave: onMouseLeave,
        onMouseEnter: onMouseEnter,
        isReadingMode: isReadingMode,
        isEditingMode: isEditingMode,
        isHovered: isHovered
    };
};
