import $ from 'jquery';
export const colorPicker = ()=>{
    $('.develux-color-picker-js').on('input',function(){
        const color = $(this).val();
       $(this).parent().find('.color-hex-js').val(color);
    });
    const isValidHex = (value) => /^#[0-9A-Fa-f]{6}$/.test(value);
    let debounceTimeout;
    $('.color-hex-js').on('input', function () {
        clearTimeout(debounceTimeout);
        const $that = $(this);
        debounceTimeout = setTimeout(() => {
            const value = $that.val();
            if (value.length === 7 && isValidHex(value)) {
                const $colorPicker = $that.parent().find('.develux-color-picker-js');
                $colorPicker.val(value);
                $colorPicker.trigger('input');
            }
        }, 300);
    });

}