import React, { useCallback } from 'react';
import { CellNumberInput } from '@wix/patterns-fields';
import { classes } from './Edit.st.css.js';
export const NumberEdit = ({ value, onChange, onCommit, onCancel, inputRef, }) => {
    const handleKeyDown = useCallback((e) => {
        if (e.key === 'Enter') {
            e.preventDefault();
            onCommit();
        }
        else if (e.key === 'Escape') {
            e.preventDefault();
            onCancel();
        }
    }, [onCommit, onCancel]);
    const handleBlur = useCallback(() => {
        onCommit();
    }, [onCommit]);
    return (React.createElement(CellNumberInput, { inputRef: (instance) => {
            if (inputRef) {
                inputRef.current = instance;
            }
        }, size: "small", border: "none", value: value ?? undefined, onChange: (val) => onChange(val ?? null), onKeyDown: handleKeyDown, onBlur: handleBlur, className: classes.numberInput }));
};
//# sourceMappingURL=Edit.js.map