const formType = 'aa-file';

function initPlugin(el, defaultOptions, libs) {
    var formWrap = el.classList.contains(formType) ? el : el.closest('.aa-file');
    if (formWrap === null) {
        console.error('could not create file plugin');
        return;
    }
    var fileInput = formWrap.querySelector(':scope .custom-file-input');
    var createPlugin = function () {
        return {
            wrap: formWrap,
            fileInput: fileInput,
            init() {
                this.fileInput.addEventListener('change', plugin.fileInputChangeListener.bind(this));
            },
            fileInputChangeListener(e) {
                var input = e.target;
                input.nextElementSibling.innerText = [...input.files].map((f) => f.name).join(', ');
            },
        }
    };


    var plugin = createPlugin();
    plugin.init();

    return plugin;
}

AAForm.addTypeHandler(formType, initPlugin);
