@ministryofjustice/frontend 3.5.0 → 3.6.1

package/moj/components/multi-file-upload/multi-file-upload.js

@@ -1,347 +1,140 @@
 (function (global, factory) {
-	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
-	typeof define === 'function' && define.amd ? define(factory) :
-	(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.MOJFrontend = factory());
-})(this, (function () { 'use strict';
-
-	function getDefaultExportFromCjs (x) {
-		return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
-	}
-
-	var _global_window_jQuery = window.jQuery;
-
-	var helpers;
-	var hasRequiredHelpers;
-
-	function requireHelpers () {
-		if (hasRequiredHelpers) return helpers;
-		hasRequiredHelpers = 1;
-		function removeAttributeValue(el, attr, value) {
-		  let re, m;
-		  if (el.getAttribute(attr)) {
-		    if (el.getAttribute(attr) === value) {
-		      el.removeAttribute(attr);
-		    } else {
-		      re = new RegExp(`(^|\\s)${value}(\\s|$)`);
-		      m = el.getAttribute(attr).match(re);
-		      if (m && m.length === 3) {
-		        el.setAttribute(
-		          attr,
-		          el.getAttribute(attr).replace(re, m[1] && m[2] ? ' ' : '')
-		        );
-		      }
-		    }
-		  }
-		}
-
-		function addAttributeValue(el, attr, value) {
-		  let re;
-		  if (!el.getAttribute(attr)) {
-		    el.setAttribute(attr, value);
-		  } else {
-		    re = new RegExp(`(^|\\s)${value}(\\s|$)`);
-		    if (!re.test(el.getAttribute(attr))) {
-		      el.setAttribute(attr, `${el.getAttribute(attr)} ${value}`);
-		    }
-		  }
-		}
-
-		function dragAndDropSupported() {
-		  const div = document.createElement('div');
-		  return typeof div.ondrop !== 'undefined'
-		}
-
-		function formDataSupported() {
-		  return typeof FormData === 'function'
-		}
-
-		function fileApiSupported() {
-		  const input = document.createElement('input');
-		  input.type = 'file';
-		  return typeof input.files !== 'undefined'
-		}
-
-		function nodeListForEach(nodes, callback) {
-		  if (window.NodeList.prototype.forEach) {
-		    return nodes.forEach(callback)
-		  }
-		  for (let i = 0; i < nodes.length; i++) {
-		    callback.call(window, nodes[i], i, nodes);
-		  }
-		}
-
-		/**
-		 * Find an elements next sibling
-		 *
-		 * Utility function to find an elements next sibling matching the provided
-		 * selector.
-		 *
-		 * @param {HTMLElement} $element - Element to find siblings for
-		 * @param {string} selector - selector for required sibling
-		 */
-		function getNextSibling($element, selector) {
-		  if (!$element) return
-		  // Get the next sibling element
-		  let $sibling = $element.nextElementSibling;
-
-		  // If there's no selector, return the first sibling
-		  if (!selector) return $sibling
-
-		  // If the sibling matches our selector, use it
-		  // If not, jump to the next sibling and continue the loop
-		  while ($sibling) {
-		    if ($sibling.matches(selector)) return $sibling
-		    $sibling = $sibling.nextElementSibling;
-		  }
-		}
-
-		/**
-		 * Find an elements preceding sibling
-		 *
-		 * Utility function to find an elements previous sibling matching the provided
-		 * selector.
-		 *
-		 * @param {HTMLElement} $element - Element to find siblings for
-		 * @param {string} selector - selector for required sibling
-		 */
-		function getPreviousSibling($element, selector) {
-		  if (!$element) return
-		  // Get the previous sibling element
-		  let $sibling = $element.previousElementSibling;
-
-		  // If there's no selector, return the first sibling
-		  if (!selector) return $sibling
-
-		  // If the sibling matches our selector, use it
-		  // If not, jump to the next sibling and continue the loop
-		  while ($sibling) {
-		    if ($sibling.matches(selector)) return $sibling
-		    $sibling = $sibling.previousElementSibling;
-		  }
-		}
-
-		function findNearestMatchingElement($element, selector) {
-		  // If no element or selector is provided, return null
-		  if (!$element) return
-		  if (!selector) return
-
-		  // Start with the current element
-		  let $currentElement = $element;
-
-		  while ($currentElement) {
-		    // First check the current element
-		    if ($currentElement.matches(selector)) {
-		      return $currentElement
-		    }
-
-		    // Check all previous siblings
-		    let $sibling = $currentElement.previousElementSibling;
-		    while ($sibling) {
-		      // Check if the sibling itself is a heading
-		      if ($sibling.matches(selector)) {
-		        return $sibling
-		      }
-		      $sibling = $sibling.previousElementSibling;
-		    }
-
-		    // If no match found in siblings, move up to parent
-		    $currentElement = $currentElement.parentElement;
-		  }
-		}
-
-		/**
-		 * Move focus to element
-		 *
-		 * Sets tabindex to -1 to make the element programmatically focusable,
-		 * but removes it on blur as the element doesn't need to be focused again.
-		 *
-		 * @param {HTMLElement} $element - HTML element
-		 * @param {object} [options] - Handler options
-		 * @param {function(this: HTMLElement): void} [options.onBeforeFocus] - Callback before focus
-		 * @param {function(this: HTMLElement): void} [options.onBlur] - Callback on blur
-		 */
-		function setFocus($element, options = {}) {
-		  const isFocusable = $element.getAttribute('tabindex');
-
-		  if (!isFocusable) {
-		    $element.setAttribute('tabindex', '-1');
-		  }
-
-		  /**
-		   * Handle element focus
-		   */
-		  function onFocus() {
-		    $element.addEventListener('blur', onBlur, { once: true });
-		  }
-
-		  /**
-		   * Handle element blur
-		   */
-		  function onBlur() {
-		    if (options.onBlur) {
-		      options.onBlur.call($element);
-		    }
-
-		    if (!isFocusable) {
-		      $element.removeAttribute('tabindex');
-		    }
-		  }
-
-		  // Add listener to reset element on blur, after focus
-		  $element.addEventListener('focus', onFocus, { once: true });
-
-		  // Focus element
-		  if (options.onBeforeFocus) {
-		    options.onBeforeFocus.call($element);
-		  }
-		  $element.focus();
-		}
-
-		helpers = {
-		  removeAttributeValue,
-		  addAttributeValue,
-		  dragAndDropSupported,
-		  formDataSupported,
-		  fileApiSupported,
-		  nodeListForEach,
-		  getNextSibling,
-		  getPreviousSibling,
-		  findNearestMatchingElement,
-		  setFocus
-		};
-		return helpers;
-	}
-
-	var multiFileUpload$1;
-	var hasRequiredMultiFileUpload;
-
-	function requireMultiFileUpload () {
-		if (hasRequiredMultiFileUpload) return multiFileUpload$1;
-		hasRequiredMultiFileUpload = 1;
-		const $ = _global_window_jQuery;
-
-		const {
-		  dragAndDropSupported,
-		  fileApiSupported,
-		  formDataSupported
-		} = requireHelpers();
-
-		function MultiFileUpload(params) {
-		  if (!(dragAndDropSupported() && formDataSupported() && fileApiSupported())) {
-		    return
-		  }
-
-		  this.defaultParams = {
-		    uploadFileEntryHook: $.noop,
-		    uploadFileExitHook: $.noop,
-		    uploadFileErrorHook: $.noop,
-		    fileDeleteHook: $.noop,
-		    uploadStatusText: 'Uploading files, please wait',
-		    dropzoneHintText: 'Drag and drop files here or',
-		    dropzoneButtonText: 'Choose files'
-		  };
-
-		  this.params = $.extend({}, this.defaultParams, params);
-		  this.container = $(this.params.container);
-
-		  this.container.addClass('moj-multi-file-upload--enhanced');
-
-		  this.feedbackContainer = this.container.find(
-		    '.moj-multi-file__uploaded-files'
-		  );
-		  this.setupFileInput();
-		  this.setupDropzone();
-		  this.setupLabel();
-		  this.setupStatusBox();
-		  this.container.on(
-		    'click',
-		    '.moj-multi-file-upload__delete',
-		    $.proxy(this, 'onFileDeleteClick')
-		  );
-		}
-
-		MultiFileUpload.prototype.setupDropzone = function () {
-		  this.fileInput.wrap('<div class="moj-multi-file-upload__dropzone" />');
-		  this.dropzone = this.container.find('.moj-multi-file-upload__dropzone');
-		  this.dropzone.on('dragover', $.proxy(this, 'onDragOver'));
-		  this.dropzone.on('dragleave', $.proxy(this, 'onDragLeave'));
-		  this.dropzone.on('drop', $.proxy(this, 'onDrop'));
-		};
-
-		MultiFileUpload.prototype.setupLabel = function () {
-		  this.label = $(
-		    `<label for="${this.fileInput[0].id}" class="govuk-button govuk-button--secondary">${this.params.dropzoneButtonText}</label>`
-		  );
-		  this.dropzone.append(
-		    `<p class="govuk-body">${this.params.dropzoneHintText}</p>`
-		  );
-		  this.dropzone.append(this.label);
-		};
-
-		MultiFileUpload.prototype.setupFileInput = function () {
-		  this.fileInput = this.container.find('.moj-multi-file-upload__input');
-		  this.fileInput.on('change', $.proxy(this, 'onFileChange'));
-		  this.fileInput.on('focus', $.proxy(this, 'onFileFocus'));
-		  this.fileInput.on('blur', $.proxy(this, 'onFileBlur'));
-		};
-
-		MultiFileUpload.prototype.setupStatusBox = function () {
-		  this.status = $(
-		    '<div aria-live="polite" role="status" class="govuk-visually-hidden" />'
-		  );
-		  this.dropzone.append(this.status);
-		};
-
-		MultiFileUpload.prototype.onDragOver = function (e) {
-		  e.preventDefault();
-		  this.dropzone.addClass('moj-multi-file-upload--dragover');
-		};
-
-		MultiFileUpload.prototype.onDragLeave = function () {
-		  this.dropzone.removeClass('moj-multi-file-upload--dragover');
-		};
-
-		MultiFileUpload.prototype.onDrop = function (e) {
-		  e.preventDefault();
-		  this.dropzone.removeClass('moj-multi-file-upload--dragover');
-		  this.feedbackContainer.removeClass('moj-hidden');
-		  this.status.html(this.params.uploadStatusText);
-		  this.uploadFiles(e.originalEvent.dataTransfer.files);
-		};
-
-		MultiFileUpload.prototype.uploadFiles = function (files) {
-		  for (let i = 0; i < files.length; i++) {
-		    this.uploadFile(files[i]);
-		  }
-		};
-
-		MultiFileUpload.prototype.onFileChange = function (e) {
-		  this.feedbackContainer.removeClass('moj-hidden');
-		  this.status.html(this.params.uploadStatusText);
-		  this.uploadFiles(e.currentTarget.files);
-		  this.fileInput.replaceWith($(e.currentTarget).val('').clone(true));
-		  this.setupFileInput();
-		  this.fileInput.get(0).focus();
-		};
-
-		MultiFileUpload.prototype.onFileFocus = function (e) {
-		  this.label.addClass('moj-multi-file-upload--focused');
-		};
-
-		MultiFileUpload.prototype.onFileBlur = function (e) {
-		  this.label.removeClass('moj-multi-file-upload--focused');
-		};
-
-		MultiFileUpload.prototype.getSuccessHtml = function (success) {
-		  return `<span class="moj-multi-file-upload__success"> <svg class="moj-banner__icon" fill="currentColor" role="presentation" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 25" height="25" width="25"><path d="M25,6.2L8.7,23.2L0,14.1l4-4.2l4.7,4.9L21,2L25,6.2z"/></svg>${success.messageHtml}</span>`
-		};
-
-		MultiFileUpload.prototype.getErrorHtml = function (error) {
-		  return `<span class="moj-multi-file-upload__error"> <svg class="moj-banner__icon" fill="currentColor" role="presentation" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 25" height="25" width="25"><path d="M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z"/></svg>${error.message}</span>`
-		};
-
-		MultiFileUpload.prototype.getFileRowHtml = function (file) {
-		  const html = `
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+  typeof define === 'function' && define.amd ? define(['exports'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.MOJFrontend = global.MOJFrontend || {}));
+})(this, (function (exports) { 'use strict';
+
+  function dragAndDropSupported() {
+    const div = document.createElement('div');
+    return typeof div.ondrop !== 'undefined'
+  }
+
+  function formDataSupported() {
+    return typeof FormData === 'function'
+  }
+
+  function fileApiSupported() {
+    const input = document.createElement('input');
+    input.type = 'file';
+    return typeof input.files !== 'undefined'
+  }
+
+  function MultiFileUpload(params) {
+    if (!(dragAndDropSupported() && formDataSupported() && fileApiSupported())) {
+      return
+    }
+
+    this.defaultParams = {
+      uploadFileEntryHook: window.jQuery.noop,
+      uploadFileExitHook: window.jQuery.noop,
+      uploadFileErrorHook: window.jQuery.noop,
+      fileDeleteHook: window.jQuery.noop,
+      uploadStatusText: 'Uploading files, please wait',
+      dropzoneHintText: 'Drag and drop files here or',
+      dropzoneButtonText: 'Choose files'
+    };
+
+    this.params = window.jQuery.extend({}, this.defaultParams, params);
+    this.container = window.jQuery(this.params.container);
+
+    this.container.addClass('moj-multi-file-upload--enhanced');
+
+    this.feedbackContainer = this.container.find(
+      '.moj-multi-file__uploaded-files'
+    );
+    this.setupFileInput();
+    this.setupDropzone();
+    this.setupLabel();
+    this.setupStatusBox();
+    this.container.on(
+      'click',
+      '.moj-multi-file-upload__delete',
+      window.jQuery.proxy(this, 'onFileDeleteClick')
+    );
+  }
+
+  MultiFileUpload.prototype.setupDropzone = function () {
+    this.fileInput.wrap('<div class="moj-multi-file-upload__dropzone" />');
+    this.dropzone = this.container.find('.moj-multi-file-upload__dropzone');
+    this.dropzone.on('dragover', window.jQuery.proxy(this, 'onDragOver'));
+    this.dropzone.on('dragleave', window.jQuery.proxy(this, 'onDragLeave'));
+    this.dropzone.on('drop', window.jQuery.proxy(this, 'onDrop'));
+  };
+
+  MultiFileUpload.prototype.setupLabel = function () {
+    this.label = window.jQuery(
+      `<label for="${this.fileInput[0].id}" class="govuk-button govuk-button--secondary">${this.params.dropzoneButtonText}</label>`
+    );
+    this.dropzone.append(
+      `<p class="govuk-body">${this.params.dropzoneHintText}</p>`
+    );
+    this.dropzone.append(this.label);
+  };
+
+  MultiFileUpload.prototype.setupFileInput = function () {
+    this.fileInput = this.container.find('.moj-multi-file-upload__input');
+    this.fileInput.on('change', window.jQuery.proxy(this, 'onFileChange'));
+    this.fileInput.on('focus', window.jQuery.proxy(this, 'onFileFocus'));
+    this.fileInput.on('blur', window.jQuery.proxy(this, 'onFileBlur'));
+  };
+
+  MultiFileUpload.prototype.setupStatusBox = function () {
+    this.status = window.jQuery(
+      '<div aria-live="polite" role="status" class="govuk-visually-hidden" />'
+    );
+    this.dropzone.append(this.status);
+  };
+
+  MultiFileUpload.prototype.onDragOver = function (e) {
+    e.preventDefault();
+    this.dropzone.addClass('moj-multi-file-upload--dragover');
+  };
+
+  MultiFileUpload.prototype.onDragLeave = function () {
+    this.dropzone.removeClass('moj-multi-file-upload--dragover');
+  };
+
+  MultiFileUpload.prototype.onDrop = function (e) {
+    e.preventDefault();
+    this.dropzone.removeClass('moj-multi-file-upload--dragover');
+    this.feedbackContainer.removeClass('moj-hidden');
+    this.status.html(this.params.uploadStatusText);
+    this.uploadFiles(e.originalEvent.dataTransfer.files);
+  };
+
+  MultiFileUpload.prototype.uploadFiles = function (files) {
+    for (let i = 0; i < files.length; i++) {
+      this.uploadFile(files[i]);
+    }
+  };
+
+  MultiFileUpload.prototype.onFileChange = function (e) {
+    this.feedbackContainer.removeClass('moj-hidden');
+    this.status.html(this.params.uploadStatusText);
+    this.uploadFiles(e.currentTarget.files);
+    this.fileInput.replaceWith(window.jQuery(e.currentTarget).val('').clone(true));
+    this.setupFileInput();
+    this.fileInput.get(0).focus();
+  };
+
+  MultiFileUpload.prototype.onFileFocus = function (e) {
+    this.label.addClass('moj-multi-file-upload--focused');
+  };
+
+  MultiFileUpload.prototype.onFileBlur = function (e) {
+    this.label.removeClass('moj-multi-file-upload--focused');
+  };
+
+  MultiFileUpload.prototype.getSuccessHtml = function (success) {
+    return `<span class="moj-multi-file-upload__success"> <svg class="moj-banner__icon" fill="currentColor" role="presentation" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 25" height="25" width="25"><path d="M25,6.2L8.7,23.2L0,14.1l4-4.2l4.7,4.9L21,2L25,6.2z"/></svg>${success.messageHtml}</span>`
+  };
+
+  MultiFileUpload.prototype.getErrorHtml = function (error) {
+    return `<span class="moj-multi-file-upload__error"> <svg class="moj-banner__icon" fill="currentColor" role="presentation" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 25" height="25" width="25"><path d="M13.6,15.4h-2.3v-4.5h2.3V15.4z M13.6,19.8h-2.3v-2.2h2.3V19.8z M0,23.2h25L12.5,2L0,23.2z"/></svg>${error.message}</span>`
+  };
+
+  MultiFileUpload.prototype.getFileRowHtml = function (file) {
+    const html = `
     <div class="govuk-summary-list__row moj-multi-file-upload__row">;
       <div class="govuk-summary-list__value moj-multi-file-upload__message">;
     <span class="moj-multi-file-upload__filename">${file.name}</span>;
@@ -349,106 +142,99 @@
       </div>';
       <div class="govuk-summary-list__actions moj-multi-file-upload__actions"></div>;
     </div>`;
-		  return html
-		};
+    return html
+  };
 
-		MultiFileUpload.prototype.getDeleteButtonHtml = function (file) {
-		  return `<button class="moj-multi-file-upload__delete govuk-button govuk-button--secondary govuk-!-margin-bottom-0" type="button" name="delete" value="${file.filename}">
+  MultiFileUpload.prototype.getDeleteButtonHtml = function (file) {
+    return `<button class="moj-multi-file-upload__delete govuk-button govuk-button--secondary govuk-!-margin-bottom-0" type="button" name="delete" value="${file.filename}">
       Delete <span class="govuk-visually-hidden">${file.originalname}</span>
     </button>`
-		};
-
-		MultiFileUpload.prototype.uploadFile = function (file) {
-		  this.params.uploadFileEntryHook(this, file);
-		  const item = $(this.getFileRowHtml(file));
-		  const formData = new FormData();
-		  formData.append('documents', file);
-		  this.feedbackContainer.find('.moj-multi-file-upload__list').append(item);
-
-		  $.ajax({
-		    url: this.params.uploadUrl,
-		    type: 'post',
-		    data: formData,
-		    processData: false,
-		    contentType: false,
-		    success: $.proxy(function (response) {
-		      if (response.error) {
-		        item
-		          .find('.moj-multi-file-upload__message')
-		          .html(this.getErrorHtml(response.error));
-		        this.status.html(response.error.message);
-		      } else {
-		        item
-		          .find('.moj-multi-file-upload__message')
-		          .html(this.getSuccessHtml(response.success));
-		        this.status.html(response.success.messageText);
-		      }
-		      item
-		        .find('.moj-multi-file-upload__actions')
-		        .append(this.getDeleteButtonHtml(response.file));
-		      this.params.uploadFileExitHook(this, file, response);
-		    }, this),
-		    error: $.proxy(function (jqXHR, textStatus, errorThrown) {
-		      this.params.uploadFileErrorHook(
-		        this,
-		        file,
-		        jqXHR,
-		        textStatus,
-		        errorThrown
-		      );
-		    }, this),
-		    xhr: function () {
-		      const xhr = new XMLHttpRequest();
-		      xhr.upload.addEventListener(
-		        'progress',
-		        function (e) {
-		          if (e.lengthComputable) {
-		            let percentComplete = e.loaded / e.total;
-		            percentComplete = parseInt(percentComplete * 100, 10);
-		            item
-		              .find('.moj-multi-file-upload__progress')
-		              .text(` ${percentComplete}%`);
-		          }
-		        },
-		        false
-		      );
-		      return xhr
-		    }
-		  });
-		};
-
-		MultiFileUpload.prototype.onFileDeleteClick = function (e) {
-		  e.preventDefault(); // if user refreshes page and then deletes
-		  const button = $(e.currentTarget);
-		  const data = {};
-		  data[button[0].name] = button[0].value;
-		  $.ajax({
-		    url: this.params.deleteUrl,
-		    type: 'post',
-		    dataType: 'json',
-		    data,
-		    success: $.proxy(function (response) {
-		      if (response.error) ; else {
-		        button.parents('.moj-multi-file-upload__row').remove();
-		        if (
-		          this.feedbackContainer.find('.moj-multi-file-upload__row').length ===
-		          0
-		        ) {
-		          this.feedbackContainer.addClass('moj-hidden');
-		        }
-		      }
-		      this.params.fileDeleteHook(this, response);
-		    }, this)
-		  });
-		};
-
-		multiFileUpload$1 = { MultiFileUpload };
-		return multiFileUpload$1;
-	}
-
-	var multiFileUploadExports = requireMultiFileUpload();
-	var multiFileUpload = /*@__PURE__*/getDefaultExportFromCjs(multiFileUploadExports);
-
-	return multiFileUpload;
+  };
+
+  MultiFileUpload.prototype.uploadFile = function (file) {
+    this.params.uploadFileEntryHook(this, file);
+    const item = window.jQuery(this.getFileRowHtml(file));
+    const formData = new FormData();
+    formData.append('documents', file);
+    this.feedbackContainer.find('.moj-multi-file-upload__list').append(item);
+
+    window.jQuery.ajax({
+      url: this.params.uploadUrl,
+      type: 'post',
+      data: formData,
+      processData: false,
+      contentType: false,
+      success: window.jQuery.proxy(function (response) {
+        if (response.error) {
+          item
+            .find('.moj-multi-file-upload__message')
+            .html(this.getErrorHtml(response.error));
+          this.status.html(response.error.message);
+        } else {
+          item
+            .find('.moj-multi-file-upload__message')
+            .html(this.getSuccessHtml(response.success));
+          this.status.html(response.success.messageText);
+        }
+        item
+          .find('.moj-multi-file-upload__actions')
+          .append(this.getDeleteButtonHtml(response.file));
+        this.params.uploadFileExitHook(this, file, response);
+      }, this),
+      error: window.jQuery.proxy(function (jqXHR, textStatus, errorThrown) {
+        this.params.uploadFileErrorHook(
+          this,
+          file,
+          jqXHR,
+          textStatus,
+          errorThrown
+        );
+      }, this),
+      xhr: function () {
+        const xhr = new XMLHttpRequest();
+        xhr.upload.addEventListener(
+          'progress',
+          function (e) {
+            if (e.lengthComputable) {
+              let percentComplete = e.loaded / e.total;
+              percentComplete = parseInt(percentComplete * 100, 10);
+              item
+                .find('.moj-multi-file-upload__progress')
+                .text(` ${percentComplete}%`);
+            }
+          },
+          false
+        );
+        return xhr
+      }
+    });
+  };
+
+  MultiFileUpload.prototype.onFileDeleteClick = function (e) {
+    e.preventDefault(); // if user refreshes page and then deletes
+    const button = window.jQuery(e.currentTarget);
+    const data = {};
+    data[button[0].name] = button[0].value;
+    window.jQuery.ajax({
+      url: this.params.deleteUrl,
+      type: 'post',
+      dataType: 'json',
+      data,
+      success: window.jQuery.proxy(function (response) {
+        if (response.error) ; else {
+          button.parents('.moj-multi-file-upload__row').remove();
+          if (
+            this.feedbackContainer.find('.moj-multi-file-upload__row').length ===
+            0
+          ) {
+            this.feedbackContainer.addClass('moj-hidden');
+          }
+        }
+        this.params.fileDeleteHook(this, response);
+      }, this)
+    });
+  };
+
+  exports.MultiFileUpload = MultiFileUpload;
 
 }));