wj-elements 0.2.0-alpha.3 → 0.2.0-alpha.5

package/dist/packages/wje-file-upload/file-upload.element.d.ts

@@ -119,6 +119,18 @@ export default class FileUpload extends WJElement {
      * @returns {boolean}
      */
     get toChunk(): boolean;
+    /**
+     * Sets the maximum number of files that can be uploaded or managed.
+     * Assigns the specified value to the 'max-files' attribute.
+     * @param {number} value The maximum allowable number of files.
+     */
+    set maxFiles(value: number);
+    /**
+     * Retrieves the maximum number of files allowed from the `max-files` attribute.
+     * If the attribute is not set or is invalid, defaults to 0.
+     * @returns {number} The maximum number of files allowed.
+     */
+    get maxFiles(): number;
     beforeDraw(): void;
     uploadFunction: Function;
     /**

package/dist/packages/wje-file-upload/file-upload.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/packages/wje-file-upload-item/file-upload-item.element.d.ts

@@ -31,22 +31,38 @@ export default class FileUploadItem extends WJElement {
      */
     static get observedAttributes(): Array<string>;
     localizer: Localizer;
+    /**
+     * Sets the 'is-uploaded' attribute to indicate the uploaded status.
+     * @param {boolean} value The value to determine if the element is uploaded.
+     */
     set isUploaded(value: boolean);
+    /**
+     * Checks if the 'is-uploaded' attribute is present on the element.
+     * @returns {boolean} True if the 'is-uploaded' attribute exists, otherwise false.
+     */
     get isUploaded(): boolean;
-    set size(value: string);
-    get size(): string;
+    /**
+     * Sets the size attribute of the element.
+     * @param {string | number} value The value to set for the size attribute.
+     */
+    set size(value: string | number);
+    /**
+     * Retrieves the value of the 'size' attribute.
+     * @returns {string|null} The value of the 'size' attribute, or null if the attribute is not present.
+     */
+    get size(): string | null;
     /**
      * Dependencies for the component.
      * @type {object}
      */
     dependencies: object;
     /**
-     * Handles updates to the attributes of a custom element whenever one of the observed attributes is changed.
-     * Updates the related elements based on the changed attribute and its new value.
-     * @param {string} name The name of the attribute being changed.
-     * @param {string | null} oldValue The previous value of the attribute before the change, or null if the attribute was not previously set.
-     * @param {string | null} newValue The new value of the attribute after the change, or null if the attribute is being removed.
-     * @returns {void} Does not return a value.
+     * A lifecycle method that is called when one of the observed attributes of the custom element is added, removed, or changed.
+     * This method is used to react to changes in the specified attributes.
+     * @param {string} name The name of the attribute that was changed.
+     * @param {string|null} oldValue The previous value of the attribute before the change, or null if the attribute was not previously set.
+     * @param {string|null} newValue The new value of the attribute after the change, or null if the attribute has been removed.
+     * @returns {void} This method does not return a value.
      */
     attributeChangedCallback(name: string, oldValue: string | null, newValue: string | null): void;
     /**

package/dist/wje-file-upload-item.js

@@ -34,15 +34,31 @@ class FileUploadItem extends WJElement {
     });
     this.localizer = new Localizer(this);
   }
+  /**
+   * Sets the 'is-uploaded' attribute to indicate the uploaded status.
+   * @param {boolean} value The value to determine if the element is uploaded.
+   */
   set isUploaded(value) {
     this.setAttribute("is-uploaded", "");
   }
+  /**
+   * Checks if the 'is-uploaded' attribute is present on the element.
+   * @returns {boolean} True if the 'is-uploaded' attribute exists, otherwise false.
+   */
   get isUploaded() {
     return this.hasAttribute("is-uploaded");
   }
+  /**
+   * Sets the size attribute of the element.
+   * @param {string | number} value The value to set for the size attribute.
+   */
   set size(value) {
     this.setAttribute("size", value);
   }
+  /**
+   * Retrieves the value of the 'size' attribute.
+   * @returns {string|null} The value of the 'size' attribute, or null if the attribute is not present.
+   */
   get size() {
     return this.getAttribute("size");
   }
@@ -60,17 +76,20 @@ class FileUploadItem extends WJElement {
    * @returns {Array<string>}
    */
   static get observedAttributes() {
-    return ["uploaded"];
+    return ["uploaded", "is-uploaded"];
   }
   /**
-   * Handles updates to the attributes of a custom element whenever one of the observed attributes is changed.
-   * Updates the related elements based on the changed attribute and its new value.
-   * @param {string} name The name of the attribute being changed.
-   * @param {string | null} oldValue The previous value of the attribute before the change, or null if the attribute was not previously set.
-   * @param {string | null} newValue The new value of the attribute after the change, or null if the attribute is being removed.
-   * @returns {void} Does not return a value.
+   * A lifecycle method that is called when one of the observed attributes of the custom element is added, removed, or changed.
+   * This method is used to react to changes in the specified attributes.
+   * @param {string} name The name of the attribute that was changed.
+   * @param {string|null} oldValue The previous value of the attribute before the change, or null if the attribute was not previously set.
+   * @param {string|null} newValue The new value of the attribute after the change, or null if the attribute has been removed.
+   * @returns {void} This method does not return a value.
    */
   attributeChangedCallback(name, oldValue, newValue) {
+    if (super.attributeChangedCallback) {
+      super.attributeChangedCallback(name, oldValue, newValue);
+    }
     if (name === "uploaded" && oldValue !== newValue && this.uploadedEl) {
       this.uploadedEl.setAttribute("value", newValue);
       let progress = +newValue / +this.size * 100 || 0;

package/dist/wje-file-upload-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-file-upload-item.js","sources":["../packages/wje-file-upload-item/file-upload-item.element.js","../packages/wje-file-upload-item/file-upload-item.js"],"sourcesContent":["import { Localizer } from '../utils/localize.js';\nimport Button from '../wje-button/button.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport FormatDigital from '../wje-format-digital/format-digital.js';\nimport Icon from '../wje-icon/icon.js';\nimport Slider from '../wje-slider/slider.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This element allows users to upload files.\n * `FileUploadItem` is a custom web component that represents a file upload item.\n * It extends from `WJElement` and uses the `Localizer` utility for localization.\n * @documentation https://elements.webjet.sk/components/file-upload\n * @status stable\n * @augments WJElement\n * @csspart button - The delete button part\n * @csspart image - The image part\n * @csspart name - The name part\n * @csspart size - The size part\n * @slot img - Slot for the image\n * @slot action - Slot for the action buttons\n * @cssproperty --primary-color - The primary color of the file upload item.\n * //@fires wje-button:click - Dispatches when the delete button is clicked\n * @tag wje-file-upload\n */\nexport default class FileUploadItem extends WJElement {\n    /**\n     * Creates an instance of FileUploadItem.\n     * @class\n     */\n    constructor() {\n        super();\n        this.localizer = new Localizer(this);\n    }\n\n    set isUploaded(value) {\n        this.setAttribute('is-uploaded', '');\n    }\n\n    get isUploaded() {\n        return this.hasAttribute('is-uploaded');\n    }\n\n    set size(value) {\n        this.setAttribute('size', value);\n    }\n\n    get size() {\n        return this.getAttribute('size');\n    }\n\n    /**\n     * Dependencies for the component.\n     * @type {object}\n     */\n    dependencies = {\n        'wje-format-digital': FormatDigital,\n        'wje-button': Button,\n        'wje-slider': Slider,\n        'wje-icon': Icon,\n    };\n\n    className = 'FileUploadItem';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return ['uploaded'];\n    }\n\n    /**\n     * Handles updates to the attributes of a custom element whenever one of the observed attributes is changed.\n     * Updates the related elements based on the changed attribute and its new value.\n     * @param {string} name The name of the attribute being changed.\n     * @param {string | null} oldValue The previous value of the attribute before the change, or null if the attribute was not previously set.\n     * @param {string | null} newValue The new value of the attribute after the change, or null if the attribute is being removed.\n     * @returns {void} Does not return a value.\n     */\n    attributeChangedCallback(name, oldValue, newValue) {\n        if (name === 'uploaded' && oldValue !== newValue && this.uploadedEl) {\n            this.uploadedEl.setAttribute('value', newValue);\n\n            let progress = (+newValue / +this.size) * 100 || 0;\n\n            this.sliderEl.setAttribute('progress', Math.round(progress, 0));\n        }\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Method to draw the component on the screen.\n     * @returns {DocumentFragment} The fragment containing the component.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-file-upload-item');\n\n        let slot = document.createElement('slot');\n        slot.setAttribute('name', 'img');\n\n        let image = document.createElement('div');\n        image.setAttribute('part', 'image');\n        image.classList.add('image');\n\n        let name = document.createElement('span');\n        name.classList.add('name');\n        name.innerText = this.name;\n\n        let actions = document.createElement('slot');\n        actions.classList.add('actions');\n        actions.setAttribute('name', 'action');\n\n        let button = document.createElement('wje-button');\n        button.setAttribute('fill', 'link');\n        button.setAttribute('size', 'small');\n        button.innerHTML = `<wje-icon name=\"x\" size=\"small\"></wje-icon>`;\n\n        let sizeWrapper = document.createElement('span');\n        sizeWrapper.classList.add('size');\n\n        let uploaded = document.createElement('wje-format-digital');\n        uploaded.setAttribute('value', this.uploaded || 0);\n        uploaded.innerHTML = `<span slot=\"start\">${this.localizer.translate('wj.file.upload.uploaded')}</span>`;\n\n        let size = document.createElement('wje-format-digital');\n        size.setAttribute('value', this.size || 0);\n        size.innerHTML = `<span slot=\"start\">&nbsp;${this.localizer.translate('wj.file.upload.from')} </span>`;\n\n        let size2 = document.createElement('wje-format-digital');\n        size2.setAttribute('value', this.size || 0);\n\n        let slider = document.createElement('wje-progress-bar');\n        slider.classList.add('file-progress');\n        slider.setAttribute('id', 'id-' + this.lastModified);\n        slider.setAttribute('progress', this.progress);\n        slider.setAttribute('color', 'success');\n\n        image.appendChild(slot);\n        actions.appendChild(button);\n\n        sizeWrapper.appendChild(uploaded);\n        sizeWrapper.appendChild(size);\n\n        native.appendChild(image);\n        native.appendChild(name);\n\n        if (!this.isUploaded)\n            native.appendChild(sizeWrapper);\n        else\n            native.appendChild(size2);\n\n        native.appendChild(actions);\n\n        if (!this.isUploaded)\n            native.appendChild(slider);\n\n        fragment.appendChild(native);\n\n        this.button = button;\n        this.uploadedEl = uploaded;\n        this.sliderEl = slider;\n\n        return fragment;\n    }\n\n    /**\n     * Called after the component has been drawn.\n     */\n    afterDraw() {\n        this.button.addEventListener('wje-button:click', this.onDelete);\n    }\n\n    /**\n     * Handles the delete action.\n     */\n    onDelete = () => {\n        this.remove();\n    };\n}\n","import FileUploadItem from './file-upload-item.element.js';\n\nexport default FileUploadItem;\n\nFileUploadItem.define('wje-file-upload-item', FileUploadItem);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-file-upload-item.js","sources":["../packages/wje-file-upload-item/file-upload-item.element.js","../packages/wje-file-upload-item/file-upload-item.js"],"sourcesContent":["import { Localizer } from '../utils/localize.js';\nimport Button from '../wje-button/button.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport FormatDigital from '../wje-format-digital/format-digital.js';\nimport Icon from '../wje-icon/icon.js';\nimport Slider from '../wje-slider/slider.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This element allows users to upload files.\n * `FileUploadItem` is a custom web component that represents a file upload item.\n * It extends from `WJElement` and uses the `Localizer` utility for localization.\n * @documentation https://elements.webjet.sk/components/file-upload\n * @status stable\n * @augments WJElement\n * @csspart button - The delete button part\n * @csspart image - The image part\n * @csspart name - The name part\n * @csspart size - The size part\n * @slot img - Slot for the image\n * @slot action - Slot for the action buttons\n * @cssproperty --primary-color - The primary color of the file upload item.\n * //@fires wje-button:click - Dispatches when the delete button is clicked\n * @tag wje-file-upload\n */\nexport default class FileUploadItem extends WJElement {\n    /**\n     * Creates an instance of FileUploadItem.\n     * @class\n     */\n    constructor() {\n        super();\n        this.localizer = new Localizer(this);\n    }\n\n    /**\n     * Sets the 'is-uploaded' attribute to indicate the uploaded status.\n     * @param {boolean} value The value to determine if the element is uploaded.\n     */\n    set isUploaded(value) {\n        this.setAttribute('is-uploaded', '');\n    }\n\n    /**\n     * Checks if the 'is-uploaded' attribute is present on the element.\n     * @returns {boolean} True if the 'is-uploaded' attribute exists, otherwise false.\n     */\n    get isUploaded() {\n        return this.hasAttribute('is-uploaded');\n    }\n\n    /**\n     * Sets the size attribute of the element.\n     * @param {string | number} value The value to set for the size attribute.\n     */\n    set size(value) {\n        this.setAttribute('size', value);\n    }\n\n    /**\n     * Retrieves the value of the 'size' attribute.\n     * @returns {string|null} The value of the 'size' attribute, or null if the attribute is not present.\n     */\n    get size() {\n        return this.getAttribute('size');\n    }\n\n    /**\n     * Dependencies for the component.\n     * @type {object}\n     */\n    dependencies = {\n        'wje-format-digital': FormatDigital,\n        'wje-button': Button,\n        'wje-slider': Slider,\n        'wje-icon': Icon,\n    };\n\n    className = 'FileUploadItem';\n\n    /**\n     * Returns the CSS styles for the component.\n     * @static\n     * @returns {CSSStyleSheet}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Returns the list of attributes to observe for changes.\n     * @static\n     * @returns {Array<string>}\n     */\n    static get observedAttributes() {\n        return ['uploaded', 'is-uploaded'];\n    }\n\n    /**\n     * A lifecycle method that is called when one of the observed attributes of the custom element is added, removed, or changed.\n     * This method is used to react to changes in the specified attributes.\n     * @param {string} name The name of the attribute that was changed.\n     * @param {string|null} oldValue The previous value of the attribute before the change, or null if the attribute was not previously set.\n     * @param {string|null} newValue The new value of the attribute after the change, or null if the attribute has been removed.\n     * @returns {void} This method does not return a value.\n     */\n    attributeChangedCallback(name, oldValue, newValue) {\n        if (super.attributeChangedCallback) {\n            super.attributeChangedCallback(name, oldValue, newValue);\n        }\n\n        if (name === 'uploaded' && oldValue !== newValue && this.uploadedEl) {\n            this.uploadedEl.setAttribute('value', newValue);\n\n            let progress = (+newValue / +this.size) * 100 || 0;\n\n            this.sliderEl.setAttribute('progress', Math.round(progress, 0));\n        }\n    }\n\n    /**\n     * Sets up the attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Method to draw the component on the screen.\n     * @returns {DocumentFragment} The fragment containing the component.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-file-upload-item');\n\n        let slot = document.createElement('slot');\n        slot.setAttribute('name', 'img');\n\n        let image = document.createElement('div');\n        image.setAttribute('part', 'image');\n        image.classList.add('image');\n\n        let name = document.createElement('span');\n        name.classList.add('name');\n        name.innerText = this.name;\n\n        let actions = document.createElement('slot');\n        actions.classList.add('actions');\n        actions.setAttribute('name', 'action');\n\n        let button = document.createElement('wje-button');\n        button.setAttribute('fill', 'link');\n        button.setAttribute('size', 'small');\n        button.innerHTML = `<wje-icon name=\"x\" size=\"small\"></wje-icon>`;\n\n        let sizeWrapper = document.createElement('span');\n        sizeWrapper.classList.add('size');\n\n        let uploaded = document.createElement('wje-format-digital');\n        uploaded.setAttribute('value', this.uploaded || 0);\n        uploaded.innerHTML = `<span slot=\"start\">${this.localizer.translate('wj.file.upload.uploaded')}</span>`;\n\n        let size = document.createElement('wje-format-digital');\n        size.setAttribute('value', this.size || 0);\n        size.innerHTML = `<span slot=\"start\">&nbsp;${this.localizer.translate('wj.file.upload.from')} </span>`;\n\n        let size2 = document.createElement('wje-format-digital');\n        size2.setAttribute('value', this.size || 0);\n\n        let slider = document.createElement('wje-progress-bar');\n        slider.classList.add('file-progress');\n        slider.setAttribute('id', 'id-' + this.lastModified);\n        slider.setAttribute('progress', this.progress);\n        slider.setAttribute('color', 'success');\n\n        image.appendChild(slot);\n        actions.appendChild(button);\n\n        sizeWrapper.appendChild(uploaded);\n        sizeWrapper.appendChild(size);\n\n        native.appendChild(image);\n        native.appendChild(name);\n\n        if (!this.isUploaded)\n            native.appendChild(sizeWrapper);\n        else\n            native.appendChild(size2);\n\n        native.appendChild(actions);\n\n        if (!this.isUploaded)\n            native.appendChild(slider);\n\n        fragment.appendChild(native);\n\n        this.button = button;\n        this.uploadedEl = uploaded;\n        this.sliderEl = slider;\n\n        return fragment;\n    }\n\n    /**\n     * Called after the component has been drawn.\n     */\n    afterDraw() {\n        this.button.addEventListener('wje-button:click', this.onDelete);\n    }\n\n    /**\n     * Handles the delete action.\n     */\n    onDelete = () => {\n        this.remove();\n    };\n}\n","import FileUploadItem from './file-upload-item.element.js';\n\nexport default FileUploadItem;\n\nFileUploadItem.define('wje-file-upload-item', FileUploadItem);\n"],"names":[],"mappings":"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"}

package/dist/wje-file-upload.js

@@ -208,6 +208,7 @@ class FileUpload extends WJElement {
           this.appendChild(preview);
           this.uploadFunction(file, preview).then((res) => {
             var _a2;
+            res.item = preview;
             this.dispatchEvent(
               new CustomEvent("file-upload:upladed-file-complete", {
                 detail: res,
@@ -342,6 +343,22 @@ class FileUpload extends WJElement {
   get toChunk() {
     return this.hasAttribute("to-chunk");
   }
+  /**
+   * Sets the maximum number of files that can be uploaded or managed.
+   * Assigns the specified value to the 'max-files' attribute.
+   * @param {number} value The maximum allowable number of files.
+   */
+  set maxFiles(value) {
+    this.setAttribute("max-files", value);
+  }
+  /**
+   * Retrieves the maximum number of files allowed from the `max-files` attribute.
+   * If the attribute is not set or is invalid, defaults to 0.
+   * @returns {number} The maximum number of files allowed.
+   */
+  get maxFiles() {
+    return parseInt(this.getAttribute("max-files")) || 1;
+  }
   /**
    * Getter for cssStyleSheet.
    * @returns {string} The CSS styles for the component.
@@ -455,6 +472,20 @@ class FileUpload extends WJElement {
    */
   addFilesToQueue(files) {
     var _a;
+    if (this.maxFiles && files.length > this.maxFiles) {
+      this.dispatchEvent(
+        new CustomEvent("file-upload:error", {
+          detail: {
+            type: "max-files-exceeded",
+            max: this.maxFiles,
+            received: files.length
+          },
+          bubbles: true,
+          composed: true
+        })
+      );
+      return;
+    }
     this._queuedFiles = [...files];
     this.dispatchEvent(
       new CustomEvent("file-upload:files-added", { detail: files, bubbles: true, composed: true })

package/dist/wje-file-upload.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-file-upload.js","sources":["../packages/wje-file-upload/service/service.js","../packages/wje-file-upload/file-upload.element.js","../packages/wje-file-upload/file-upload.js"],"sourcesContent":["/**\n * Returns a list of file type categories and their corresponding icon names.\n * @returns {Array<object>} An array of objects representing file type categories.\n * Each object contains the following properties:\n * - `type` {Array&lt;string>} A list of file extensions associated with the category.\n * - `name` {string} The name of the icon representing the category.\n * @example\n * const types = fileType();\n * console.log(types);\n * // [\n * //   { type: [\"jpg\", \"jpeg\", \"png\", \"gif\", \"bpm\", \"tiff\", \"svg\"], name: \"photo\" },\n * //   { type: [\"zip\", \"rar\", \"cab\", \"jar\", \"tar\", \"gzip\", \"uue\", \"bz2\", \"scorm\", \"war\"], name: \"file-type-zip\" },\n * //   ...\n * // ]\n */\nfunction fileType() {\n    return [\n        {\n            type: ['jpg', 'jpeg', 'png', 'gif', 'bpm', 'tiff', 'svg'],\n            name: 'photo',\n        },\n        {\n            type: ['zip', 'rar', 'cab', 'jar', 'tar', 'gzip', 'uue', 'bz2', 'scorm', 'war'],\n            name: 'file-type-zip',\n        },\n        {\n            type: ['mov', 'mp4', 'avi', 'flv'],\n            name: 'video',\n        },\n        {\n            type: ['m4a', 'mp3', 'wav'],\n            name: 'audio',\n        },\n        {\n            type: ['html', 'html'],\n            name: 'file-type-html',\n        },\n        {\n            type: ['css'],\n            name: 'code',\n        },\n        {\n            type: ['txt'],\n            name: 'file-type-txt',\n        },\n        {\n            type: ['doc', 'docx'],\n            name: 'file-type-doc',\n        },\n        {\n            type: ['xls', 'xlsx'],\n            name: 'file-type-xls',\n        },\n        {\n            type: ['pdf'],\n            name: 'file-type-pdf',\n        },\n        {\n            type: ['ppt', 'pptx', 'odp'],\n            name: 'file-type-ppt',\n        },\n    ];\n}\n\n/**\n * Retrieves the icon name for a given file type.\n * @param {string} type The file type or category (e.g., \"pdf\", \"image\", \"folder\").\n * @returns {string} The name of the icon associated with the file type.\n * @example\n * getFileTypeIcon('pdf'); // Returns the icon name for PDF files.\n * getFileTypeIcon('folder'); // Returns 'folder'.\n */\nexport function getFileTypeIcon(type) {\n    let searchType;\n    if (type.toLowerCase() !== 'folder') {\n        fileType().forEach((i) => {\n            if (i.type.includes(type.toLowerCase())) {\n                searchType = i.name;\n            }\n        });\n    } else {\n        searchType = 'folder';\n    }\n\n    return searchType;\n}\n\n/**\n * Checks if a given file matches any of the accepted file types.\n * @param {File} file The file to validate.\n * @param {string|string[]} acceptedFileTypes A comma-separated string or an array of accepted MIME types or file extensions.\n * @returns {boolean} Returns `true` if the file type is valid, otherwise `false`.\n * @throws {Error} Throws an error if `acceptedFileTypes` is empty.\n * @example\n * const file = new File([\"\"], \"example.png\", { type: \"image/png\" });\n * const isValid = isValidFileType(file, \"image/*,application/pdf\");\n * console.log(isValid); // true\n * @example\n * const file = new File([\"\"], \"example.txt\", { type: \"text/plain\" });\n * const isValid = isValidFileType(file, [\"text/plain\", \"application/json\"]);\n * console.log(isValid); // true\n */\nexport function isValidFileType(file, acceptedFileTypes) {\n    const mime = file.type.toLowerCase();                     // full mime\n    const base = mime.split('/')[0];                          // e.g. \"application\"\n    const ext = file.name.split('.').pop().toLowerCase();     // e.g. \"xlsx\"\n\n    let accepted = Array.isArray(acceptedFileTypes)\n      ? acceptedFileTypes\n      : acceptedFileTypes.split(',').map(t => t.trim().toLowerCase());\n\n    if (accepted.length === 0) {\n        throw new Error('acceptedFileTypes is empty');\n    }\n\n    for (let type of accepted) {\n        type = type.toLowerCase();\n\n        // image/* alebo application/*\n        if (type === base + '/*') return true;\n\n        // presný MIME typ\n        if (type === mime) return true;\n\n        // extension (xlsx, png, pdf…)\n        if (type === ext) return true;\n    }\n\n    return false;\n}\n\n/**\n * Uploads a file in chunks using `XMLHttpRequest`, allowing for progress tracking.\n * @param {File} file The file to be uploaded.\n * @param {number} chunkSize The size of each chunk in bytes.\n * @param {HTMLElement} preview The element used to display upload progress.\n */\nexport function uploadFile(file, chunkSize, preview) {\n    let offset = 0;\n    const progressArray = new Array(Math.ceil(file.size / chunkSize)).fill(0);\n\n    const readAndUploadChunk = (start, end) => {\n        const reader = new FileReader();\n        const chunkIndex = start / chunkSize;\n        const chunk = file.slice(start, end);\n\n        reader.onload = (e) => {\n            const xhr = new XMLHttpRequest();\n            xhr.open('POST', '/upload', true);\n            xhr.setRequestHeader('Content-Range', `${start}-${end}/${file.size}`);\n\n            xhr.upload.onprogress = (event) => {\n                if (event.lengthComputable) {\n                    const progress = (event.loaded / event.total) * 100;\n                    progressArray[chunkIndex] = progress;\n                    const totalProgress = progressArray.reduce((a, b) => a + b, 0) / progressArray.length;\n                    // this.updateOverallProgress(progressArray, file.lastModified);\n                    // preview.setAttribute(\"progress\", totalProgress);\n                }\n            };\n\n            xhr.onload = () => {\n                if (xhr.status === 200 || xhr.status === 201) {\n                    progressArray[chunkIndex] = 100; // Táto časť je kompletná\n\n                    // Odoslanie ďalšej časti\n                    start += chunkSize;\n                    if (start < file.size) {\n                        preview.setAttribute('uploaded', start);\n                        readAndUploadChunk(start, Math.min(start + chunkSize, file.size));\n                    } else {\n                        preview.setAttribute('uploaded', start);\n                    }\n                } else {\n                    console.error('Error during upload: ', xhr.statusText);\n                }\n            };\n            xhr.send(e.target.result);\n        };\n        reader.readAsArrayBuffer(chunk);\n    };\n\n    readAndUploadChunk(offset, Math.min(offset + chunkSize, file.size));\n}\n\n/**\n * Returns a function for uploading files either in chunks or as a whole file, based on the provided options.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {number} [chunkSize] The size of each chunk in bytes when uploading in chunks (default is 1MB).\n * @param {boolean} [wholeFile] Whether to upload the file as a whole. If `true`, the entire file is uploaded at once.\n * @returns {Function} A function that takes a file and a preview element as arguments and uploads the file.\n * @example\n * // Upload a file in chunks\n * const uploadInChunks = upload('/upload', 1024 * 512); // 512KB chunks\n * uploadInChunks(file, previewElement);\n * @example\n * // Upload a whole file\n * const uploadWhole = upload('/upload', undefined, true);\n * uploadWhole(file, previewElement);\n */\nexport function upload(url, chunkSize = 1024 * 1024, wholeFile = false) {\n    if (wholeFile) {\n        return (file, preview) => uploadWholeFile(url, file, preview);\n    }\n    return (file, preview) => uploadFileInChunks(url, file, preview, chunkSize);\n}\n\n/**\n * Uploads a file in chunks to a specified URL, allowing for progress tracking and resuming in case of errors.\n * @param {string} url The URL to which the file chunks will be uploaded.\n * @param {File} file The file to be uploaded in chunks.\n * @param {HTMLElement} preview The element used to display upload progress.\n * @param {number} [chunkSize] The size of each chunk in bytes (default is 1MB).\n * @returns {Promise<object>} Resolves with the response of the last chunk uploaded, parsed as JSON.\n * @throws {Error} - Throws an error if a chunk fails to upload.\n */\nexport async function uploadFileInChunks(url, file, preview, chunkSize = 1024 * 1024) {\n    let offset = 0;\n    const totalChunks = Math.ceil(file.size / chunkSize);\n    const partResponses = [];\n\n    while (offset < file.size) {\n        const chunk = file.slice(offset, offset + chunkSize);\n\n        // Creating a custom ReadableStream to track progress of the current chunk\n        const stream = new ReadableStream({\n            start(controller) {\n                const reader = chunk.stream().getReader();\n                let uploadedBytes = 0;\n\n                reader.read().then(function process({ done, value }) {\n                    if (done) {\n                        controller.close();\n                        return Promise.resolve();\n                    }\n\n                    // Track progress\n                    uploadedBytes += value.byteLength;\n                    const percentComplete = ((offset + uploadedBytes) / file.size) * 100;\n                    preview.setAttribute('uploaded', offset + uploadedBytes);\n\n                    // Enqueue chunk data into the stream\n                    controller.enqueue(value);\n\n                    // Read the next chunk\n                    return reader.read().then(process);\n                });\n            },\n        });\n\n        const formData = new FormData();\n        formData.append('file', new Blob([stream])); // Send the current stream (chunk)\n        formData.append('chunkIndex', Math.floor(offset / chunkSize)); // Send chunk index\n        formData.append('totalChunks', totalChunks); // Send total chunks\n        formData.append('fileName', file.name); // Send file name\n\n        try {\n            // Send the current chunk via Fetch\n            const response = await fetch(url, {\n                method: 'POST',\n                body: formData,\n            });\n\n            if (!response.ok) {\n                throw new Error(`Failed to upload chunk ${Math.floor(offset / chunkSize) + 1}: ${response.statusText}`);\n            }\n\n            partResponses.push(response);\n        } catch (error) {\n            console.error('Error uploading chunk:', error);\n            break;\n        }\n\n        // Move to the next chunk\n        offset += chunkSize;\n    }\n\n    const response = await partResponses.at(-1).json();\n\n    return {\n        data: response,\n        file,\n    };\n}\n\n/**\n * Uploads a file to a specified URL using a `POST` request and updates the preview element with the uploaded file size.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {File} file The file to be uploaded.\n * @param {HTMLElement} preview The element that displays the upload preview. It will be updated with the file size.\n * @returns {Promise<{data: object, file: File}>} - A promise that resolves with the server response and the uploaded file.\n * @throws {Error} - Logs an error to the console if the request fails.\n */\nexport function uploadWholeFile(url, file, preview) {\n    const formData = new FormData();\n    formData.append('file', file);\n\n    //use fetch\n    return fetch(url, {\n        method: 'POST',\n        body: formData,\n    })\n        .then((response) => response.json())\n        .then((data) => {\n            preview.setAttribute('uploaded', file.size);\n            return {\n                data,\n                file,\n            };\n        })\n        .catch((error) => {\n            console.error('Error:', error);\n        });\n}\n","import { Localizer } from '../utils/localize.js';\nimport Button from '../wje-button/button.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport { getFileTypeIcon, isValidFileType, upload } from './service/service.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary FileUpload is a custom web component for uploading files.\n * It extends from WJElement and provides functionalities for file upload.\n * @documentation https://elements.webjet.sk/components/file-upload\n * @status stable\n * @augments WJElement\n * @slot - This is a default/unnamed slot.\n * @csspart native - The native file upload part.\n * @csspart file-list - The file list part.\n * @csspart upload-button - The label part.\n * @event change - Fires when the file input changes.\n * @event drop - Fires when a file is dropped into the component.\n * @attribute {string} accepted-types - The accepted file types for upload.\n * @attribute {number} chunk-size - The chunk size for file upload.\n * @attribute {number} max-file-size - The maximum file size for upload.\n * @attribute {string} upload-url - The URL to set as the upload URL.\n * @attribute {boolean} auto-process-files - The auto process files attribute.\n * @attribute {boolean} no-upload-button - The no upload button attribute.\n * @tag wje-file-upload\n */\nexport default class FileUpload extends WJElement {\n    /**\n     * Constructor for FileUpload.\n     * Initializes a new instance of the Localizer.\n     */\n    constructor() {\n        super();\n        this.localizer = new Localizer(this);\n        this._uploadedFiles = [];\n        this._queuedFiles = [];\n    }\n\n    /**\n     * Dependencies for the FileUpload component.\n     * @type {object}\n     */\n    dependencies = {\n        'wje-button': Button,\n    };\n\n    /**\n     * Setter for acceptedTypes attribute.\n     * @param {string} value The accepted file types for upload.\n     */\n    set acceptedTypes(value) {\n        this.setAttribute('accepted-types', value);\n    }\n\n    /**\n     * Getter for acceptedTypes attribute.\n     * @returns {string} The accepted file types for upload.\n     */\n    get acceptedTypes() {\n        const accepted = this.getAttribute('accepted-types');\n        return this.hasAttribute('accepted-types') ? accepted : '';\n    }\n\n    /**\n     * Setter for chunkSize attribute.\n     * @param {number} value The chunk size for file upload.\n     */\n    set chunkSize(value) {\n        this.setAttribute('chunk-size', value);\n    }\n\n    /**\n     * Getter for chunkSize attribute.\n     * @returns {number} The chunk size for file upload.\n     */\n    get chunkSize() {\n        const chunk = this.getAttribute('chunk-size');\n        return this.hasAttribute('chunk-size') ? chunk : 1024 * 1024;\n    }\n\n    /**\n     * Setter for maxFileSize attribute.\n     * @param {number} value The maximum file size for upload.\n     */\n    set maxFileSize(value) {\n        this.setAttribute('max-file-size', value);\n    }\n\n    /**\n     * Getter for maxFileSize attribute.\n     * @returns {number} The maximum file size for upload.\n     */\n    get maxFileSize() {\n        const fileSize = this.getAttribute('max-file-size');\n        return this.hasAttribute('max-file-size') ? fileSize * 1024 * 1024 : 1024 * 1024;\n    }\n\n    /**\n     * Setter for label attribute.\n     * @param {string} value The URL to set as the upload URL.\n     */\n    set uploadUrl(value) {\n        this.setAttribute('upload-url', value);\n    }\n\n    /**\n     * Gets the upload URL for the file upload element.\n     * @returns {string} The upload URL for the file upload element.\n     */\n    get uploadUrl() {\n        return this.getAttribute('upload-url') ?? '/upload';\n    }\n\n    /**\n     * Sets the autoProcessFiles attribute.\n     * @param value\n     */\n    set autoProcessFiles(value) {\n        this.setAttribute('auto-process-files', value);\n    }\n\n    /**\n     * Gets the autoProcessFiles attribute.\n     * @returns {any|boolean}\n     */\n    get autoProcessFiles() {\n        return JSON.parse(this.getAttribute('auto-process-files')) ?? true;\n    }\n\n    /**\n     * Sets the noUploadButton attribute.\n     * @param value\n     */\n    set noUploadButton(value) {\n        this.setAttribute('no-upload-button', value);\n    }\n\n    /**\n     * Gets the noUploadButton attribute.\n     * @returns {boolean}\n     */\n    get noUploadButton() {\n        return this.hasAttribute('no-upload-button');\n    }\n\n    /**\n     * Sets the uploaded files.\n     * @param value\n     */\n    set uploadedFiles(value) {\n        this._uploadedFiles = value;\n    }\n\n    /**\n     * Return the uploaded files.\n     * @returns {[]}\n     */\n    get uploadedFiles() {\n        return this._uploadedFiles;\n    }\n\n    /**\n     * Sets the to-chunk attribute.\n     * @param value\n     */\n    set toChunk(value) {\n        this.setAttribute('to-chunk', value);\n    }\n\n    /**\n     * Gets the to-chunk attribute.\n     * @returns {boolean}\n     */\n    get toChunk() {\n        return this.hasAttribute('to-chunk');\n    }\n\n    className = 'FileUpload';\n\n    /**\n     * Getter for cssStyleSheet.\n     * @returns {string} The CSS styles for the component.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for observedAttributes.\n     * @returns {Array} An empty array as no attributes are observed.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Method to setup attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    beforeDraw() {\n        this.uploadFunction = upload(this.uploadUrl, this.chunkSize, !this.toChunk);\n    }\n\n    /**\n     * Method to draw the component on the screen.\n     * @returns {DocumentFragment} The fragment containing the component.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-file-upload');\n        native.setAttribute('part', 'native');\n\n        let label = document.createElement('div');\n        label.setAttribute('part', 'file-label');\n        label.classList.add('file-label');\n\n        let fileList = document.createElement('slot');\n        fileList.setAttribute('name', 'item');\n        fileList.setAttribute('part', 'items');\n        fileList.classList.add('file-list');\n\n        let slot = document.createElement('slot');\n        label.appendChild(slot);\n\n        let fileInput = document.createElement('input');\n        fileInput.setAttribute('type', 'file');\n        fileInput.setAttribute('multiple', '');\n        fileInput.setAttribute('style', 'display:none;');\n\n        if (!this.noUploadButton) {\n            let button = document.createElement('wje-button');\n            button.innerText = this.label || this.localizer.translate('wj.file.upload.button');\n            button.setAttribute('part', 'upload-button');\n\n            label.appendChild(button);\n\n            this.button = button;\n        }\n\n        native.appendChild(fileInput);\n        native.appendChild(label);\n        native.appendChild(fileList);\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.fileList = fileList;\n        this.fileInput = fileInput;\n\n        return fragment;\n    }\n\n    /**\n     * Method to perform actions after the component is drawn.\n     */\n    afterDraw() {\n        this.button?.addEventListener('click', () => {\n            this.fileInput.click();\n        });\n\n        this.fileInput.addEventListener('change', this.handleInputChange);\n        this.native.addEventListener('drop', this.handleDrop);\n\n        let dragEventCounter = 0;\n\n        this.native.addEventListener('dragenter', (event) => {\n            event.preventDefault();\n\n            if (dragEventCounter === 0) {\n                this.native.classList.add('highlight');\n            }\n\n            dragEventCounter += 1;\n        });\n\n        this.native.addEventListener('dragover', (event) => {\n            event.preventDefault();\n\n            if (dragEventCounter === 0) {\n                dragEventCounter = 1;\n            }\n        });\n\n        this.native.addEventListener('dragleave', (event) => {\n            event.preventDefault();\n\n            dragEventCounter -= 1;\n\n            if (dragEventCounter <= 0) {\n                dragEventCounter = 0;\n                this.native.classList.remove('highlight');\n            }\n        });\n\n        this.native.addEventListener('drop', (event) => {\n            event.preventDefault();\n\n            dragEventCounter = 0;\n            this.native.classList.remove('highlight');\n        });\n    }\n\n    /**\n     * Method to handle form submission.\n     * @param {Event} event The form submission event.\n     */\n    handleSubmit(event) {\n        event.preventDefault();\n\n        // TODO: TU TREBA PRIDAT ZOBRAZENIE SUBORU A JEHO PROCESSU\n\n        this.addFilesToQueue(this.fileInput.files);\n    }\n\n    /**\n     * Method to handle file drop event.\n     * @param {Event} event The file drop event object.\n     */\n    handleDrop = (event) => {\n        const fileList = event.dataTransfer.files;\n\n        this.resetFormState();\n\n        this.addFilesToQueue(fileList);\n    };\n\n    /**\n     * Method to handle file input change event.\n     * @param {Event} event The file input change event object.\n     */\n    handleInputChange = (event) => {\n        this.resetFormState();\n\n        try {\n            this.handleSubmit(event);\n        } catch (err) {}\n    };\n\n    /**\n     * Method to add files to the queue.\n     * @param files\n     */\n    addFilesToQueue(files) {\n        this._queuedFiles = [...files];\n\n        this.dispatchEvent(\n            new CustomEvent('file-upload:files-added', { detail: files, bubbles: true, composed: true })\n        );\n        this.onAddedFiles?.();\n\n        if (this.autoProcessFiles) {\n            this.uploadFiles();\n        }\n\n        this.fileInput.value = '';\n    }\n\n    /**\n     * Method to upload files.\n     */\n    uploadFiles() {\n        if (this._queuedFiles.length === 0) {\n            return;\n        }\n\n        const uploadPromises = this._queuedFiles.map((file) => this.createUploadPromise(file));\n        uploadPromises\n            .reduce((prev, curr) => {\n                return prev.then(() => {\n                    return curr;\n                });\n            }, Promise.resolve())\n            .then(() => {\n                this.dispatchEvent(\n                    new CustomEvent('file-upload:all-files-uploaded', {\n                        detail: this.uploadedFiles,\n                        bubbles: true,\n                        composed: true,\n                    })\n                );\n                this.onAllFilesUploaded?.();\n                this._queuedFiles = [];\n            });\n    }\n\n    /**\n     * Method to create an upload promise.\n     * @param file\n     * @returns {Promise<unknown>}\n     */\n    createUploadPromise = (file) => {\n        return new Promise((resolve, reject) => {\n            this.assertFilesValid(file);\n            let preview;\n\n            let reader = new FileReader();\n            reader.onload = (e) => {\n                this.dispatchEvent(\n                    new CustomEvent('file-upload:upload-started', { detail: file, bubbles: true, composed: true })\n                );\n                this.onUploadStarted?.(file);\n\n                preview = this.createPreview(file, reader);\n                this.appendChild(preview);\n\n                this.uploadFunction(file, preview).then((res) => {\n                    this.dispatchEvent(\n                        new CustomEvent('file-upload:upladed-file-complete', {\n                            detail: res,\n                            bubbles: true,\n                            composed: true,\n                        })\n                    );\n                    this.onUploadedFileComplete?.(res);\n                    this.uploadedFiles.push(res.data);\n\n                    resolve(res);\n                });\n            };\n\n            reader.readAsDataURL(file);\n        });\n    };\n\n    /**\n     * Method to create a preview for the file.\n     * @param {File} file The file for which the preview is to be created.\n     * @param {FileReader} reader The FileReader instance to read the file.\n     * @returns {HTMLElement} The created preview.\n     */\n    createPreview(file, reader) {\n        let preview = document.createElement('wje-file-upload-item');\n        preview.setAttribute('slot', 'item');\n        preview.setAttribute('name', file.name);\n        preview.setAttribute('size', file.size);\n        preview.setAttribute('uploaded', '0');\n        preview.setAttribute('progress', '0');\n        preview.innerHTML = `<wje-icon slot=\"img\" name=\"${getFileTypeIcon(file.type.split('/')[1])}\" size=\"large\"></wje-icon>`;\n\n        return preview;\n    }\n\n    /**\n     * Method to create a thumbnail for the file.\n     * @param {File} file The file for which the thumbnail is to be created.\n     * @param {FileReader} reader The FileReader instance to read the file.\n     * @returns {HTMLElement} The created thumbnail.\n     */\n    createThumbnail(file, reader) {\n        let img = document.createElement('img');\n        img.setAttribute('src', reader.result);\n\n        return img;\n    }\n\n    /**\n     * Method to validate the files.\n     * @param {File} file The file to be validated.\n     * TODO: alowed types a size limit by malo byt cez attributy\n     */\n    assertFilesValid(file) {\n        const { name: fileName, size: fileSize } = file;\n        if (!isValidFileType(file, this.acceptedTypes)) {\n            throw new Error(`❌ FILE: \"${fileName}\" Valid file types are: \"${this.acceptedTypes}\"`);\n        }\n\n        if (fileSize > this.maxFileSize) {\n            throw new Error(\n                `❌ File \"${fileName}\" could not be uploaded. Only images up to ${this.maxFileSize} MB are allowed. Nie je to ${fileSize}`\n            );\n        }\n    }\n\n    /**\n     * Method to reset the form state.\n     */\n    resetFormState() {\n        this.fileList.textContent = '';\n    }\n}\n","import FileUpload from './file-upload.element.js';\n\nexport default FileUpload;\n\nFileUpload.define('wje-file-upload', FileUpload);\n"],"names":["response","_a"],"mappings":";;;;;;AAeA,SAAS,WAAW;AAChB,SAAO;AAAA,IACH;AAAA,MACI,MAAM,CAAC,OAAO,QAAQ,OAAO,OAAO,OAAO,QAAQ,KAAK;AAAA,MACxD,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,OAAO,OAAO,OAAO,OAAO,OAAO,QAAQ,OAAO,OAAO,SAAS,KAAK;AAAA,MAC9E,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,OAAO,OAAO,OAAO,KAAK;AAAA,MACjC,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,OAAO,OAAO,KAAK;AAAA,MAC1B,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,QAAQ,MAAM;AAAA,MACrB,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,KAAK;AAAA,MACZ,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,KAAK;AAAA,MACZ,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,OAAO,MAAM;AAAA,MACpB,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,OAAO,MAAM;AAAA,MACpB,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,KAAK;AAAA,MACZ,MAAM;AAAA,IACT;AAAA,IACD;AAAA,MACI,MAAM,CAAC,OAAO,QAAQ,KAAK;AAAA,MAC3B,MAAM;AAAA,IACT;AAAA,EACJ;AACL;AAUO,SAAS,gBAAgB,MAAM;AAClC,MAAI;AACJ,MAAI,KAAK,YAAa,MAAK,UAAU;AACjC,aAAU,EAAC,QAAQ,CAAC,MAAM;AACtB,UAAI,EAAE,KAAK,SAAS,KAAK,YAAa,CAAA,GAAG;AACrC,qBAAa,EAAE;AAAA,MAC/B;AAAA,IACA,CAAS;AAAA,EACT,OAAW;AACH,iBAAa;AAAA,EACrB;AAEI,SAAO;AACX;AAiBO,SAAS,gBAAgB,MAAM,mBAAmB;AACrD,QAAM,OAAO,KAAK,KAAK,YAAW;AAClC,QAAM,OAAO,KAAK,MAAM,GAAG,EAAE,CAAC;AAC9B,QAAM,MAAM,KAAK,KAAK,MAAM,GAAG,EAAE,MAAM;AAEvC,MAAI,WAAW,MAAM,QAAQ,iBAAiB,IAC1C,oBACA,kBAAkB,MAAM,GAAG,EAAE,IAAI,OAAK,EAAE,OAAO,aAAa;AAEhE,MAAI,SAAS,WAAW,GAAG;AACvB,UAAM,IAAI,MAAM,4BAA4B;AAAA,EACpD;AAEI,WAAS,QAAQ,UAAU;AACvB,WAAO,KAAK,YAAa;AAGzB,QAAI,SAAS,OAAO,KAAM,QAAO;AAGjC,QAAI,SAAS,KAAM,QAAO;AAG1B,QAAI,SAAS,IAAK,QAAO;AAAA,EACjC;AAEI,SAAO;AACX;AAuEO,SAAS,OAAO,KAAK,YAAY,OAAO,MAAM,YAAY,OAAO;AACpE,MAAI,WAAW;AACX,WAAO,CAAC,MAAM,YAAY,gBAAgB,KAAK,MAAM,OAAO;AAAA,EACpE;AACI,SAAO,CAAC,MAAM,YAAY,mBAAmB,KAAK,MAAM,SAAS,SAAS;AAC9E;AAWO,eAAe,mBAAmB,KAAK,MAAM,SAAS,YAAY,OAAO,MAAM;AAClF,MAAI,SAAS;AACb,QAAM,cAAc,KAAK,KAAK,KAAK,OAAO,SAAS;AACnD,QAAM,gBAAgB,CAAE;AAExB,SAAO,SAAS,KAAK,MAAM;AACvB,UAAM,QAAQ,KAAK,MAAM,QAAQ,SAAS,SAAS;AAGnD,UAAM,SAAS,IAAI,eAAe;AAAA,MAC9B,MAAM,YAAY;AACd,cAAM,SAAS,MAAM,OAAM,EAAG,UAAW;AACzC,YAAI,gBAAgB;AAEpB,eAAO,KAAI,EAAG,KAAK,SAAS,QAAQ,EAAE,MAAM,SAAS;AACjD,cAAI,MAAM;AACN,uBAAW,MAAO;AAClB,mBAAO,QAAQ,QAAS;AAAA,UAChD;AAGoB,2BAAiB,MAAM;AACC,WAAE,SAAS,iBAAiB,KAAK,OAAQ;AACjE,kBAAQ,aAAa,YAAY,SAAS,aAAa;AAGvD,qBAAW,QAAQ,KAAK;AAGxB,iBAAO,OAAO,OAAO,KAAK,OAAO;AAAA,QACrD,CAAiB;AAAA,MACJ;AAAA,IACb,CAAS;AAED,UAAM,WAAW,IAAI,SAAU;AAC/B,aAAS,OAAO,QAAQ,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC;AAC1C,aAAS,OAAO,cAAc,KAAK,MAAM,SAAS,SAAS,CAAC;AAC5D,aAAS,OAAO,eAAe,WAAW;AAC1C,aAAS,OAAO,YAAY,KAAK,IAAI;AAErC,QAAI;AAEA,YAAMA,YAAW,MAAM,MAAM,KAAK;AAAA,QAC9B,QAAQ;AAAA,QACR,MAAM;AAAA,MACtB,CAAa;AAED,UAAI,CAACA,UAAS,IAAI;AACd,cAAM,IAAI,MAAM,0BAA0B,KAAK,MAAM,SAAS,SAAS,IAAI,CAAC,KAAKA,UAAS,UAAU,EAAE;AAAA,MACtH;AAEY,oBAAc,KAAKA,SAAQ;AAAA,IAC9B,SAAQ,OAAO;AACZ,cAAQ,MAAM,0BAA0B,KAAK;AAC7C;AAAA,IACZ;AAGQ,cAAU;AAAA,EAClB;AAEI,QAAM,WAAW,MAAM,cAAc,GAAG,EAAE,EAAE,KAAM;AAElD,SAAO;AAAA,IACH,MAAM;AAAA,IACN;AAAA,EACH;AACL;AAUO,SAAS,gBAAgB,KAAK,MAAM,SAAS;AAChD,QAAM,WAAW,IAAI,SAAU;AAC/B,WAAS,OAAO,QAAQ,IAAI;AAG5B,SAAO,MAAM,KAAK;AAAA,IACd,QAAQ;AAAA,IACR,MAAM;AAAA,EACT,CAAA,EACI,KAAK,CAAC,aAAa,SAAS,KAAM,CAAA,EAClC,KAAK,CAAC,SAAS;AACZ,YAAQ,aAAa,YAAY,KAAK,IAAI;AAC1C,WAAO;AAAA,MACH;AAAA,MACA;AAAA,IACH;AAAA,EACJ,CAAA,EACA,MAAM,CAAC,UAAU;AACd,YAAQ,MAAM,UAAU,KAAK;AAAA,EACzC,CAAS;AACT;;AC/Re,MAAM,mBAAmB,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,EAK9C,cAAc;AACV,UAAO;AAUX;AAAA;AAAA;AAAA;AAAA,wCAAe;AAAA,MACX,cAAc;AAAA,IACjB;AAqID,qCAAY;AAkJZ;AAAA;AAAA;AAAA;AAAA,sCAAa,CAAC,UAAU;AACpB,YAAM,WAAW,MAAM,aAAa;AAEpC,WAAK,eAAgB;AAErB,WAAK,gBAAgB,QAAQ;AAAA,IAChC;AAMD;AAAA;AAAA;AAAA;AAAA,6CAAoB,CAAC,UAAU;AAC3B,WAAK,eAAgB;AAErB,UAAI;AACA,aAAK,aAAa,KAAK;AAAA,MAC1B,SAAQ,KAAK;AAAA,MAAA;AAAA,IACjB;AAsDD;AAAA;AAAA;AAAA;AAAA;AAAA,+CAAsB,CAAC,SAAS;AAC5B,aAAO,IAAI,QAAQ,CAAC,SAAS,WAAW;AACpC,aAAK,iBAAiB,IAAI;AAC1B,YAAI;AAEJ,YAAI,SAAS,IAAI,WAAY;AAC7B,eAAO,SAAS,CAAC,MAAM;;AACnB,eAAK;AAAA,YACD,IAAI,YAAY,8BAA8B,EAAE,QAAQ,MAAM,SAAS,MAAM,UAAU,KAAM,CAAA;AAAA,UAChG;AACD,qBAAK,oBAAL,8BAAuB;AAEvB,oBAAU,KAAK,cAAc,MAAM,MAAM;AACzC,eAAK,YAAY,OAAO;AAExB,eAAK,eAAe,MAAM,OAAO,EAAE,KAAK,CAAC,QAAQ;;AAC7C,iBAAK;AAAA,cACD,IAAI,YAAY,qCAAqC;AAAA,gBACjD,QAAQ;AAAA,gBACR,SAAS;AAAA,gBACT,UAAU;AAAA,cACb,CAAA;AAAA,YACJ;AACD,aAAAC,MAAA,KAAK,2BAAL,gBAAAA,IAAA,WAA8B;AAC9B,iBAAK,cAAc,KAAK,IAAI,IAAI;AAEhC,oBAAQ,GAAG;AAAA,UAC/B,CAAiB;AAAA,QACJ;AAED,eAAO,cAAc,IAAI;AAAA,MACrC,CAAS;AAAA,IACJ;AA1YG,SAAK,YAAY,IAAI,UAAU,IAAI;AACnC,SAAK,iBAAiB,CAAE;AACxB,SAAK,eAAe,CAAE;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,EAcI,IAAI,cAAc,OAAO;AACrB,SAAK,aAAa,kBAAkB,KAAK;AAAA,EACjD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,gBAAgB;AAChB,UAAM,WAAW,KAAK,aAAa,gBAAgB;AACnD,WAAO,KAAK,aAAa,gBAAgB,IAAI,WAAW;AAAA,EAChE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU,OAAO;AACjB,SAAK,aAAa,cAAc,KAAK;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY;AACZ,UAAM,QAAQ,KAAK,aAAa,YAAY;AAC5C,WAAO,KAAK,aAAa,YAAY,IAAI,QAAQ,OAAO;AAAA,EAChE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY,OAAO;AACnB,SAAK,aAAa,iBAAiB,KAAK;AAAA,EAChD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,cAAc;AACd,UAAM,WAAW,KAAK,aAAa,eAAe;AAClD,WAAO,KAAK,aAAa,eAAe,IAAI,WAAW,OAAO,OAAO,OAAO;AAAA,EACpF;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU,OAAO;AACjB,SAAK,aAAa,cAAc,KAAK;AAAA,EAC7C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,YAAY;AACZ,WAAO,KAAK,aAAa,YAAY,KAAK;AAAA,EAClD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,iBAAiB,OAAO;AACxB,SAAK,aAAa,sBAAsB,KAAK;AAAA,EACrD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,mBAAmB;AACnB,WAAO,KAAK,MAAM,KAAK,aAAa,oBAAoB,CAAC,KAAK;AAAA,EACtE;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,eAAe,OAAO;AACtB,SAAK,aAAa,oBAAoB,KAAK;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,iBAAiB;AACjB,WAAO,KAAK,aAAa,kBAAkB;AAAA,EACnD;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,cAAc,OAAO;AACrB,SAAK,iBAAiB;AAAA,EAC9B;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,gBAAgB;AAChB,WAAO,KAAK;AAAA,EACpB;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,QAAQ,OAAO;AACf,SAAK,aAAa,YAAY,KAAK;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,IAAI,UAAU;AACV,WAAO,KAAK,aAAa,UAAU;AAAA,EAC3C;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,WAAW,gBAAgB;AACvB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,WAAW,qBAAqB;AAC5B,WAAO,CAAE;AAAA,EACjB;AAAA;AAAA;AAAA;AAAA,EAKI,kBAAkB;AACd,SAAK,eAAe;AAAA,EAC5B;AAAA,EAEI,aAAa;AACT,SAAK,iBAAiB,OAAO,KAAK,WAAW,KAAK,WAAW,CAAC,KAAK,OAAO;AAAA,EAClF;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,OAAO;AACH,QAAI,WAAW,SAAS,uBAAwB;AAEhD,QAAI,SAAS,SAAS,cAAc,KAAK;AACzC,WAAO,UAAU,IAAI,oBAAoB;AACzC,WAAO,aAAa,QAAQ,QAAQ;AAEpC,QAAI,QAAQ,SAAS,cAAc,KAAK;AACxC,UAAM,aAAa,QAAQ,YAAY;AACvC,UAAM,UAAU,IAAI,YAAY;AAEhC,QAAI,WAAW,SAAS,cAAc,MAAM;AAC5C,aAAS,aAAa,QAAQ,MAAM;AACpC,aAAS,aAAa,QAAQ,OAAO;AACrC,aAAS,UAAU,IAAI,WAAW;AAElC,QAAI,OAAO,SAAS,cAAc,MAAM;AACxC,UAAM,YAAY,IAAI;AAEtB,QAAI,YAAY,SAAS,cAAc,OAAO;AAC9C,cAAU,aAAa,QAAQ,MAAM;AACrC,cAAU,aAAa,YAAY,EAAE;AACrC,cAAU,aAAa,SAAS,eAAe;AAE/C,QAAI,CAAC,KAAK,gBAAgB;AACtB,UAAI,SAAS,SAAS,cAAc,YAAY;AAChD,aAAO,YAAY,KAAK,SAAS,KAAK,UAAU,UAAU,uBAAuB;AACjF,aAAO,aAAa,QAAQ,eAAe;AAE3C,YAAM,YAAY,MAAM;AAExB,WAAK,SAAS;AAAA,IAC1B;AAEQ,WAAO,YAAY,SAAS;AAC5B,WAAO,YAAY,KAAK;AACxB,WAAO,YAAY,QAAQ;AAE3B,aAAS,YAAY,MAAM;AAE3B,SAAK,SAAS;AACd,SAAK,WAAW;AAChB,SAAK,YAAY;AAEjB,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA,EAKI,YAAY;;AACR,eAAK,WAAL,mBAAa,iBAAiB,SAAS,MAAM;AACzC,WAAK,UAAU,MAAO;AAAA,IAClC;AAEQ,SAAK,UAAU,iBAAiB,UAAU,KAAK,iBAAiB;AAChE,SAAK,OAAO,iBAAiB,QAAQ,KAAK,UAAU;AAEpD,QAAI,mBAAmB;AAEvB,SAAK,OAAO,iBAAiB,aAAa,CAAC,UAAU;AACjD,YAAM,eAAgB;AAEtB,UAAI,qBAAqB,GAAG;AACxB,aAAK,OAAO,UAAU,IAAI,WAAW;AAAA,MACrD;AAEY,0BAAoB;AAAA,IAChC,CAAS;AAED,SAAK,OAAO,iBAAiB,YAAY,CAAC,UAAU;AAChD,YAAM,eAAgB;AAEtB,UAAI,qBAAqB,GAAG;AACxB,2BAAmB;AAAA,MACnC;AAAA,IACA,CAAS;AAED,SAAK,OAAO,iBAAiB,aAAa,CAAC,UAAU;AACjD,YAAM,eAAgB;AAEtB,0BAAoB;AAEpB,UAAI,oBAAoB,GAAG;AACvB,2BAAmB;AACnB,aAAK,OAAO,UAAU,OAAO,WAAW;AAAA,MACxD;AAAA,IACA,CAAS;AAED,SAAK,OAAO,iBAAiB,QAAQ,CAAC,UAAU;AAC5C,YAAM,eAAgB;AAEtB,yBAAmB;AACnB,WAAK,OAAO,UAAU,OAAO,WAAW;AAAA,IACpD,CAAS;AAAA,EACT;AAAA;AAAA;AAAA;AAAA;AAAA,EAMI,aAAa,OAAO;AAChB,UAAM,eAAgB;AAItB,SAAK,gBAAgB,KAAK,UAAU,KAAK;AAAA,EACjD;AAAA;AAAA;AAAA;AAAA;AAAA,EA8BI,gBAAgB,OAAO;;AACnB,SAAK,eAAe,CAAC,GAAG,KAAK;AAE7B,SAAK;AAAA,MACD,IAAI,YAAY,2BAA2B,EAAE,QAAQ,OAAO,SAAS,MAAM,UAAU,KAAM,CAAA;AAAA,IAC9F;AACD,eAAK,iBAAL;AAEA,QAAI,KAAK,kBAAkB;AACvB,WAAK,YAAa;AAAA,IAC9B;AAEQ,SAAK,UAAU,QAAQ;AAAA,EAC/B;AAAA;AAAA;AAAA;AAAA,EAKI,cAAc;AACV,QAAI,KAAK,aAAa,WAAW,GAAG;AAChC;AAAA,IACZ;AAEQ,UAAM,iBAAiB,KAAK,aAAa,IAAI,CAAC,SAAS,KAAK,oBAAoB,IAAI,CAAC;AACrF,mBACK,OAAO,CAAC,MAAM,SAAS;AACpB,aAAO,KAAK,KAAK,MAAM;AACnB,eAAO;AAAA,MAC3B,CAAiB;AAAA,IACjB,GAAe,QAAQ,QAAS,CAAA,EACnB,KAAK,MAAM;;AACR,WAAK;AAAA,QACD,IAAI,YAAY,kCAAkC;AAAA,UAC9C,QAAQ,KAAK;AAAA,UACb,SAAS;AAAA,UACT,UAAU;AAAA,QACb,CAAA;AAAA,MACJ;AACD,iBAAK,uBAAL;AACA,WAAK,eAAe,CAAE;AAAA,IACtC,CAAa;AAAA,EACb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA+CI,cAAc,MAAM,QAAQ;AACxB,QAAI,UAAU,SAAS,cAAc,sBAAsB;AAC3D,YAAQ,aAAa,QAAQ,MAAM;AACnC,YAAQ,aAAa,QAAQ,KAAK,IAAI;AACtC,YAAQ,aAAa,QAAQ,KAAK,IAAI;AACtC,YAAQ,aAAa,YAAY,GAAG;AACpC,YAAQ,aAAa,YAAY,GAAG;AACpC,YAAQ,YAAY,8BAA8B,gBAAgB,KAAK,KAAK,MAAM,GAAG,EAAE,CAAC,CAAC,CAAC;AAE1F,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAQI,gBAAgB,MAAM,QAAQ;AAC1B,QAAI,MAAM,SAAS,cAAc,KAAK;AACtC,QAAI,aAAa,OAAO,OAAO,MAAM;AAErC,WAAO;AAAA,EACf;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOI,iBAAiB,MAAM;AACnB,UAAM,EAAE,MAAM,UAAU,MAAM,SAAU,IAAG;AAC3C,QAAI,CAAC,gBAAgB,MAAM,KAAK,aAAa,GAAG;AAC5C,YAAM,IAAI,MAAM,YAAY,QAAQ,4BAA4B,KAAK,aAAa,GAAG;AAAA,IACjG;AAEQ,QAAI,WAAW,KAAK,aAAa;AAC7B,YAAM,IAAI;AAAA,QACN,WAAW,QAAQ,8CAA8C,KAAK,WAAW,8BAA8B,QAAQ;AAAA,MAC1H;AAAA,IACb;AAAA,EACA;AAAA;AAAA;AAAA;AAAA,EAKI,iBAAiB;AACb,SAAK,SAAS,cAAc;AAAA,EACpC;AACA;ACheA,WAAW,OAAO,mBAAmB,UAAU;"}
+{"version":3,"file":"wje-file-upload.js","sources":["../packages/wje-file-upload/service/service.js","../packages/wje-file-upload/file-upload.element.js","../packages/wje-file-upload/file-upload.js"],"sourcesContent":["/**\n * Returns a list of file type categories and their corresponding icon names.\n * @returns {Array<object>} An array of objects representing file type categories.\n * Each object contains the following properties:\n * - `type` {Array&lt;string>} A list of file extensions associated with the category.\n * - `name` {string} The name of the icon representing the category.\n * @example\n * const types = fileType();\n * console.log(types);\n * // [\n * //   { type: [\"jpg\", \"jpeg\", \"png\", \"gif\", \"bpm\", \"tiff\", \"svg\"], name: \"photo\" },\n * //   { type: [\"zip\", \"rar\", \"cab\", \"jar\", \"tar\", \"gzip\", \"uue\", \"bz2\", \"scorm\", \"war\"], name: \"file-type-zip\" },\n * //   ...\n * // ]\n */\nfunction fileType() {\n    return [\n        {\n            type: ['jpg', 'jpeg', 'png', 'gif', 'bpm', 'tiff', 'svg'],\n            name: 'photo',\n        },\n        {\n            type: ['zip', 'rar', 'cab', 'jar', 'tar', 'gzip', 'uue', 'bz2', 'scorm', 'war'],\n            name: 'file-type-zip',\n        },\n        {\n            type: ['mov', 'mp4', 'avi', 'flv'],\n            name: 'video',\n        },\n        {\n            type: ['m4a', 'mp3', 'wav'],\n            name: 'audio',\n        },\n        {\n            type: ['html', 'html'],\n            name: 'file-type-html',\n        },\n        {\n            type: ['css'],\n            name: 'code',\n        },\n        {\n            type: ['txt'],\n            name: 'file-type-txt',\n        },\n        {\n            type: ['doc', 'docx'],\n            name: 'file-type-doc',\n        },\n        {\n            type: ['xls', 'xlsx'],\n            name: 'file-type-xls',\n        },\n        {\n            type: ['pdf'],\n            name: 'file-type-pdf',\n        },\n        {\n            type: ['ppt', 'pptx', 'odp'],\n            name: 'file-type-ppt',\n        },\n    ];\n}\n\n/**\n * Retrieves the icon name for a given file type.\n * @param {string} type The file type or category (e.g., \"pdf\", \"image\", \"folder\").\n * @returns {string} The name of the icon associated with the file type.\n * @example\n * getFileTypeIcon('pdf'); // Returns the icon name for PDF files.\n * getFileTypeIcon('folder'); // Returns 'folder'.\n */\nexport function getFileTypeIcon(type) {\n    let searchType;\n    if (type.toLowerCase() !== 'folder') {\n        fileType().forEach((i) => {\n            if (i.type.includes(type.toLowerCase())) {\n                searchType = i.name;\n            }\n        });\n    } else {\n        searchType = 'folder';\n    }\n\n    return searchType;\n}\n\n/**\n * Checks if a given file matches any of the accepted file types.\n * @param {File} file The file to validate.\n * @param {string|string[]} acceptedFileTypes A comma-separated string or an array of accepted MIME types or file extensions.\n * @returns {boolean} Returns `true` if the file type is valid, otherwise `false`.\n * @throws {Error} Throws an error if `acceptedFileTypes` is empty.\n * @example\n * const file = new File([\"\"], \"example.png\", { type: \"image/png\" });\n * const isValid = isValidFileType(file, \"image/*,application/pdf\");\n * console.log(isValid); // true\n * @example\n * const file = new File([\"\"], \"example.txt\", { type: \"text/plain\" });\n * const isValid = isValidFileType(file, [\"text/plain\", \"application/json\"]);\n * console.log(isValid); // true\n */\nexport function isValidFileType(file, acceptedFileTypes) {\n    const mime = file.type.toLowerCase();                     // full mime\n    const base = mime.split('/')[0];                          // e.g. \"application\"\n    const ext = file.name.split('.').pop().toLowerCase();     // e.g. \"xlsx\"\n\n    let accepted = Array.isArray(acceptedFileTypes)\n      ? acceptedFileTypes\n      : acceptedFileTypes.split(',').map(t => t.trim().toLowerCase());\n\n    if (accepted.length === 0) {\n        throw new Error('acceptedFileTypes is empty');\n    }\n\n    for (let type of accepted) {\n        type = type.toLowerCase();\n\n        // image/* alebo application/*\n        if (type === base + '/*') return true;\n\n        // presný MIME typ\n        if (type === mime) return true;\n\n        // extension (xlsx, png, pdf…)\n        if (type === ext) return true;\n    }\n\n    return false;\n}\n\n/**\n * Uploads a file in chunks using `XMLHttpRequest`, allowing for progress tracking.\n * @param {File} file The file to be uploaded.\n * @param {number} chunkSize The size of each chunk in bytes.\n * @param {HTMLElement} preview The element used to display upload progress.\n */\nexport function uploadFile(file, chunkSize, preview) {\n    let offset = 0;\n    const progressArray = new Array(Math.ceil(file.size / chunkSize)).fill(0);\n\n    const readAndUploadChunk = (start, end) => {\n        const reader = new FileReader();\n        const chunkIndex = start / chunkSize;\n        const chunk = file.slice(start, end);\n\n        reader.onload = (e) => {\n            const xhr = new XMLHttpRequest();\n            xhr.open('POST', '/upload', true);\n            xhr.setRequestHeader('Content-Range', `${start}-${end}/${file.size}`);\n\n            xhr.upload.onprogress = (event) => {\n                if (event.lengthComputable) {\n                    const progress = (event.loaded / event.total) * 100;\n                    progressArray[chunkIndex] = progress;\n                    const totalProgress = progressArray.reduce((a, b) => a + b, 0) / progressArray.length;\n                    // this.updateOverallProgress(progressArray, file.lastModified);\n                    // preview.setAttribute(\"progress\", totalProgress);\n                }\n            };\n\n            xhr.onload = () => {\n                if (xhr.status === 200 || xhr.status === 201) {\n                    progressArray[chunkIndex] = 100; // Táto časť je kompletná\n\n                    // Odoslanie ďalšej časti\n                    start += chunkSize;\n                    if (start < file.size) {\n                        preview.setAttribute('uploaded', start);\n                        readAndUploadChunk(start, Math.min(start + chunkSize, file.size));\n                    } else {\n                        preview.setAttribute('uploaded', start);\n                    }\n                } else {\n                    console.error('Error during upload: ', xhr.statusText);\n                }\n            };\n            xhr.send(e.target.result);\n        };\n        reader.readAsArrayBuffer(chunk);\n    };\n\n    readAndUploadChunk(offset, Math.min(offset + chunkSize, file.size));\n}\n\n/**\n * Returns a function for uploading files either in chunks or as a whole file, based on the provided options.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {number} [chunkSize] The size of each chunk in bytes when uploading in chunks (default is 1MB).\n * @param {boolean} [wholeFile] Whether to upload the file as a whole. If `true`, the entire file is uploaded at once.\n * @returns {Function} A function that takes a file and a preview element as arguments and uploads the file.\n * @example\n * // Upload a file in chunks\n * const uploadInChunks = upload('/upload', 1024 * 512); // 512KB chunks\n * uploadInChunks(file, previewElement);\n * @example\n * // Upload a whole file\n * const uploadWhole = upload('/upload', undefined, true);\n * uploadWhole(file, previewElement);\n */\nexport function upload(url, chunkSize = 1024 * 1024, wholeFile = false) {\n    if (wholeFile) {\n        return (file, preview) => uploadWholeFile(url, file, preview);\n    }\n    return (file, preview) => uploadFileInChunks(url, file, preview, chunkSize);\n}\n\n/**\n * Uploads a file in chunks to a specified URL, allowing for progress tracking and resuming in case of errors.\n * @param {string} url The URL to which the file chunks will be uploaded.\n * @param {File} file The file to be uploaded in chunks.\n * @param {HTMLElement} preview The element used to display upload progress.\n * @param {number} [chunkSize] The size of each chunk in bytes (default is 1MB).\n * @returns {Promise<object>} Resolves with the response of the last chunk uploaded, parsed as JSON.\n * @throws {Error} - Throws an error if a chunk fails to upload.\n */\nexport async function uploadFileInChunks(url, file, preview, chunkSize = 1024 * 1024) {\n    let offset = 0;\n    const totalChunks = Math.ceil(file.size / chunkSize);\n    const partResponses = [];\n\n    while (offset < file.size) {\n        const chunk = file.slice(offset, offset + chunkSize);\n\n        // Creating a custom ReadableStream to track progress of the current chunk\n        const stream = new ReadableStream({\n            start(controller) {\n                const reader = chunk.stream().getReader();\n                let uploadedBytes = 0;\n\n                reader.read().then(function process({ done, value }) {\n                    if (done) {\n                        controller.close();\n                        return Promise.resolve();\n                    }\n\n                    // Track progress\n                    uploadedBytes += value.byteLength;\n                    const percentComplete = ((offset + uploadedBytes) / file.size) * 100;\n                    preview.setAttribute('uploaded', offset + uploadedBytes);\n\n                    // Enqueue chunk data into the stream\n                    controller.enqueue(value);\n\n                    // Read the next chunk\n                    return reader.read().then(process);\n                });\n            },\n        });\n\n        const formData = new FormData();\n        formData.append('file', new Blob([stream])); // Send the current stream (chunk)\n        formData.append('chunkIndex', Math.floor(offset / chunkSize)); // Send chunk index\n        formData.append('totalChunks', totalChunks); // Send total chunks\n        formData.append('fileName', file.name); // Send file name\n\n        try {\n            // Send the current chunk via Fetch\n            const response = await fetch(url, {\n                method: 'POST',\n                body: formData,\n            });\n\n            if (!response.ok) {\n                throw new Error(`Failed to upload chunk ${Math.floor(offset / chunkSize) + 1}: ${response.statusText}`);\n            }\n\n            partResponses.push(response);\n        } catch (error) {\n            console.error('Error uploading chunk:', error);\n            break;\n        }\n\n        // Move to the next chunk\n        offset += chunkSize;\n    }\n\n    const response = await partResponses.at(-1).json();\n\n    return {\n        data: response,\n        file,\n    };\n}\n\n/**\n * Uploads a file to a specified URL using a `POST` request and updates the preview element with the uploaded file size.\n * @param {string} url The URL to which the file will be uploaded.\n * @param {File} file The file to be uploaded.\n * @param {HTMLElement} preview The element that displays the upload preview. It will be updated with the file size.\n * @returns {Promise<{data: object, file: File}>} - A promise that resolves with the server response and the uploaded file.\n * @throws {Error} - Logs an error to the console if the request fails.\n */\nexport function uploadWholeFile(url, file, preview) {\n    const formData = new FormData();\n    formData.append('file', file);\n\n    //use fetch\n    return fetch(url, {\n        method: 'POST',\n        body: formData,\n    })\n        .then((response) => response.json())\n        .then((data) => {\n            preview.setAttribute('uploaded', file.size);\n            return {\n                data,\n                file,\n            };\n        })\n        .catch((error) => {\n            console.error('Error:', error);\n        });\n}\n","import { Localizer } from '../utils/localize.js';\nimport Button from '../wje-button/button.js';\nimport { default as WJElement } from '../wje-element/element.js';\nimport { getFileTypeIcon, isValidFileType, upload } from './service/service.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary FileUpload is a custom web component for uploading files.\n * It extends from WJElement and provides functionalities for file upload.\n * @documentation https://elements.webjet.sk/components/file-upload\n * @status stable\n * @augments WJElement\n * @slot - This is a default/unnamed slot.\n * @csspart native - The native file upload part.\n * @csspart file-list - The file list part.\n * @csspart upload-button - The label part.\n * @event change - Fires when the file input changes.\n * @event drop - Fires when a file is dropped into the component.\n * @attribute {string} accepted-types - The accepted file types for upload.\n * @attribute {number} chunk-size - The chunk size for file upload.\n * @attribute {number} max-file-size - The maximum file size for upload.\n * @attribute {string} upload-url - The URL to set as the upload URL.\n * @attribute {boolean} auto-process-files - The auto process files attribute.\n * @attribute {boolean} no-upload-button - The no upload button attribute.\n * @tag wje-file-upload\n */\nexport default class FileUpload extends WJElement {\n    /**\n     * Constructor for FileUpload.\n     * Initializes a new instance of the Localizer.\n     */\n    constructor() {\n        super();\n        this.localizer = new Localizer(this);\n        this._uploadedFiles = [];\n        this._queuedFiles = [];\n    }\n\n    /**\n     * Dependencies for the FileUpload component.\n     * @type {object}\n     */\n    dependencies = {\n        'wje-button': Button,\n    };\n\n    /**\n     * Setter for acceptedTypes attribute.\n     * @param {string} value The accepted file types for upload.\n     */\n    set acceptedTypes(value) {\n        this.setAttribute('accepted-types', value);\n    }\n\n    /**\n     * Getter for acceptedTypes attribute.\n     * @returns {string} The accepted file types for upload.\n     */\n    get acceptedTypes() {\n        const accepted = this.getAttribute('accepted-types');\n        return this.hasAttribute('accepted-types') ? accepted : '';\n    }\n\n    /**\n     * Setter for chunkSize attribute.\n     * @param {number} value The chunk size for file upload.\n     */\n    set chunkSize(value) {\n        this.setAttribute('chunk-size', value);\n    }\n\n    /**\n     * Getter for chunkSize attribute.\n     * @returns {number} The chunk size for file upload.\n     */\n    get chunkSize() {\n        const chunk = this.getAttribute('chunk-size');\n        return this.hasAttribute('chunk-size') ? chunk : 1024 * 1024;\n    }\n\n    /**\n     * Setter for maxFileSize attribute.\n     * @param {number} value The maximum file size for upload.\n     */\n    set maxFileSize(value) {\n        this.setAttribute('max-file-size', value);\n    }\n\n    /**\n     * Getter for maxFileSize attribute.\n     * @returns {number} The maximum file size for upload.\n     */\n    get maxFileSize() {\n        const fileSize = this.getAttribute('max-file-size');\n        return this.hasAttribute('max-file-size') ? fileSize * 1024 * 1024 : 1024 * 1024;\n    }\n\n    /**\n     * Setter for label attribute.\n     * @param {string} value The URL to set as the upload URL.\n     */\n    set uploadUrl(value) {\n        this.setAttribute('upload-url', value);\n    }\n\n    /**\n     * Gets the upload URL for the file upload element.\n     * @returns {string} The upload URL for the file upload element.\n     */\n    get uploadUrl() {\n        return this.getAttribute('upload-url') ?? '/upload';\n    }\n\n    /**\n     * Sets the autoProcessFiles attribute.\n     * @param value\n     */\n    set autoProcessFiles(value) {\n        this.setAttribute('auto-process-files', value);\n    }\n\n    /**\n     * Gets the autoProcessFiles attribute.\n     * @returns {any|boolean}\n     */\n    get autoProcessFiles() {\n        return JSON.parse(this.getAttribute('auto-process-files')) ?? true;\n    }\n\n    /**\n     * Sets the noUploadButton attribute.\n     * @param value\n     */\n    set noUploadButton(value) {\n        this.setAttribute('no-upload-button', value);\n    }\n\n    /**\n     * Gets the noUploadButton attribute.\n     * @returns {boolean}\n     */\n    get noUploadButton() {\n        return this.hasAttribute('no-upload-button');\n    }\n\n    /**\n     * Sets the uploaded files.\n     * @param value\n     */\n    set uploadedFiles(value) {\n        this._uploadedFiles = value;\n    }\n\n    /**\n     * Return the uploaded files.\n     * @returns {[]}\n     */\n    get uploadedFiles() {\n        return this._uploadedFiles;\n    }\n\n    /**\n     * Sets the to-chunk attribute.\n     * @param value\n     */\n    set toChunk(value) {\n        this.setAttribute('to-chunk', value);\n    }\n\n    /**\n     * Gets the to-chunk attribute.\n     * @returns {boolean}\n     */\n    get toChunk() {\n        return this.hasAttribute('to-chunk');\n    }\n\n    /**\n     * Sets the maximum number of files that can be uploaded or managed.\n     * Assigns the specified value to the 'max-files' attribute.\n     * @param {number} value The maximum allowable number of files.\n     */\n    set maxFiles(value) {\n        this.setAttribute('max-files', value);\n    }\n\n    /**\n     * Retrieves the maximum number of files allowed from the `max-files` attribute.\n     * If the attribute is not set or is invalid, defaults to 0.\n     * @returns {number} The maximum number of files allowed.\n     */\n    get maxFiles() {\n        return parseInt(this.getAttribute('max-files')) || 1;\n    }\n\n    className = 'FileUpload';\n\n    /**\n     * Getter for cssStyleSheet.\n     * @returns {string} The CSS styles for the component.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for observedAttributes.\n     * @returns {Array} An empty array as no attributes are observed.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Method to setup attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    beforeDraw() {\n        this.uploadFunction = upload(this.uploadUrl, this.chunkSize, !this.toChunk);\n    }\n\n    /**\n     * Method to draw the component on the screen.\n     * @returns {DocumentFragment} The fragment containing the component.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-file-upload');\n        native.setAttribute('part', 'native');\n\n        let label = document.createElement('div');\n        label.setAttribute('part', 'file-label');\n        label.classList.add('file-label');\n\n        let fileList = document.createElement('slot');\n        fileList.setAttribute('name', 'item');\n        fileList.setAttribute('part', 'items');\n        fileList.classList.add('file-list');\n\n        let slot = document.createElement('slot');\n        label.appendChild(slot);\n\n        let fileInput = document.createElement('input');\n        fileInput.setAttribute('type', 'file');\n        fileInput.setAttribute('multiple', '');\n        fileInput.setAttribute('style', 'display:none;');\n\n        if (!this.noUploadButton) {\n            let button = document.createElement('wje-button');\n            button.innerText = this.label || this.localizer.translate('wj.file.upload.button');\n            button.setAttribute('part', 'upload-button');\n\n            label.appendChild(button);\n\n            this.button = button;\n        }\n\n        native.appendChild(fileInput);\n        native.appendChild(label);\n        native.appendChild(fileList);\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.fileList = fileList;\n        this.fileInput = fileInput;\n\n        return fragment;\n    }\n\n    /**\n     * Method to perform actions after the component is drawn.\n     */\n    afterDraw() {\n        this.button?.addEventListener('click', () => {\n            this.fileInput.click();\n        });\n\n        this.fileInput.addEventListener('change', this.handleInputChange);\n        this.native.addEventListener('drop', this.handleDrop);\n\n        let dragEventCounter = 0;\n\n        this.native.addEventListener('dragenter', (event) => {\n            event.preventDefault();\n\n            if (dragEventCounter === 0) {\n                this.native.classList.add('highlight');\n            }\n\n            dragEventCounter += 1;\n        });\n\n        this.native.addEventListener('dragover', (event) => {\n            event.preventDefault();\n\n            if (dragEventCounter === 0) {\n                dragEventCounter = 1;\n            }\n        });\n\n        this.native.addEventListener('dragleave', (event) => {\n            event.preventDefault();\n\n            dragEventCounter -= 1;\n\n            if (dragEventCounter <= 0) {\n                dragEventCounter = 0;\n                this.native.classList.remove('highlight');\n            }\n        });\n\n        this.native.addEventListener('drop', (event) => {\n            event.preventDefault();\n\n            dragEventCounter = 0;\n            this.native.classList.remove('highlight');\n        });\n    }\n\n    /**\n     * Method to handle form submission.\n     * @param {Event} event The form submission event.\n     */\n    handleSubmit(event) {\n        event.preventDefault();\n\n        // TODO: TU TREBA PRIDAT ZOBRAZENIE SUBORU A JEHO PROCESSU\n\n        this.addFilesToQueue(this.fileInput.files);\n    }\n\n    /**\n     * Method to handle file drop event.\n     * @param {Event} event The file drop event object.\n     */\n    handleDrop = (event) => {\n        const fileList = event.dataTransfer.files;\n\n        this.resetFormState();\n\n        this.addFilesToQueue(fileList);\n    };\n\n    /**\n     * Method to handle file input change event.\n     * @param {Event} event The file input change event object.\n     */\n    handleInputChange = (event) => {\n        this.resetFormState();\n\n        try {\n            this.handleSubmit(event);\n        } catch (err) {}\n    };\n\n    /**\n     * Method to add files to the queue.\n     * @param files\n     */\n    addFilesToQueue(files) {\n        if (this.maxFiles && files.length > this.maxFiles) {\n            this.dispatchEvent(\n              new CustomEvent('file-upload:error', {\n                  detail: {\n                      type: 'max-files-exceeded',\n                      max: this.maxFiles,\n                      received: files.length,\n                  },\n                  bubbles: true,\n                  composed: true,\n              })\n            );\n            return; // stop processing\n        }\n\n        this._queuedFiles = [...files];\n\n        this.dispatchEvent(\n            new CustomEvent('file-upload:files-added', { detail: files, bubbles: true, composed: true })\n        );\n        this.onAddedFiles?.();\n\n        if (this.autoProcessFiles) {\n            this.uploadFiles();\n        }\n\n        this.fileInput.value = '';\n    }\n\n    /**\n     * Method to upload files.\n     */\n    uploadFiles() {\n        if (this._queuedFiles.length === 0) {\n            return;\n        }\n\n        const uploadPromises = this._queuedFiles.map((file) => this.createUploadPromise(file));\n        uploadPromises\n            .reduce((prev, curr) => {\n                return prev.then(() => {\n                    return curr;\n                });\n            }, Promise.resolve())\n            .then(() => {\n                this.dispatchEvent(\n                    new CustomEvent('file-upload:all-files-uploaded', {\n                        detail: this.uploadedFiles,\n                        bubbles: true,\n                        composed: true,\n                    })\n                );\n                this.onAllFilesUploaded?.();\n                this._queuedFiles = [];\n            });\n    }\n\n    /**\n     * Method to create an upload promise.\n     * @param file\n     * @returns {Promise<unknown>}\n     */\n    createUploadPromise = (file) => {\n        return new Promise((resolve, reject) => {\n            this.assertFilesValid(file);\n            let preview;\n\n            let reader = new FileReader();\n            reader.onload = (e) => {\n                this.dispatchEvent(\n                    new CustomEvent('file-upload:upload-started', { detail: file, bubbles: true, composed: true })\n                );\n                this.onUploadStarted?.(file);\n\n                preview = this.createPreview(file, reader);\n                this.appendChild(preview);\n\n                this.uploadFunction(file, preview).then((res) => {\n                    res.item = preview;\n\n                    this.dispatchEvent(\n                        new CustomEvent('file-upload:upladed-file-complete', {\n                            detail: res,\n                            bubbles: true,\n                            composed: true,\n                        })\n                    );\n                    this.onUploadedFileComplete?.(res);\n                    this.uploadedFiles.push(res.data);\n\n                    resolve(res);\n                });\n            };\n\n            reader.readAsDataURL(file);\n        });\n    };\n\n    /**\n     * Method to create a preview for the file.\n     * @param {File} file The file for which the preview is to be created.\n     * @param {FileReader} reader The FileReader instance to read the file.\n     * @returns {HTMLElement} The created preview.\n     */\n    createPreview(file, reader) {\n        let preview = document.createElement('wje-file-upload-item');\n        preview.setAttribute('slot', 'item');\n        preview.setAttribute('name', file.name);\n        preview.setAttribute('size', file.size);\n        preview.setAttribute('uploaded', '0');\n        preview.setAttribute('progress', '0');\n        preview.innerHTML = `<wje-icon slot=\"img\" name=\"${getFileTypeIcon(file.type.split('/')[1])}\" size=\"large\"></wje-icon>`;\n\n        return preview;\n    }\n\n    /**\n     * Method to create a thumbnail for the file.\n     * @param {File} file The file for which the thumbnail is to be created.\n     * @param {FileReader} reader The FileReader instance to read the file.\n     * @returns {HTMLElement} The created thumbnail.\n     */\n    createThumbnail(file, reader) {\n        let img = document.createElement('img');\n        img.setAttribute('src', reader.result);\n\n        return img;\n    }\n\n    /**\n     * Method to validate the files.\n     * @param {File} file The file to be validated.\n     * TODO: alowed types a size limit by malo byt cez attributy\n     */\n    assertFilesValid(file) {\n        const { name: fileName, size: fileSize } = file;\n        if (!isValidFileType(file, this.acceptedTypes)) {\n            throw new Error(`❌ FILE: \"${fileName}\" Valid file types are: \"${this.acceptedTypes}\"`);\n        }\n\n        if (fileSize > this.maxFileSize) {\n            throw new Error(\n                `❌ File \"${fileName}\" could not be uploaded. Only images up to ${this.maxFileSize} MB are allowed. Nie je to ${fileSize}`\n            );\n        }\n    }\n\n    /**\n     * Method to reset the form state.\n     */\n    resetFormState() {\n        this.fileList.textContent = '';\n    }\n}\n","import FileUpload from './file-upload.element.js';\n\nexport default FileUpload;\n\nFileUpload.define('wje-file-upload', FileUpload);\n"],"names":["response","_a"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wj-elements",
   "description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
-  "version": "0.2.0-alpha.3",
+  "version": "0.2.0-alpha.5",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",
@@ -51,6 +51,7 @@
     "test:button": "web-test-runner --files packages/wje-button/button.test.js",
     "test:chip": "web-test-runner --files packages/wje-chip/chip.test.js",
     "test:color-picker": "web-test-runner --files packages/wje-color-picker/color-picker.test.js",
+    "test:file-upload": "web-test-runner --files packages/wje-file-upload/file-upload.test.js",
     "test:format-digital": "web-test-runner --files packages/wje-format-digital/format-digital.test.js",
     "test:relative-time": "web-test-runner --files packages/wje-relative-time/relative-time.test.js",
     "test:select": "web-test-runner --files packages/wje-select/select.test.js",