@ministryofjustice/frontend 4.0.1 → 5.0.0

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

@@ -0,0 +1,223 @@
+(function (global, factory) {
+  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';
+  }
+
+  /* eslint-disable @typescript-eslint/no-empty-function */
+
+  class MultiFileUpload {
+    /**
+     * @param {MultiFileUploadConfig} [params] - Multi file upload config
+     */
+    constructor(params = {}) {
+      const {
+        container
+      } = params;
+      if (!container || !(container instanceof HTMLElement) || !(dragAndDropSupported() && formDataSupported() && fileApiSupported())) {
+        return this;
+      }
+      this.container = container;
+      this.container.classList.add('moj-multi-file-upload--enhanced');
+      this.defaultParams = {
+        uploadFileEntryHook: () => {},
+        uploadFileExitHook: () => {},
+        uploadFileErrorHook: () => {},
+        fileDeleteHook: () => {},
+        uploadStatusText: 'Uploading files, please wait',
+        dropzoneHintText: 'Drag and drop files here or',
+        dropzoneButtonText: 'Choose files'
+      };
+      this.params = Object.assign({}, this.defaultParams, params);
+      this.feedbackContainer = /** @type {HTMLDivElement} */
+      this.container.querySelector('.moj-multi-file__uploaded-files');
+      this.setupFileInput();
+      this.setupDropzone();
+      this.setupLabel();
+      this.setupStatusBox();
+      this.container.addEventListener('click', this.onFileDeleteClick.bind(this));
+    }
+    setupDropzone() {
+      this.dropzone = document.createElement('div');
+      this.dropzone.classList.add('moj-multi-file-upload__dropzone');
+      this.dropzone.addEventListener('dragover', this.onDragOver.bind(this));
+      this.dropzone.addEventListener('dragleave', this.onDragLeave.bind(this));
+      this.dropzone.addEventListener('drop', this.onDrop.bind(this));
+      this.fileInput.replaceWith(this.dropzone);
+      this.dropzone.appendChild(this.fileInput);
+    }
+    setupLabel() {
+      const label = document.createElement('label');
+      label.setAttribute('for', this.fileInput.id);
+      label.classList.add('govuk-button', 'govuk-button--secondary');
+      label.textContent = this.params.dropzoneButtonText;
+      const hint = document.createElement('p');
+      hint.classList.add('govuk-body');
+      hint.textContent = this.params.dropzoneHintText;
+      this.label = label;
+      this.dropzone.append(hint);
+      this.dropzone.append(label);
+    }
+    setupFileInput() {
+      this.fileInput = /** @type {HTMLInputElement} */
+      this.container.querySelector('.moj-multi-file-upload__input');
+      this.fileInput.addEventListener('change', this.onFileChange.bind(this));
+      this.fileInput.addEventListener('focus', this.onFileFocus.bind(this));
+      this.fileInput.addEventListener('blur', this.onFileBlur.bind(this));
+    }
+    setupStatusBox() {
+      this.status = document.createElement('div');
+      this.status.classList.add('govuk-visually-hidden');
+      this.status.setAttribute('aria-live', 'polite');
+      this.status.setAttribute('role', 'status');
+      this.dropzone.append(this.status);
+    }
+    onDragOver(event) {
+      event.preventDefault();
+      this.dropzone.classList.add('moj-multi-file-upload--dragover');
+    }
+    onDragLeave() {
+      this.dropzone.classList.remove('moj-multi-file-upload--dragover');
+    }
+    onDrop(event) {
+      event.preventDefault();
+      this.dropzone.classList.remove('moj-multi-file-upload--dragover');
+      this.feedbackContainer.classList.remove('moj-hidden');
+      this.status.textContent = this.params.uploadStatusText;
+      this.uploadFiles(event.dataTransfer.files);
+    }
+    uploadFiles(files) {
+      for (const file of Array.from(files)) {
+        this.uploadFile(file);
+      }
+    }
+    onFileChange() {
+      this.feedbackContainer.classList.remove('moj-hidden');
+      this.status.textContent = this.params.uploadStatusText;
+      this.uploadFiles(this.fileInput.files);
+      const fileInput = this.fileInput.cloneNode(true);
+      if (!fileInput || !(fileInput instanceof HTMLInputElement)) {
+        return;
+      }
+      fileInput.value = '';
+      this.fileInput.replaceWith(fileInput);
+      this.setupFileInput();
+      this.fileInput.focus();
+    }
+    onFileFocus() {
+      this.label.classList.add('moj-multi-file-upload--focused');
+    }
+    onFileBlur() {
+      this.label.classList.remove('moj-multi-file-upload--focused');
+    }
+    getSuccessHtml(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>`;
+    }
+    getErrorHtml(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>`;
+    }
+    getFileRow(file) {
+      const row = document.createElement('div');
+      row.classList.add('govuk-summary-list__row', 'moj-multi-file-upload__row');
+      row.innerHTML = `
+    <div class="govuk-summary-list__value moj-multi-file-upload__message">
+      <span class="moj-multi-file-upload__filename">${file.name}</span>
+      <span class="moj-multi-file-upload__progress">0%</span>
+    </div>
+    <div class="govuk-summary-list__actions moj-multi-file-upload__actions"></div>
+  `;
+      return row;
+    }
+    getDeleteButton(file) {
+      const button = document.createElement('button');
+      button.setAttribute('type', 'button');
+      button.setAttribute('name', 'delete');
+      button.setAttribute('value', file.filename);
+      button.classList.add('moj-multi-file-upload__delete', 'govuk-button', 'govuk-button--secondary', 'govuk-!-margin-bottom-0');
+      button.innerHTML = `Delete <span class="govuk-visually-hidden">${file.originalname}</span>`;
+      return button;
+    }
+    uploadFile(file) {
+      this.params.uploadFileEntryHook(this, file);
+      const item = this.getFileRow(file);
+      const message = item.querySelector('.moj-multi-file-upload__message');
+      const actions = item.querySelector('.moj-multi-file-upload__actions');
+      const progress = item.querySelector('.moj-multi-file-upload__progress');
+      const formData = new FormData();
+      formData.append('documents', file);
+      this.feedbackContainer.querySelector('.moj-multi-file-upload__list').append(item);
+      const xhr = new XMLHttpRequest();
+      const onLoad = () => {
+        if (xhr.status < 200 || xhr.status >= 300 || !('success' in xhr.response)) {
+          return onError();
+        }
+        message.innerHTML = this.getSuccessHtml(xhr.response.success);
+        this.status.textContent = xhr.response.success.messageText;
+        actions.append(this.getDeleteButton(xhr.response.file));
+        this.params.uploadFileExitHook(this, file, xhr, xhr.responseText);
+      };
+      const onError = () => {
+        const error = new Error(xhr.response && 'error' in xhr.response ? xhr.response.error.message : xhr.statusText || 'Upload failed');
+        message.innerHTML = this.getErrorHtml(error);
+        this.status.textContent = error.message;
+        this.params.uploadFileErrorHook(this, file, xhr, xhr.responseText, error);
+      };
+      xhr.addEventListener('load', onLoad);
+      xhr.addEventListener('error', onError);
+      xhr.upload.addEventListener('progress', event => {
+        if (!event.lengthComputable) {
+          return;
+        }
+        const percentComplete = Math.round(event.loaded / event.total * 100);
+        progress.textContent = ` ${percentComplete}%`;
+      });
+      xhr.open('POST', this.params.uploadUrl);
+      xhr.responseType = 'json';
+      xhr.send(formData);
+    }
+    onFileDeleteClick(event) {
+      const button = event.target;
+      if (!button || !(button instanceof HTMLButtonElement) || !button.classList.contains('moj-multi-file-upload__delete')) {
+        return;
+      }
+      event.preventDefault(); // if user refreshes page and then deletes
+
+      const xhr = new XMLHttpRequest();
+      xhr.addEventListener('load', () => {
+        if (xhr.status < 200 || xhr.status >= 300) {
+          return;
+        }
+        const rows = Array.from(this.feedbackContainer.querySelectorAll('.moj-multi-file-upload__row'));
+        if (rows.length === 1) {
+          this.feedbackContainer.classList.add('moj-hidden');
+        }
+        const row = rows.find(row => row.contains(button));
+        if (row) row.remove();
+        this.params.fileDeleteHook(this, undefined, xhr, xhr.responseText);
+      });
+      xhr.open('POST', this.params.deleteUrl);
+      xhr.setRequestHeader('Content-Type', 'application/json');
+      xhr.responseType = 'json';
+      xhr.send(JSON.stringify({
+        [button.name]: button.value
+      }));
+    }
+  }
+
+  exports.MultiFileUpload = MultiFileUpload;
+
+}));
+//# sourceMappingURL=multi-file-upload.bundle.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"multi-file-upload.bundle.js","sources":["../../../../src/moj/helpers.mjs","../../../../src/moj/components/multi-file-upload/multi-file-upload.mjs"],"sourcesContent":["export function removeAttributeValue(el, attr, value) {\n  let re, m\n  if (el.getAttribute(attr)) {\n    if (el.getAttribute(attr) === value) {\n      el.removeAttribute(attr)\n    } else {\n      re = new RegExp(`(^|\\\\s)${value}(\\\\s|$)`)\n      m = el.getAttribute(attr).match(re)\n      if (m && m.length === 3) {\n        el.setAttribute(\n          attr,\n          el.getAttribute(attr).replace(re, m[1] && m[2] ? ' ' : '')\n        )\n      }\n    }\n  }\n}\n\nexport function addAttributeValue(el, attr, value) {\n  let re\n  if (!el.getAttribute(attr)) {\n    el.setAttribute(attr, value)\n  } else {\n    re = new RegExp(`(^|\\\\s)${value}(\\\\s|$)`)\n    if (!re.test(el.getAttribute(attr))) {\n      el.setAttribute(attr, `${el.getAttribute(attr)} ${value}`)\n    }\n  }\n}\n\nexport function dragAndDropSupported() {\n  const div = document.createElement('div')\n  return typeof div.ondrop !== 'undefined'\n}\n\nexport function formDataSupported() {\n  return typeof FormData === 'function'\n}\n\nexport function fileApiSupported() {\n  const input = document.createElement('input')\n  input.type = 'file'\n  return typeof input.files !== 'undefined'\n}\n\n/**\n * Find an elements next sibling\n *\n * Utility function to find an elements next sibling matching the provided\n * selector.\n *\n * @param {Element | null} $element - Element to find siblings for\n * @param {string} [selector] - selector for required sibling\n */\nexport function getNextSibling($element, selector) {\n  if (!$element || !($element instanceof HTMLElement)) {\n    return\n  }\n\n  // Get the next sibling element\n  let $sibling = $element.nextElementSibling\n\n  // If there's no selector, return the first sibling\n  if (!selector) return $sibling\n\n  // If the sibling matches our selector, use it\n  // If not, jump to the next sibling and continue the loop\n  while ($sibling) {\n    if ($sibling.matches(selector)) return $sibling\n    $sibling = $sibling.nextElementSibling\n  }\n}\n\n/**\n * Find an elements preceding sibling\n *\n * Utility function to find an elements previous sibling matching the provided\n * selector.\n *\n * @param {Element | null} $element - Element to find siblings for\n * @param {string} [selector] - selector for required sibling\n */\nexport function getPreviousSibling($element, selector) {\n  if (!$element || !($element instanceof HTMLElement)) {\n    return\n  }\n\n  // Get the previous sibling element\n  let $sibling = $element.previousElementSibling\n\n  // If there's no selector, return the first sibling\n  if (!selector) return $sibling\n\n  // If the sibling matches our selector, use it\n  // If not, jump to the next sibling and continue the loop\n  while ($sibling) {\n    if ($sibling.matches(selector)) return $sibling\n    $sibling = $sibling.previousElementSibling\n  }\n}\n\n/**\n * @param {Element | null} $element\n * @param {string} [selector]\n */\nexport function findNearestMatchingElement($element, selector) {\n  // If no element or selector is provided, return\n  if (!$element || !($element instanceof HTMLElement) || !selector) {\n    return\n  }\n\n  // Start with the current element\n  let $currentElement = $element\n\n  while ($currentElement) {\n    // First check the current element\n    if ($currentElement.matches(selector)) {\n      return $currentElement\n    }\n\n    // Check all previous siblings\n    let $sibling = $currentElement.previousElementSibling\n    while ($sibling) {\n      // Check if the sibling itself is a heading\n      if ($sibling.matches(selector)) {\n        return $sibling\n      }\n      $sibling = $sibling.previousElementSibling\n    }\n\n    // If no match found in siblings, move up to parent\n    $currentElement = $currentElement.parentElement\n  }\n}\n\n/**\n * Move focus to element\n *\n * Sets tabindex to -1 to make the element programmatically focusable,\n * but removes it on blur as the element doesn't need to be focused again.\n *\n * @param {HTMLElement} $element - HTML element\n * @param {object} [options] - Handler options\n * @param {function(this: HTMLElement): void} [options.onBeforeFocus] - Callback before focus\n * @param {function(this: HTMLElement): void} [options.onBlur] - Callback on blur\n */\nexport function setFocus($element, options = {}) {\n  const isFocusable = $element.getAttribute('tabindex')\n\n  if (!isFocusable) {\n    $element.setAttribute('tabindex', '-1')\n  }\n\n  /**\n   * Handle element focus\n   */\n  function onFocus() {\n    $element.addEventListener('blur', onBlur, { once: true })\n  }\n\n  /**\n   * Handle element blur\n   */\n  function onBlur() {\n    if (options.onBlur) {\n      options.onBlur.call($element)\n    }\n\n    if (!isFocusable) {\n      $element.removeAttribute('tabindex')\n    }\n  }\n\n  // Add listener to reset element on blur, after focus\n  $element.addEventListener('focus', onFocus, { once: true })\n\n  // Focus element\n  if (options.onBeforeFocus) {\n    options.onBeforeFocus.call($element)\n  }\n  $element.focus()\n}\n","/* eslint-disable @typescript-eslint/no-empty-function */\n\nimport {\n  dragAndDropSupported,\n  fileApiSupported,\n  formDataSupported\n} from '../../helpers.mjs'\n\nexport class MultiFileUpload {\n  /**\n   * @param {MultiFileUploadConfig} [params] - Multi file upload config\n   */\n  constructor(params = {}) {\n    const { container } = params\n\n    if (\n      !container ||\n      !(container instanceof HTMLElement) ||\n      !(dragAndDropSupported() && formDataSupported() && fileApiSupported())\n    ) {\n      return this\n    }\n\n    this.container = container\n    this.container.classList.add('moj-multi-file-upload--enhanced')\n\n    this.defaultParams = {\n      uploadFileEntryHook: () => {},\n      uploadFileExitHook: () => {},\n      uploadFileErrorHook: () => {},\n      fileDeleteHook: () => {},\n      uploadStatusText: 'Uploading files, please wait',\n      dropzoneHintText: 'Drag and drop files here or',\n      dropzoneButtonText: 'Choose files'\n    }\n\n    this.params = Object.assign({}, this.defaultParams, params)\n\n    this.feedbackContainer = /** @type {HTMLDivElement} */ (\n      this.container.querySelector('.moj-multi-file__uploaded-files')\n    )\n\n    this.setupFileInput()\n    this.setupDropzone()\n    this.setupLabel()\n    this.setupStatusBox()\n\n    this.container.addEventListener('click', this.onFileDeleteClick.bind(this))\n  }\n\n  setupDropzone() {\n    this.dropzone = document.createElement('div')\n    this.dropzone.classList.add('moj-multi-file-upload__dropzone')\n\n    this.dropzone.addEventListener('dragover', this.onDragOver.bind(this))\n    this.dropzone.addEventListener('dragleave', this.onDragLeave.bind(this))\n    this.dropzone.addEventListener('drop', this.onDrop.bind(this))\n\n    this.fileInput.replaceWith(this.dropzone)\n    this.dropzone.appendChild(this.fileInput)\n  }\n\n  setupLabel() {\n    const label = document.createElement('label')\n    label.setAttribute('for', this.fileInput.id)\n    label.classList.add('govuk-button', 'govuk-button--secondary')\n    label.textContent = this.params.dropzoneButtonText\n\n    const hint = document.createElement('p')\n    hint.classList.add('govuk-body')\n    hint.textContent = this.params.dropzoneHintText\n\n    this.label = label\n    this.dropzone.append(hint)\n    this.dropzone.append(label)\n  }\n\n  setupFileInput() {\n    this.fileInput = /** @type {HTMLInputElement} */ (\n      this.container.querySelector('.moj-multi-file-upload__input')\n    )\n    this.fileInput.addEventListener('change', this.onFileChange.bind(this))\n    this.fileInput.addEventListener('focus', this.onFileFocus.bind(this))\n    this.fileInput.addEventListener('blur', this.onFileBlur.bind(this))\n  }\n\n  setupStatusBox() {\n    this.status = document.createElement('div')\n    this.status.classList.add('govuk-visually-hidden')\n    this.status.setAttribute('aria-live', 'polite')\n    this.status.setAttribute('role', 'status')\n    this.dropzone.append(this.status)\n  }\n\n  onDragOver(event) {\n    event.preventDefault()\n    this.dropzone.classList.add('moj-multi-file-upload--dragover')\n  }\n\n  onDragLeave() {\n    this.dropzone.classList.remove('moj-multi-file-upload--dragover')\n  }\n\n  onDrop(event) {\n    event.preventDefault()\n    this.dropzone.classList.remove('moj-multi-file-upload--dragover')\n    this.feedbackContainer.classList.remove('moj-hidden')\n    this.status.textContent = this.params.uploadStatusText\n    this.uploadFiles(event.dataTransfer.files)\n  }\n\n  uploadFiles(files) {\n    for (const file of Array.from(files)) {\n      this.uploadFile(file)\n    }\n  }\n\n  onFileChange() {\n    this.feedbackContainer.classList.remove('moj-hidden')\n    this.status.textContent = this.params.uploadStatusText\n    this.uploadFiles(this.fileInput.files)\n\n    const fileInput = this.fileInput.cloneNode(true)\n    if (!fileInput || !(fileInput instanceof HTMLInputElement)) {\n      return\n    }\n\n    fileInput.value = ''\n    this.fileInput.replaceWith(fileInput)\n\n    this.setupFileInput()\n    this.fileInput.focus()\n  }\n\n  onFileFocus() {\n    this.label.classList.add('moj-multi-file-upload--focused')\n  }\n\n  onFileBlur() {\n    this.label.classList.remove('moj-multi-file-upload--focused')\n  }\n\n  getSuccessHtml(success) {\n    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>`\n  }\n\n  getErrorHtml(error) {\n    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>`\n  }\n\n  getFileRow(file) {\n    const row = document.createElement('div')\n\n    row.classList.add('govuk-summary-list__row', 'moj-multi-file-upload__row')\n\n    row.innerHTML = `\n    <div class=\"govuk-summary-list__value moj-multi-file-upload__message\">\n      <span class=\"moj-multi-file-upload__filename\">${file.name}</span>\n      <span class=\"moj-multi-file-upload__progress\">0%</span>\n    </div>\n    <div class=\"govuk-summary-list__actions moj-multi-file-upload__actions\"></div>\n  `\n\n    return row\n  }\n\n  getDeleteButton(file) {\n    const button = document.createElement('button')\n\n    button.setAttribute('type', 'button')\n    button.setAttribute('name', 'delete')\n    button.setAttribute('value', file.filename)\n\n    button.classList.add(\n      'moj-multi-file-upload__delete',\n      'govuk-button',\n      'govuk-button--secondary',\n      'govuk-!-margin-bottom-0'\n    )\n\n    button.innerHTML = `Delete <span class=\"govuk-visually-hidden\">${file.originalname}</span>`\n\n    return button\n  }\n\n  uploadFile(file) {\n    this.params.uploadFileEntryHook(this, file)\n\n    const item = this.getFileRow(file)\n    const message = item.querySelector('.moj-multi-file-upload__message')\n    const actions = item.querySelector('.moj-multi-file-upload__actions')\n    const progress = item.querySelector('.moj-multi-file-upload__progress')\n\n    const formData = new FormData()\n    formData.append('documents', file)\n\n    this.feedbackContainer\n      .querySelector('.moj-multi-file-upload__list')\n      .append(item)\n\n    const xhr = new XMLHttpRequest()\n\n    const onLoad = () => {\n      if (\n        xhr.status < 200 ||\n        xhr.status >= 300 ||\n        !('success' in xhr.response)\n      ) {\n        return onError()\n      }\n\n      message.innerHTML = this.getSuccessHtml(xhr.response.success)\n      this.status.textContent = xhr.response.success.messageText\n\n      actions.append(this.getDeleteButton(xhr.response.file))\n      this.params.uploadFileExitHook(this, file, xhr, xhr.responseText)\n    }\n\n    const onError = () => {\n      const error = new Error(\n        xhr.response && 'error' in xhr.response\n          ? xhr.response.error.message\n          : xhr.statusText || 'Upload failed'\n      )\n\n      message.innerHTML = this.getErrorHtml(error)\n      this.status.textContent = error.message\n\n      this.params.uploadFileErrorHook(this, file, xhr, xhr.responseText, error)\n    }\n\n    xhr.addEventListener('load', onLoad)\n    xhr.addEventListener('error', onError)\n\n    xhr.upload.addEventListener('progress', (event) => {\n      if (!event.lengthComputable) {\n        return\n      }\n\n      const percentComplete = Math.round((event.loaded / event.total) * 100)\n      progress.textContent = ` ${percentComplete}%`\n    })\n\n    xhr.open('POST', this.params.uploadUrl)\n    xhr.responseType = 'json'\n\n    xhr.send(formData)\n  }\n\n  onFileDeleteClick(event) {\n    const button = event.target\n\n    if (\n      !button ||\n      !(button instanceof HTMLButtonElement) ||\n      !button.classList.contains('moj-multi-file-upload__delete')\n    ) {\n      return\n    }\n\n    event.preventDefault() // if user refreshes page and then deletes\n\n    const xhr = new XMLHttpRequest()\n\n    xhr.addEventListener('load', () => {\n      if (xhr.status < 200 || xhr.status >= 300) {\n        return\n      }\n\n      const rows = Array.from(\n        this.feedbackContainer.querySelectorAll('.moj-multi-file-upload__row')\n      )\n\n      if (rows.length === 1) {\n        this.feedbackContainer.classList.add('moj-hidden')\n      }\n\n      const row = rows.find((row) => row.contains(button))\n      if (row) row.remove()\n\n      this.params.fileDeleteHook(this, undefined, xhr, xhr.responseText)\n    })\n\n    xhr.open('POST', this.params.deleteUrl)\n    xhr.setRequestHeader('Content-Type', 'application/json')\n    xhr.responseType = 'json'\n\n    xhr.send(\n      JSON.stringify({\n        [button.name]: button.value\n      })\n    )\n  }\n}\n"],"names":["dragAndDropSupported","div","document","createElement","ondrop","formDataSupported","FormData","fileApiSupported","input","type","files","MultiFileUpload","constructor","params","container","HTMLElement","classList","add","defaultParams","uploadFileEntryHook","uploadFileExitHook","uploadFileErrorHook","fileDeleteHook","uploadStatusText","dropzoneHintText","dropzoneButtonText","Object","assign","feedbackContainer","querySelector","setupFileInput","setupDropzone","setupLabel","setupStatusBox","addEventListener","onFileDeleteClick","bind","dropzone","onDragOver","onDragLeave","onDrop","fileInput","replaceWith","appendChild","label","setAttribute","id","textContent","hint","append","onFileChange","onFileFocus","onFileBlur","status","event","preventDefault","remove","uploadFiles","dataTransfer","file","Array","from","uploadFile","cloneNode","HTMLInputElement","value","focus","getSuccessHtml","success","messageHtml","getErrorHtml","error","message","getFileRow","row","innerHTML","name","getDeleteButton","button","filename","originalname","item","actions","progress","formData","xhr","XMLHttpRequest","onLoad","response","onError","messageText","responseText","Error","statusText","upload","lengthComputable","percentComplete","Math","round","loaded","total","open","uploadUrl","responseType","send","target","HTMLButtonElement","contains","rows","querySelectorAll","length","find","undefined","deleteUrl","setRequestHeader","JSON","stringify"],"mappings":"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"}

package/moj/components/multi-file-upload/multi-file-upload.bundle.mjs

@@ -0,0 +1,215 @@
+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';
+}
+
+/* eslint-disable @typescript-eslint/no-empty-function */
+
+class MultiFileUpload {
+  /**
+   * @param {MultiFileUploadConfig} [params] - Multi file upload config
+   */
+  constructor(params = {}) {
+    const {
+      container
+    } = params;
+    if (!container || !(container instanceof HTMLElement) || !(dragAndDropSupported() && formDataSupported() && fileApiSupported())) {
+      return this;
+    }
+    this.container = container;
+    this.container.classList.add('moj-multi-file-upload--enhanced');
+    this.defaultParams = {
+      uploadFileEntryHook: () => {},
+      uploadFileExitHook: () => {},
+      uploadFileErrorHook: () => {},
+      fileDeleteHook: () => {},
+      uploadStatusText: 'Uploading files, please wait',
+      dropzoneHintText: 'Drag and drop files here or',
+      dropzoneButtonText: 'Choose files'
+    };
+    this.params = Object.assign({}, this.defaultParams, params);
+    this.feedbackContainer = /** @type {HTMLDivElement} */
+    this.container.querySelector('.moj-multi-file__uploaded-files');
+    this.setupFileInput();
+    this.setupDropzone();
+    this.setupLabel();
+    this.setupStatusBox();
+    this.container.addEventListener('click', this.onFileDeleteClick.bind(this));
+  }
+  setupDropzone() {
+    this.dropzone = document.createElement('div');
+    this.dropzone.classList.add('moj-multi-file-upload__dropzone');
+    this.dropzone.addEventListener('dragover', this.onDragOver.bind(this));
+    this.dropzone.addEventListener('dragleave', this.onDragLeave.bind(this));
+    this.dropzone.addEventListener('drop', this.onDrop.bind(this));
+    this.fileInput.replaceWith(this.dropzone);
+    this.dropzone.appendChild(this.fileInput);
+  }
+  setupLabel() {
+    const label = document.createElement('label');
+    label.setAttribute('for', this.fileInput.id);
+    label.classList.add('govuk-button', 'govuk-button--secondary');
+    label.textContent = this.params.dropzoneButtonText;
+    const hint = document.createElement('p');
+    hint.classList.add('govuk-body');
+    hint.textContent = this.params.dropzoneHintText;
+    this.label = label;
+    this.dropzone.append(hint);
+    this.dropzone.append(label);
+  }
+  setupFileInput() {
+    this.fileInput = /** @type {HTMLInputElement} */
+    this.container.querySelector('.moj-multi-file-upload__input');
+    this.fileInput.addEventListener('change', this.onFileChange.bind(this));
+    this.fileInput.addEventListener('focus', this.onFileFocus.bind(this));
+    this.fileInput.addEventListener('blur', this.onFileBlur.bind(this));
+  }
+  setupStatusBox() {
+    this.status = document.createElement('div');
+    this.status.classList.add('govuk-visually-hidden');
+    this.status.setAttribute('aria-live', 'polite');
+    this.status.setAttribute('role', 'status');
+    this.dropzone.append(this.status);
+  }
+  onDragOver(event) {
+    event.preventDefault();
+    this.dropzone.classList.add('moj-multi-file-upload--dragover');
+  }
+  onDragLeave() {
+    this.dropzone.classList.remove('moj-multi-file-upload--dragover');
+  }
+  onDrop(event) {
+    event.preventDefault();
+    this.dropzone.classList.remove('moj-multi-file-upload--dragover');
+    this.feedbackContainer.classList.remove('moj-hidden');
+    this.status.textContent = this.params.uploadStatusText;
+    this.uploadFiles(event.dataTransfer.files);
+  }
+  uploadFiles(files) {
+    for (const file of Array.from(files)) {
+      this.uploadFile(file);
+    }
+  }
+  onFileChange() {
+    this.feedbackContainer.classList.remove('moj-hidden');
+    this.status.textContent = this.params.uploadStatusText;
+    this.uploadFiles(this.fileInput.files);
+    const fileInput = this.fileInput.cloneNode(true);
+    if (!fileInput || !(fileInput instanceof HTMLInputElement)) {
+      return;
+    }
+    fileInput.value = '';
+    this.fileInput.replaceWith(fileInput);
+    this.setupFileInput();
+    this.fileInput.focus();
+  }
+  onFileFocus() {
+    this.label.classList.add('moj-multi-file-upload--focused');
+  }
+  onFileBlur() {
+    this.label.classList.remove('moj-multi-file-upload--focused');
+  }
+  getSuccessHtml(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>`;
+  }
+  getErrorHtml(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>`;
+  }
+  getFileRow(file) {
+    const row = document.createElement('div');
+    row.classList.add('govuk-summary-list__row', 'moj-multi-file-upload__row');
+    row.innerHTML = `
+    <div class="govuk-summary-list__value moj-multi-file-upload__message">
+      <span class="moj-multi-file-upload__filename">${file.name}</span>
+      <span class="moj-multi-file-upload__progress">0%</span>
+    </div>
+    <div class="govuk-summary-list__actions moj-multi-file-upload__actions"></div>
+  `;
+    return row;
+  }
+  getDeleteButton(file) {
+    const button = document.createElement('button');
+    button.setAttribute('type', 'button');
+    button.setAttribute('name', 'delete');
+    button.setAttribute('value', file.filename);
+    button.classList.add('moj-multi-file-upload__delete', 'govuk-button', 'govuk-button--secondary', 'govuk-!-margin-bottom-0');
+    button.innerHTML = `Delete <span class="govuk-visually-hidden">${file.originalname}</span>`;
+    return button;
+  }
+  uploadFile(file) {
+    this.params.uploadFileEntryHook(this, file);
+    const item = this.getFileRow(file);
+    const message = item.querySelector('.moj-multi-file-upload__message');
+    const actions = item.querySelector('.moj-multi-file-upload__actions');
+    const progress = item.querySelector('.moj-multi-file-upload__progress');
+    const formData = new FormData();
+    formData.append('documents', file);
+    this.feedbackContainer.querySelector('.moj-multi-file-upload__list').append(item);
+    const xhr = new XMLHttpRequest();
+    const onLoad = () => {
+      if (xhr.status < 200 || xhr.status >= 300 || !('success' in xhr.response)) {
+        return onError();
+      }
+      message.innerHTML = this.getSuccessHtml(xhr.response.success);
+      this.status.textContent = xhr.response.success.messageText;
+      actions.append(this.getDeleteButton(xhr.response.file));
+      this.params.uploadFileExitHook(this, file, xhr, xhr.responseText);
+    };
+    const onError = () => {
+      const error = new Error(xhr.response && 'error' in xhr.response ? xhr.response.error.message : xhr.statusText || 'Upload failed');
+      message.innerHTML = this.getErrorHtml(error);
+      this.status.textContent = error.message;
+      this.params.uploadFileErrorHook(this, file, xhr, xhr.responseText, error);
+    };
+    xhr.addEventListener('load', onLoad);
+    xhr.addEventListener('error', onError);
+    xhr.upload.addEventListener('progress', event => {
+      if (!event.lengthComputable) {
+        return;
+      }
+      const percentComplete = Math.round(event.loaded / event.total * 100);
+      progress.textContent = ` ${percentComplete}%`;
+    });
+    xhr.open('POST', this.params.uploadUrl);
+    xhr.responseType = 'json';
+    xhr.send(formData);
+  }
+  onFileDeleteClick(event) {
+    const button = event.target;
+    if (!button || !(button instanceof HTMLButtonElement) || !button.classList.contains('moj-multi-file-upload__delete')) {
+      return;
+    }
+    event.preventDefault(); // if user refreshes page and then deletes
+
+    const xhr = new XMLHttpRequest();
+    xhr.addEventListener('load', () => {
+      if (xhr.status < 200 || xhr.status >= 300) {
+        return;
+      }
+      const rows = Array.from(this.feedbackContainer.querySelectorAll('.moj-multi-file-upload__row'));
+      if (rows.length === 1) {
+        this.feedbackContainer.classList.add('moj-hidden');
+      }
+      const row = rows.find(row => row.contains(button));
+      if (row) row.remove();
+      this.params.fileDeleteHook(this, undefined, xhr, xhr.responseText);
+    });
+    xhr.open('POST', this.params.deleteUrl);
+    xhr.setRequestHeader('Content-Type', 'application/json');
+    xhr.responseType = 'json';
+    xhr.send(JSON.stringify({
+      [button.name]: button.value
+    }));
+  }
+}
+
+export { MultiFileUpload };
+//# sourceMappingURL=multi-file-upload.bundle.mjs.map

package/moj/components/multi-file-upload/multi-file-upload.bundle.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-file-upload.bundle.mjs","sources":["../../../../src/moj/helpers.mjs","../../../../src/moj/components/multi-file-upload/multi-file-upload.mjs"],"sourcesContent":["export function removeAttributeValue(el, attr, value) {\n  let re, m\n  if (el.getAttribute(attr)) {\n    if (el.getAttribute(attr) === value) {\n      el.removeAttribute(attr)\n    } else {\n      re = new RegExp(`(^|\\\\s)${value}(\\\\s|$)`)\n      m = el.getAttribute(attr).match(re)\n      if (m && m.length === 3) {\n        el.setAttribute(\n          attr,\n          el.getAttribute(attr).replace(re, m[1] && m[2] ? ' ' : '')\n        )\n      }\n    }\n  }\n}\n\nexport function addAttributeValue(el, attr, value) {\n  let re\n  if (!el.getAttribute(attr)) {\n    el.setAttribute(attr, value)\n  } else {\n    re = new RegExp(`(^|\\\\s)${value}(\\\\s|$)`)\n    if (!re.test(el.getAttribute(attr))) {\n      el.setAttribute(attr, `${el.getAttribute(attr)} ${value}`)\n    }\n  }\n}\n\nexport function dragAndDropSupported() {\n  const div = document.createElement('div')\n  return typeof div.ondrop !== 'undefined'\n}\n\nexport function formDataSupported() {\n  return typeof FormData === 'function'\n}\n\nexport function fileApiSupported() {\n  const input = document.createElement('input')\n  input.type = 'file'\n  return typeof input.files !== 'undefined'\n}\n\n/**\n * Find an elements next sibling\n *\n * Utility function to find an elements next sibling matching the provided\n * selector.\n *\n * @param {Element | null} $element - Element to find siblings for\n * @param {string} [selector] - selector for required sibling\n */\nexport function getNextSibling($element, selector) {\n  if (!$element || !($element instanceof HTMLElement)) {\n    return\n  }\n\n  // Get the next sibling element\n  let $sibling = $element.nextElementSibling\n\n  // If there's no selector, return the first sibling\n  if (!selector) return $sibling\n\n  // If the sibling matches our selector, use it\n  // If not, jump to the next sibling and continue the loop\n  while ($sibling) {\n    if ($sibling.matches(selector)) return $sibling\n    $sibling = $sibling.nextElementSibling\n  }\n}\n\n/**\n * Find an elements preceding sibling\n *\n * Utility function to find an elements previous sibling matching the provided\n * selector.\n *\n * @param {Element | null} $element - Element to find siblings for\n * @param {string} [selector] - selector for required sibling\n */\nexport function getPreviousSibling($element, selector) {\n  if (!$element || !($element instanceof HTMLElement)) {\n    return\n  }\n\n  // Get the previous sibling element\n  let $sibling = $element.previousElementSibling\n\n  // If there's no selector, return the first sibling\n  if (!selector) return $sibling\n\n  // If the sibling matches our selector, use it\n  // If not, jump to the next sibling and continue the loop\n  while ($sibling) {\n    if ($sibling.matches(selector)) return $sibling\n    $sibling = $sibling.previousElementSibling\n  }\n}\n\n/**\n * @param {Element | null} $element\n * @param {string} [selector]\n */\nexport function findNearestMatchingElement($element, selector) {\n  // If no element or selector is provided, return\n  if (!$element || !($element instanceof HTMLElement) || !selector) {\n    return\n  }\n\n  // Start with the current element\n  let $currentElement = $element\n\n  while ($currentElement) {\n    // First check the current element\n    if ($currentElement.matches(selector)) {\n      return $currentElement\n    }\n\n    // Check all previous siblings\n    let $sibling = $currentElement.previousElementSibling\n    while ($sibling) {\n      // Check if the sibling itself is a heading\n      if ($sibling.matches(selector)) {\n        return $sibling\n      }\n      $sibling = $sibling.previousElementSibling\n    }\n\n    // If no match found in siblings, move up to parent\n    $currentElement = $currentElement.parentElement\n  }\n}\n\n/**\n * Move focus to element\n *\n * Sets tabindex to -1 to make the element programmatically focusable,\n * but removes it on blur as the element doesn't need to be focused again.\n *\n * @param {HTMLElement} $element - HTML element\n * @param {object} [options] - Handler options\n * @param {function(this: HTMLElement): void} [options.onBeforeFocus] - Callback before focus\n * @param {function(this: HTMLElement): void} [options.onBlur] - Callback on blur\n */\nexport function setFocus($element, options = {}) {\n  const isFocusable = $element.getAttribute('tabindex')\n\n  if (!isFocusable) {\n    $element.setAttribute('tabindex', '-1')\n  }\n\n  /**\n   * Handle element focus\n   */\n  function onFocus() {\n    $element.addEventListener('blur', onBlur, { once: true })\n  }\n\n  /**\n   * Handle element blur\n   */\n  function onBlur() {\n    if (options.onBlur) {\n      options.onBlur.call($element)\n    }\n\n    if (!isFocusable) {\n      $element.removeAttribute('tabindex')\n    }\n  }\n\n  // Add listener to reset element on blur, after focus\n  $element.addEventListener('focus', onFocus, { once: true })\n\n  // Focus element\n  if (options.onBeforeFocus) {\n    options.onBeforeFocus.call($element)\n  }\n  $element.focus()\n}\n","/* eslint-disable @typescript-eslint/no-empty-function */\n\nimport {\n  dragAndDropSupported,\n  fileApiSupported,\n  formDataSupported\n} from '../../helpers.mjs'\n\nexport class MultiFileUpload {\n  /**\n   * @param {MultiFileUploadConfig} [params] - Multi file upload config\n   */\n  constructor(params = {}) {\n    const { container } = params\n\n    if (\n      !container ||\n      !(container instanceof HTMLElement) ||\n      !(dragAndDropSupported() && formDataSupported() && fileApiSupported())\n    ) {\n      return this\n    }\n\n    this.container = container\n    this.container.classList.add('moj-multi-file-upload--enhanced')\n\n    this.defaultParams = {\n      uploadFileEntryHook: () => {},\n      uploadFileExitHook: () => {},\n      uploadFileErrorHook: () => {},\n      fileDeleteHook: () => {},\n      uploadStatusText: 'Uploading files, please wait',\n      dropzoneHintText: 'Drag and drop files here or',\n      dropzoneButtonText: 'Choose files'\n    }\n\n    this.params = Object.assign({}, this.defaultParams, params)\n\n    this.feedbackContainer = /** @type {HTMLDivElement} */ (\n      this.container.querySelector('.moj-multi-file__uploaded-files')\n    )\n\n    this.setupFileInput()\n    this.setupDropzone()\n    this.setupLabel()\n    this.setupStatusBox()\n\n    this.container.addEventListener('click', this.onFileDeleteClick.bind(this))\n  }\n\n  setupDropzone() {\n    this.dropzone = document.createElement('div')\n    this.dropzone.classList.add('moj-multi-file-upload__dropzone')\n\n    this.dropzone.addEventListener('dragover', this.onDragOver.bind(this))\n    this.dropzone.addEventListener('dragleave', this.onDragLeave.bind(this))\n    this.dropzone.addEventListener('drop', this.onDrop.bind(this))\n\n    this.fileInput.replaceWith(this.dropzone)\n    this.dropzone.appendChild(this.fileInput)\n  }\n\n  setupLabel() {\n    const label = document.createElement('label')\n    label.setAttribute('for', this.fileInput.id)\n    label.classList.add('govuk-button', 'govuk-button--secondary')\n    label.textContent = this.params.dropzoneButtonText\n\n    const hint = document.createElement('p')\n    hint.classList.add('govuk-body')\n    hint.textContent = this.params.dropzoneHintText\n\n    this.label = label\n    this.dropzone.append(hint)\n    this.dropzone.append(label)\n  }\n\n  setupFileInput() {\n    this.fileInput = /** @type {HTMLInputElement} */ (\n      this.container.querySelector('.moj-multi-file-upload__input')\n    )\n    this.fileInput.addEventListener('change', this.onFileChange.bind(this))\n    this.fileInput.addEventListener('focus', this.onFileFocus.bind(this))\n    this.fileInput.addEventListener('blur', this.onFileBlur.bind(this))\n  }\n\n  setupStatusBox() {\n    this.status = document.createElement('div')\n    this.status.classList.add('govuk-visually-hidden')\n    this.status.setAttribute('aria-live', 'polite')\n    this.status.setAttribute('role', 'status')\n    this.dropzone.append(this.status)\n  }\n\n  onDragOver(event) {\n    event.preventDefault()\n    this.dropzone.classList.add('moj-multi-file-upload--dragover')\n  }\n\n  onDragLeave() {\n    this.dropzone.classList.remove('moj-multi-file-upload--dragover')\n  }\n\n  onDrop(event) {\n    event.preventDefault()\n    this.dropzone.classList.remove('moj-multi-file-upload--dragover')\n    this.feedbackContainer.classList.remove('moj-hidden')\n    this.status.textContent = this.params.uploadStatusText\n    this.uploadFiles(event.dataTransfer.files)\n  }\n\n  uploadFiles(files) {\n    for (const file of Array.from(files)) {\n      this.uploadFile(file)\n    }\n  }\n\n  onFileChange() {\n    this.feedbackContainer.classList.remove('moj-hidden')\n    this.status.textContent = this.params.uploadStatusText\n    this.uploadFiles(this.fileInput.files)\n\n    const fileInput = this.fileInput.cloneNode(true)\n    if (!fileInput || !(fileInput instanceof HTMLInputElement)) {\n      return\n    }\n\n    fileInput.value = ''\n    this.fileInput.replaceWith(fileInput)\n\n    this.setupFileInput()\n    this.fileInput.focus()\n  }\n\n  onFileFocus() {\n    this.label.classList.add('moj-multi-file-upload--focused')\n  }\n\n  onFileBlur() {\n    this.label.classList.remove('moj-multi-file-upload--focused')\n  }\n\n  getSuccessHtml(success) {\n    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>`\n  }\n\n  getErrorHtml(error) {\n    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>`\n  }\n\n  getFileRow(file) {\n    const row = document.createElement('div')\n\n    row.classList.add('govuk-summary-list__row', 'moj-multi-file-upload__row')\n\n    row.innerHTML = `\n    <div class=\"govuk-summary-list__value moj-multi-file-upload__message\">\n      <span class=\"moj-multi-file-upload__filename\">${file.name}</span>\n      <span class=\"moj-multi-file-upload__progress\">0%</span>\n    </div>\n    <div class=\"govuk-summary-list__actions moj-multi-file-upload__actions\"></div>\n  `\n\n    return row\n  }\n\n  getDeleteButton(file) {\n    const button = document.createElement('button')\n\n    button.setAttribute('type', 'button')\n    button.setAttribute('name', 'delete')\n    button.setAttribute('value', file.filename)\n\n    button.classList.add(\n      'moj-multi-file-upload__delete',\n      'govuk-button',\n      'govuk-button--secondary',\n      'govuk-!-margin-bottom-0'\n    )\n\n    button.innerHTML = `Delete <span class=\"govuk-visually-hidden\">${file.originalname}</span>`\n\n    return button\n  }\n\n  uploadFile(file) {\n    this.params.uploadFileEntryHook(this, file)\n\n    const item = this.getFileRow(file)\n    const message = item.querySelector('.moj-multi-file-upload__message')\n    const actions = item.querySelector('.moj-multi-file-upload__actions')\n    const progress = item.querySelector('.moj-multi-file-upload__progress')\n\n    const formData = new FormData()\n    formData.append('documents', file)\n\n    this.feedbackContainer\n      .querySelector('.moj-multi-file-upload__list')\n      .append(item)\n\n    const xhr = new XMLHttpRequest()\n\n    const onLoad = () => {\n      if (\n        xhr.status < 200 ||\n        xhr.status >= 300 ||\n        !('success' in xhr.response)\n      ) {\n        return onError()\n      }\n\n      message.innerHTML = this.getSuccessHtml(xhr.response.success)\n      this.status.textContent = xhr.response.success.messageText\n\n      actions.append(this.getDeleteButton(xhr.response.file))\n      this.params.uploadFileExitHook(this, file, xhr, xhr.responseText)\n    }\n\n    const onError = () => {\n      const error = new Error(\n        xhr.response && 'error' in xhr.response\n          ? xhr.response.error.message\n          : xhr.statusText || 'Upload failed'\n      )\n\n      message.innerHTML = this.getErrorHtml(error)\n      this.status.textContent = error.message\n\n      this.params.uploadFileErrorHook(this, file, xhr, xhr.responseText, error)\n    }\n\n    xhr.addEventListener('load', onLoad)\n    xhr.addEventListener('error', onError)\n\n    xhr.upload.addEventListener('progress', (event) => {\n      if (!event.lengthComputable) {\n        return\n      }\n\n      const percentComplete = Math.round((event.loaded / event.total) * 100)\n      progress.textContent = ` ${percentComplete}%`\n    })\n\n    xhr.open('POST', this.params.uploadUrl)\n    xhr.responseType = 'json'\n\n    xhr.send(formData)\n  }\n\n  onFileDeleteClick(event) {\n    const button = event.target\n\n    if (\n      !button ||\n      !(button instanceof HTMLButtonElement) ||\n      !button.classList.contains('moj-multi-file-upload__delete')\n    ) {\n      return\n    }\n\n    event.preventDefault() // if user refreshes page and then deletes\n\n    const xhr = new XMLHttpRequest()\n\n    xhr.addEventListener('load', () => {\n      if (xhr.status < 200 || xhr.status >= 300) {\n        return\n      }\n\n      const rows = Array.from(\n        this.feedbackContainer.querySelectorAll('.moj-multi-file-upload__row')\n      )\n\n      if (rows.length === 1) {\n        this.feedbackContainer.classList.add('moj-hidden')\n      }\n\n      const row = rows.find((row) => row.contains(button))\n      if (row) row.remove()\n\n      this.params.fileDeleteHook(this, undefined, xhr, xhr.responseText)\n    })\n\n    xhr.open('POST', this.params.deleteUrl)\n    xhr.setRequestHeader('Content-Type', 'application/json')\n    xhr.responseType = 'json'\n\n    xhr.send(\n      JSON.stringify({\n        [button.name]: button.value\n      })\n    )\n  }\n}\n"],"names":["dragAndDropSupported","div","document","createElement","ondrop","formDataSupported","FormData","fileApiSupported","input","type","files","MultiFileUpload","constructor","params","container","HTMLElement","classList","add","defaultParams","uploadFileEntryHook","uploadFileExitHook","uploadFileErrorHook","fileDeleteHook","uploadStatusText","dropzoneHintText","dropzoneButtonText","Object","assign","feedbackContainer","querySelector","setupFileInput","setupDropzone","setupLabel","setupStatusBox","addEventListener","onFileDeleteClick","bind","dropzone","onDragOver","onDragLeave","onDrop","fileInput","replaceWith","appendChild","label","setAttribute","id","textContent","hint","append","onFileChange","onFileFocus","onFileBlur","status","event","preventDefault","remove","uploadFiles","dataTransfer","file","Array","from","uploadFile","cloneNode","HTMLInputElement","value","focus","getSuccessHtml","success","messageHtml","getErrorHtml","error","message","getFileRow","row","innerHTML","name","getDeleteButton","button","filename","originalname","item","actions","progress","formData","xhr","XMLHttpRequest","onLoad","response","onError","messageText","responseText","Error","statusText","upload","lengthComputable","percentComplete","Math","round","loaded","total","open","uploadUrl","responseType","send","target","HTMLButtonElement","contains","rows","querySelectorAll","length","find","undefined","deleteUrl","setRequestHeader","JSON","stringify"],"mappings":"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"}