wj-elements 0.4.2 → 0.4.4

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 and MIME subtypes 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: [\n                'doc',\n                'docx',\n                'msword',\n                'vnd.openxmlformats-officedocument.wordprocessingml.document',\n                'vnd.ms-word.document.macroenabled.12',\n                'vnd.openxmlformats-officedocument.wordprocessingml.template',\n                'vnd.ms-word.template.macroenabled.12',\n                'vnd.oasis.opendocument.text',\n            ],\n            name: 'file-type-doc',\n        },\n        {\n            type: [\n                'xls',\n                'xlsx',\n                'vnd.ms-excel',\n                'vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n                'vnd.ms-excel.sheet.macroenabled.12',\n                'vnd.openxmlformats-officedocument.spreadsheetml.template',\n                'vnd.ms-excel.template.macroenabled.12',\n                'vnd.ms-excel.addin.macroenabled.12',\n                'vnd.ms-excel.sheet.binary.macroenabled.12',\n                'vnd.oasis.opendocument.spreadsheet',\n            ],\n            name: 'file-type-xls',\n        },\n        {\n            type: ['pdf'],\n            name: 'file-type-pdf',\n        },\n        {\n            type: [\n                'ppt',\n                'pptx',\n                'odp',\n                'vnd.ms-powerpoint',\n                'vnd.openxmlformats-officedocument.presentationml.presentation',\n                'vnd.ms-powerpoint.presentation.macroenabled.12',\n                'vnd.openxmlformats-officedocument.presentationml.slideshow',\n                'vnd.ms-powerpoint.slideshow.macroenabled.12',\n                'vnd.openxmlformats-officedocument.presentationml.template',\n                'vnd.ms-powerpoint.template.macroenabled.12',\n                'vnd.oasis.opendocument.presentation',\n            ],\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 extension, MIME subtype or category (e.g., \"pdf\", \"vnd.ms-excel\", \"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) {\n        return searchType;\n    }\n\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 * 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 { default as WJElement, event } from '../wje-element/element.js';\nimport Button from '../wje-button/button.js';\nimport { isValidFileType } from '../utils/utils.js';\nimport { getFileTypeIcon, upload } from './service/service.js';\n\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 : 'image/*';\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     * Sets the label attribute for the upload button.\n     * @param {string} value\n     */\n    set label(value) {\n        this.setAttribute('label', value);\n    }\n\n    /**\n     * Gets the label attribute for the upload button.\n     * @returns {string}\n     */\n    get label() {\n        return this.getAttribute('label') || '';\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')) || 10;\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 ['label'];\n    }\n\n    attributeChangedCallback(name, oldValue, newValue) {\n        super.attributeChangedCallback?.(name, oldValue, newValue);\n        if (name === 'label' && this.button) {\n            const nextLabel = this.label || this.localizer.translate('wj.file.upload.button');\n            this.button.innerText = nextLabel;\n            this.button.setAttribute('aria-label', nextLabel);\n        }\n    }\n\n    /**\n     * Method to setup attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.setAriaState({\n            role: 'group',\n        });\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        fileInput.setAttribute('aria-hidden', 'true');\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            button.setAttribute('aria-label', button.innerText);\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', (e) => {handleInputChange\n            e.preventDefault();\n\n            if (dragEventCounter === 0) {\n                this.native.classList.add('highlight');\n            }\n\n            dragEventCounter += 1;\n        });\n\n        this.native.addEventListener('dragover', (e) => {\n            e.preventDefault();\n\n            if (dragEventCounter === 0) {\n                dragEventCounter = 1;\n            }\n        });\n\n        this.native.addEventListener('dragleave', (e) => {\n            e.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', (e) => {\n            event.preventDefault();\n\n            dragEventCounter = 0;\n            this.native.classList.remove('highlight');\n        });\n\n        this.addEventListener('wje-file-upload-item:remove', (e) => {\n            const file = e.detail;\n\n            if (!(file instanceof File)) {\n                return;\n            }\n\n            let count = this.uploadedFiles.length;\n\n            this.uploadedFiles = this.uploadedFiles.filter((entry) => {\n                return entry?.file?.lastModified !== file.lastModified;\n            });\n\n            if(count !== this.uploadedFiles.length)\n                event.dispatchCustomEvent(this, 'wje-file-upload:file-removed', file);\n        });\n    }\n\n    /**\n     * Method to handle form submission.\n     * @param {Event} e The form submission event.\n     */\n    handleSubmit(e) {\n        e.preventDefault();\n\n        this.addFilesToQueue(this.fileInput.files);\n    }\n\n    /**\n     * Method to handle file drop event.\n     * @param {Event} e The file drop event object.\n     */\n    handleDrop = (e) => {\n        const fileList = e.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} e The file input change event object.\n     */\n    handleInputChange = (e) => {\n        const files = Array.from(e.target.files);\n\n        event.dispatchCustomEvent(this, 'wje-file-upload:files-selected', files);\n\n        this.resetFormState();\n\n        try {\n            this.handleSubmit(e);\n        } catch (err) {\n            console.error(err);\n        }\n    };\n\n    /**\n     * Method to add files to the queue.\n     * @param files\n     */\n    addFilesToQueue(files) {\n        const currentCount = (Array.isArray(this.uploadedFiles) ? this.uploadedFiles.length : 0) + (Array.isArray(this._queuedFiles) ? this._queuedFiles.length : 0);\n        const newTotal = currentCount + files.length;\n\n        if (this.maxFiles && newTotal > this.maxFiles) {\n            const detail = {\n                code: 'MAX-FILES-EXCEEDED',\n                files,\n                maxFiles: this.maxFiles,\n                currentCount,\n                attemptedToAdd: files.length,\n                allowedRemaining: Math.max(this.maxFiles - currentCount, 0),\n            };\n\n            event.dispatchCustomEvent(this, 'wje-file-upload:error', detail);\n\n            return;\n        }\n\n        this._queuedFiles = [...(this._queuedFiles || []), ...files];\n\n        event.dispatchCustomEvent(this, 'wje-file-upload:files-added', files);\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                event.dispatchCustomEvent(this, 'wje-file-upload:files-uploaded', this.uploadedFiles);\n\n                this.onAllFilesUploaded?.();\n                this._queuedFiles = [];\n            }).catch((err) => {\n                this._queuedFiles = this._queuedFiles.filter((file) => file !== err.file);\n\n                event.dispatchCustomEvent(this,'wje-file-upload:error', err);\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 = () => {\n                event.dispatchCustomEvent(this, 'wje-file-upload:started', file);\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                    event.dispatchCustomEvent(this, 'wje-file-upload:file-uploaded', res);\n\n                    this.onUploadedFileComplete?.(res);\n\n                    this.uploadedFiles.push(res);\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        let fileType = file.type ? file.type.split('/')[1] : file.name.split('.').pop();\n        let icon = getFileTypeIcon(fileType) || 'file';\n\n        preview.setAttribute('slot', 'item');\n        preview.setAttribute('name', file.name);\n        preview.setAttribute('size', file.size);\n        preview.setAttribute('uploaded', '0');\n        preview.innerHTML = `<wje-icon slot=\"img\" name=\"${icon}\" size=\"large\"></wje-icon>`;\n        preview.data = file;\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\n        if (!isValidFileType(file, this.acceptedTypes)) {\n            const err = new Error('');\n            err.code = 'INVALID-FILE-TYPE';\n            err.file = file;\n            err.acceptedTypes = this.acceptedTypes;\n\n            throw err;\n        }\n\n        if (fileSize > this.maxFileSize) {\n            const err = new Error('');\n            err.code = 'FILE-TOO-LARGE';\n            err.file = file;\n            err.maxFileSize = this.maxFileSize;\n\n            throw err;\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","fileType"],"mappings":"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"}
+{"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 and MIME subtypes 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: [\n                'doc',\n                'docx',\n                'msword',\n                'vnd.openxmlformats-officedocument.wordprocessingml.document',\n                'vnd.ms-word.document.macroenabled.12',\n                'vnd.openxmlformats-officedocument.wordprocessingml.template',\n                'vnd.ms-word.template.macroenabled.12',\n                'vnd.oasis.opendocument.text',\n            ],\n            name: 'file-type-doc',\n        },\n        {\n            type: [\n                'xls',\n                'xlsx',\n                'vnd.ms-excel',\n                'vnd.openxmlformats-officedocument.spreadsheetml.sheet',\n                'vnd.ms-excel.sheet.macroenabled.12',\n                'vnd.openxmlformats-officedocument.spreadsheetml.template',\n                'vnd.ms-excel.template.macroenabled.12',\n                'vnd.ms-excel.addin.macroenabled.12',\n                'vnd.ms-excel.sheet.binary.macroenabled.12',\n                'vnd.oasis.opendocument.spreadsheet',\n            ],\n            name: 'file-type-xls',\n        },\n        {\n            type: ['pdf'],\n            name: 'file-type-pdf',\n        },\n        {\n            type: [\n                'ppt',\n                'pptx',\n                'odp',\n                'vnd.ms-powerpoint',\n                'vnd.openxmlformats-officedocument.presentationml.presentation',\n                'vnd.ms-powerpoint.presentation.macroenabled.12',\n                'vnd.openxmlformats-officedocument.presentationml.slideshow',\n                'vnd.ms-powerpoint.slideshow.macroenabled.12',\n                'vnd.openxmlformats-officedocument.presentationml.template',\n                'vnd.ms-powerpoint.template.macroenabled.12',\n                'vnd.oasis.opendocument.presentation',\n            ],\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 extension, MIME subtype or category (e.g., \"pdf\", \"vnd.ms-excel\", \"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) {\n        return searchType;\n    }\n\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 * 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 { default as WJElement, event } from '../wje-element/element.js';\nimport Button from '../wje-button/button.js';\nimport { isValidFileType } from '../utils/utils.js';\nimport { getFileTypeIcon, upload } from './service/service.js';\n\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 : 'image/*';\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     * Sets the label attribute for the upload button.\n     * @param {string} value\n     */\n    set label(value) {\n        this.setAttribute('label', value);\n    }\n\n    /**\n     * Gets the label attribute for the upload button.\n     * @returns {string}\n     */\n    get label() {\n        return this.getAttribute('label') || '';\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')) || 10;\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 ['label'];\n    }\n\n    attributeChangedCallback(name, oldValue, newValue) {\n        super.attributeChangedCallback?.(name, oldValue, newValue);\n        if (name === 'label' && this.button) {\n            const nextLabel = this.label || this.localizer.translate('wj.file.upload.button');\n            this.button.innerText = nextLabel;\n            this.button.setAttribute('aria-label', nextLabel);\n        }\n    }\n\n    /**\n     * Method to setup attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        this.setAriaState({\n            role: 'group',\n        });\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        fileInput.setAttribute('aria-hidden', 'true');\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            button.setAttribute('aria-label', button.innerText);\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', (e) => {\n            e.preventDefault();\n\n            if (dragEventCounter === 0) {\n                this.native.classList.add('highlight');\n            }\n\n            dragEventCounter += 1;\n        });\n\n        this.native.addEventListener('dragover', (e) => {\n            e.preventDefault();\n\n            if (dragEventCounter === 0) {\n                dragEventCounter = 1;\n            }\n        });\n\n        this.native.addEventListener('dragleave', (e) => {\n            e.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', (e) => {\n            event.preventDefault();\n\n            dragEventCounter = 0;\n            this.native.classList.remove('highlight');\n        });\n\n        this.addEventListener('wje-file-upload-item:remove', (e) => {\n            const file = e.detail;\n\n            if (!(file instanceof File)) {\n                return;\n            }\n\n            let count = this.uploadedFiles.length;\n\n            this.uploadedFiles = this.uploadedFiles.filter((entry) => {\n                return entry?.file?.lastModified !== file.lastModified;\n            });\n\n            if(count !== this.uploadedFiles.length)\n                event.dispatchCustomEvent(this, 'wje-file-upload:file-removed', file);\n        });\n    }\n\n    /**\n     * Method to handle form submission.\n     * @param {Event} e The form submission event.\n     */\n    handleSubmit(e) {\n        e.preventDefault();\n\n        this.addFilesToQueue(this.fileInput.files);\n    }\n\n    /**\n     * Method to handle file drop event.\n     * @param {Event} e The file drop event object.\n     */\n    handleDrop = (e) => {\n        const fileList = e.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} e The file input change event object.\n     */\n    handleInputChange = (e) => {\n        const files = Array.from(e.target.files);\n\n        event.dispatchCustomEvent(this, 'wje-file-upload:files-selected', files);\n\n        this.resetFormState();\n\n        try {\n            this.handleSubmit(e);\n        } catch (err) {\n            console.error(err);\n        }\n    };\n\n    /**\n     * Method to add files to the queue.\n     * @param files\n     */\n    addFilesToQueue(files) {\n        const currentCount = (Array.isArray(this.uploadedFiles) ? this.uploadedFiles.length : 0) + (Array.isArray(this._queuedFiles) ? this._queuedFiles.length : 0);\n        const newTotal = currentCount + files.length;\n\n        if (this.maxFiles && newTotal > this.maxFiles) {\n            const detail = {\n                code: 'MAX-FILES-EXCEEDED',\n                files,\n                maxFiles: this.maxFiles,\n                currentCount,\n                attemptedToAdd: files.length,\n                allowedRemaining: Math.max(this.maxFiles - currentCount, 0),\n            };\n\n            event.dispatchCustomEvent(this, 'wje-file-upload:error', detail);\n\n            return;\n        }\n\n        this._queuedFiles = [...(this._queuedFiles || []), ...files];\n\n        event.dispatchCustomEvent(this, 'wje-file-upload:files-added', files);\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                event.dispatchCustomEvent(this, 'wje-file-upload:files-uploaded', this.uploadedFiles);\n\n                this.onAllFilesUploaded?.();\n                this._queuedFiles = [];\n            }).catch((err) => {\n                this._queuedFiles = this._queuedFiles.filter((file) => file !== err.file);\n\n                event.dispatchCustomEvent(this,'wje-file-upload:error', err);\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 = () => {\n                event.dispatchCustomEvent(this, 'wje-file-upload:started', file);\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                    event.dispatchCustomEvent(this, 'wje-file-upload:file-uploaded', res);\n\n                    this.onUploadedFileComplete?.(res);\n\n                    this.uploadedFiles.push(res);\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        let fileType = file.type ? file.type.split('/')[1] : file.name.split('.').pop();\n        let icon = getFileTypeIcon(fileType) || 'file';\n\n        preview.setAttribute('slot', 'item');\n        preview.setAttribute('name', file.name);\n        preview.setAttribute('size', file.size);\n        preview.setAttribute('uploaded', '0');\n        preview.innerHTML = `<wje-icon slot=\"img\" name=\"${icon}\" size=\"large\"></wje-icon>`;\n        preview.data = file;\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\n        if (!isValidFileType(file, this.acceptedTypes)) {\n            const err = new Error('');\n            err.code = 'INVALID-FILE-TYPE';\n            err.file = file;\n            err.acceptedTypes = this.acceptedTypes;\n\n            throw err;\n        }\n\n        if (fileSize > this.maxFileSize) {\n            const err = new Error('');\n            err.code = 'FILE-TOO-LARGE';\n            err.file = file;\n            err.maxFileSize = this.maxFileSize;\n\n            throw err;\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","fileType"],"mappings":"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"}

package/dist/wje-input.js

@@ -1,15 +1,23 @@
 var __defProp = Object.defineProperty;
+var __typeError = (msg) => {
+  throw TypeError(msg);
+};
 var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
+var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
+var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
+var _Input_instances, syncNativeAttribute_fn;
 import { F as FormAssociatedElement } from "./form-associated-element-DEQ4y-jn.js";
 import { event } from "./event.js";
-const styles = "/*\n[ WJ Input ]\n*/\n\n:host {\n    width: 100%;\n    margin-bottom: var(--wje-input-margin-bottom);\n    display: block;\n    label {\n        margin: var(--wje-input-label-margin);\n        padding: var(--wje-input-label-padding);\n        display: var(--wje-input-label-display);\n        opacity: 1;\n        cursor: text;\n        transition: opacity 0.2s ease;\n        line-height: var(--wje-input-label-line-height);\n        font-size: var(--wje-input-label-font-size);\n    }\n    .wrapper {\n        display: grid;\n        grid-template-columns: auto 1fr auto;\n        width: 100%;\n        > .input-wrapper {\n            grid-column: 2;\n        }\n    }\n    .native-input {\n        .input-wrapper {\n            display: block;\n            width: 100%;\n            position: relative;\n            box-sizing: border-box;\n\n            label {\n                width: 100%;\n            }\n        }\n        &.default {\n            background-color: var(--wje-input-background-color);\n            font-family: var(--wje-input-font-family);\n            position: relative;\n            border-radius: var(--wje-input-border-radius);\n            border-width: var(--wje-input-border-width);\n            border-style: var(--wje-input-border-style);\n            border-color: var(--wje-input-border-color);\n            padding-inline: 0;\n            padding-top: 0.25rem;\n            padding-bottom: 0.25rem;\n            transition: background-color 0.2s ease;\n            cursor: text;\n            .input-wrapper {\n                padding-inline: 0.5rem;\n            }\n            &.focused {\n                border-color: var(--wje-input-border-color-focus) !important;\n                label {\n                    opacity: 0.67;\n                    font-size: 12px;\n                    letter-spacing: normal;\n                }\n            }\n            input {\n                border: none;\n                height: 25px;\n                min-height: 25px;\n                padding: 0;\n                margin-top: -4px;\n                background: none;\n                box-shadow: none;\n                width: 100%;\n            }\n            label {\n                &.fade {\n                    opacity: 0.5;\n                    font-size: 12px;\n                    letter-spacing: normal;\n                }\n            }\n            ::slotted([slot='start']) {\n                border-left: none;\n                border-top: none;\n                border-bottom: none;\n            }\n\n            ::slotted([slot='end']) {\n                border-right: none;\n                border-top: none;\n                border-bottom: none;\n            }\n        }\n        &.standard {\n            font-family: var(--wje-input-font-family);\n            position: relative;\n            border-radius: var(--wje-input-border-radius);\n            padding-inline: 0;\n            padding-top: 0;\n            padding-bottom: 0;\n            transition: background-color 0.2s ease;\n            cursor: text;\n            &.focused {\n                input {\n                    border-color: var(--wje-input-border-color-focus) !important;\n                }\n            }\n            input {\n                background-color: var(--wje-input-background-color);\n                display: block;\n                min-height: 32px;\n                padding-inline: 0.5rem;\n                padding-top: 0;\n                padding-bottom: 0;\n                /*background: none;*/\n                box-shadow: none;\n                width: 100%;\n                box-sizing: border-box;\n                border-radius: var(--wje-input-border-radius);\n                border-width: var(--wje-input-border-width);\n                border-style: var(--wje-input-border-style);\n                border-color: var(--wje-input-border-color);\n            }\n            .input-wrapper {\n                flex-wrap: nowrap;\n                &:hover .clear {\n                    visibility: visible;\n                }\n            }\n            ::slotted([slot='start']) {\n                border-right: none;\n                border-radius: var(--wje-input-border-radius) 0 0 var(--wje-input-border-radius);\n            }\n\n            ::slotted([slot='end']) {\n                border-left: none;\n                border-radius: 0 var(--wje-input-border-radius) var(--wje-input-border-radius) 0;\n            }\n\n            &.has-start input {\n                border-top-left-radius: 0;\n                border-bottom-left-radius: 0;\n            }\n\n            &.has-end input {\n                border-top-right-radius: 0;\n                border-bottom-right-radius: 0;\n            }\n            slot[name='error'] {\n                position: static;\n\n                background: transparent;\n                padding: 0.25rem 0;\n                left: auto;\n                transform: none;\n                color: var(--wje-input-color-invalid);\n                font-size: 12px;\n                line-height: normal;\n            }\n        }\n    }\n}\n\n:host([type=hidden]) {\n    margin: 0;\n    .native-input {\n        padding: 0;\n        border-width: 0;\n    }\n}\n\n.clear {\n    visibility: hidden;\n    position: absolute;\n    right: 0;\n    top: 3px;\n    --wje-padding-top: 0.25rem;\n    --wje-padding-start: 0.25rem;\n    --wje-padding-end: 0.25rem;\n    --wje-padding-bottom: 0.25rem;\n    --wje-button-margin-inline: 0 0.25rem;\n}\n\n:host([required]) .wrapper::after {\n    color: var(--wje-input-color-invalid);\n    content: var(--wje-input-required-symbol);\n    font-size: 24px;\n    position: absolute;\n    right: 12px;\n    top: 0;\n}\n\n:host([required]) .standard .input-wrapper::after {\n    right: 13px;\n    top: -20px;\n}\n\n:host([invalid]) {\n    .default {\n        label {\n            opacity: 1 !important;\n            color: var(--wje-input-color-invalid) !important;\n            animation-name: shake;\n            animation-duration: 0.4s;\n            animation-iteration-count: 1;\n        }\n    }\n}\n\n::slotted([slot='start']),\n::slotted([slot='end']) {\n    display: flex;\n    align-items: center;\n    border-width: var(--wje-input-border-width);\n    border-style: var(--wje-input-border-style);\n    border-color: var(--wje-input-border-color);\n    padding-inline: var(--wje-input-slot-padding-inline);\n}\n\n:host(.options-show) ::slotted([slot='start']) {\n    border-bottom-left-radius: 0 !important;\n}\n\n:host(.options-show) ::slotted([slot='end']) {\n    border-bottom-right-radius: 0 !important;\n}\n\nslot[name='start'],\nslot[name='end'] {\n    display: flex;\n}\n\nslot[name='error'] {\n    display: none;\n}\n\n:host([invalid]) slot[name='error'] {\n    display: block;\n}\n\n:host([disabled]) input {\n    opacity: 0.5;\n}\n\ninput {\n    background-color: var(--wje-input-background-color);\n    border-width: var(--wje-input-border-width);\n    border-style: var(--wje-input-border-style);\n    border-color: var(--wje-input-border-color);\n    color: var(--wje-input-color);\n    appearance: none;\n    outline: 0;\n    padding: 0.25rem 0.5rem;\n    line-height: var(--wje-input-line-height);\n    font-size: 14px;\n    font-weight: normal;\n    vertical-align: middle;\n    min-height: 32px;\n}\n\nslot[name='error'] {\n    display: none;\n    position: absolute;\n    max-width: 100%;\n    min-width: auto;\n    border-radius: 50px;\n    background-color: var(--wje-input-error-background-color, var(--wje-tooltip-background));\n    padding: 0.25rem 0.5rem;\n    top: 0;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    color: var(--wje-input-error-color, var(--wje-tooltip-color));\n    font-size: var(--wje-font-size-small);\n    width: max-content;\n    line-height: normal;\n}\n\n@keyframes shake {\n    8%,\n    41% {\n        transform: translateX(-4px);\n    }\n    25%,\n    58% {\n        transform: translateX(4px);\n    }\n    75% {\n        transform: translateX(-2px);\n    }\n    92% {\n        transform: translateX(2px);\n    }\n    0%,\n    100% {\n        transform: translateX(0);\n    }\n}\n";
+const styles = "/*\n[ WJ Input ]\n*/\n\n:host {\n    width: 100%;\n    margin-bottom: var(--wje-input-margin-bottom);\n    display: block;\n    label {\n        margin: var(--wje-input-label-margin);\n        padding: var(--wje-input-label-padding);\n        display: var(--wje-input-label-display);\n        opacity: 1;\n        cursor: text;\n        transition: opacity 0.2s ease;\n        line-height: var(--wje-input-label-line-height);\n        font-size: var(--wje-input-label-font-size);\n    }\n    .wrapper {\n        display: grid;\n        grid-template-columns: auto 1fr auto;\n        width: 100%;\n        > .input-wrapper {\n            grid-column: 2;\n        }\n    }\n    .native-input {\n        .input-wrapper {\n            display: block;\n            width: 100%;\n            position: relative;\n            box-sizing: border-box;\n\n            label {\n                width: 100%;\n            }\n        }\n        &.default {\n            background-color: var(--wje-input-background-color);\n            font-family: var(--wje-input-font-family);\n            position: relative;\n            border-radius: var(--wje-input-border-radius);\n            border-width: var(--wje-input-border-width);\n            border-style: var(--wje-input-border-style);\n            border-color: var(--wje-input-border-color);\n            padding-inline: 0;\n            padding-top: 0.25rem;\n            padding-bottom: 0.25rem;\n            transition: background-color 0.2s ease;\n            cursor: text;\n            .input-wrapper {\n                padding-inline: 0.5rem;\n            }\n            &.focused {\n                border-color: var(--wje-input-border-color-focus) !important;\n                label {\n                    opacity: 0.67;\n                    font-size: 12px;\n                    letter-spacing: normal;\n                }\n            }\n            input {\n                border: none;\n                height: 25px;\n                min-height: 25px;\n                padding: 0;\n                margin-top: -4px;\n                background: none;\n                box-shadow: none;\n                width: 100%;\n            }\n            label {\n                &.fade {\n                    opacity: 0.5;\n                    font-size: 12px;\n                    letter-spacing: normal;\n                }\n            }\n            ::slotted([slot='start']) {\n                border-left: none;\n                border-top: none;\n                border-bottom: none;\n            }\n\n            ::slotted([slot='end']) {\n                border-right: none;\n                border-top: none;\n                border-bottom: none;\n            }\n        }\n        &.standard {\n            font-family: var(--wje-input-font-family);\n            position: relative;\n            border-radius: var(--wje-input-border-radius);\n            padding-inline: 0;\n            padding-top: 0;\n            padding-bottom: 0;\n            transition: background-color 0.2s ease;\n            cursor: text;\n            &.focused {\n                input {\n                    border-color: var(--wje-input-border-color-focus) !important;\n                }\n            }\n            input {\n                background-color: var(--wje-input-background-color);\n                display: block;\n                min-height: 32px;\n                padding-inline: 0.5rem;\n                padding-top: 0;\n                padding-bottom: 0;\n                /*background: none;*/\n                box-shadow: none;\n                width: 100%;\n                box-sizing: border-box;\n                border-radius: var(--wje-input-border-radius);\n                border-width: var(--wje-input-border-width);\n                border-style: var(--wje-input-border-style);\n                border-color: var(--wje-input-border-color);\n            }\n            .input-wrapper {\n                flex-wrap: nowrap;\n                &:hover .clear {\n                    visibility: visible;\n                }\n            }\n            ::slotted([slot='start']) {\n                border-right: none;\n                border-radius: var(--wje-input-border-radius) 0 0 var(--wje-input-border-radius);\n            }\n\n            ::slotted([slot='end']) {\n                border-left: none;\n                border-radius: 0 var(--wje-input-border-radius) var(--wje-input-border-radius) 0;\n            }\n\n            &.has-start input {\n                border-top-left-radius: 0;\n                border-bottom-left-radius: 0;\n            }\n\n            &.has-end input {\n                border-top-right-radius: 0;\n                border-bottom-right-radius: 0;\n            }\n            slot[name='error'] {\n                position: static;\n\n                background: transparent;\n                padding: 0.25rem 0;\n                left: auto;\n                transform: none;\n                color: var(--wje-input-color-invalid);\n                font-size: 12px;\n                line-height: normal;\n            }\n        }\n    }\n}\n\n:host([type=hidden]) {\n    margin: 0;\n    .native-input {\n        padding: 0;\n        border-width: 0;\n    }\n}\n\n.clear {\n    visibility: hidden;\n    position: absolute;\n    right: var(--wje-input-clear-inline-end, 0);\n    top: 3px;\n    --wje-padding-top: 0.25rem;\n    --wje-padding-start: 0.25rem;\n    --wje-padding-end: 0.25rem;\n    --wje-padding-bottom: 0.25rem;\n    --wje-button-margin-inline: 0 0.25rem;\n}\n\n:host([clearable]) .native-input.focused .clear,\n:host([clearable]) .input-wrapper:hover .clear {\n    visibility: visible;\n}\n\n:host([clearable][type='number']) .clear {\n    right: var(--wje-input-number-control-width, 1.75rem);\n}\n\n:host([required]) .wrapper::after {\n    color: var(--wje-input-color-invalid);\n    content: var(--wje-input-required-symbol);\n    font-size: 24px;\n    position: absolute;\n    right: 12px;\n    top: 0;\n}\n\n:host([required]) .standard .input-wrapper::after {\n    right: 13px;\n    top: -20px;\n}\n\n:host([invalid]) {\n    .default {\n        label {\n            opacity: 1 !important;\n            color: var(--wje-input-color-invalid) !important;\n            animation-name: shake;\n            animation-duration: 0.4s;\n            animation-iteration-count: 1;\n        }\n    }\n}\n\n::slotted([slot='start']),\n::slotted([slot='end']) {\n    display: flex;\n    align-items: center;\n    border-width: var(--wje-input-border-width);\n    border-style: var(--wje-input-border-style);\n    border-color: var(--wje-input-border-color);\n    padding-inline: var(--wje-input-slot-padding-inline);\n}\n\n:host(.options-show) ::slotted([slot='start']) {\n    border-bottom-left-radius: 0 !important;\n}\n\n:host(.options-show) ::slotted([slot='end']) {\n    border-bottom-right-radius: 0 !important;\n}\n\nslot[name='start'],\nslot[name='end'] {\n    display: flex;\n}\n\nslot[name='error'] {\n    display: none;\n}\n\n:host([invalid]) slot[name='error'] {\n    display: block;\n}\n\n:host([disabled]) input {\n    opacity: 0.5;\n}\n\ninput {\n    background-color: var(--wje-input-background-color);\n    border-width: var(--wje-input-border-width);\n    border-style: var(--wje-input-border-style);\n    border-color: var(--wje-input-border-color);\n    color: var(--wje-input-color);\n    appearance: none;\n    outline: 0;\n    padding: 0.25rem 0.5rem;\n    line-height: var(--wje-input-line-height);\n    font-size: 14px;\n    font-weight: normal;\n    vertical-align: middle;\n    min-height: 32px;\n}\n\n:host([clearable]) input {\n    box-sizing: border-box;\n    padding-inline-end: calc(var(--wje-input-clear-size, 2rem) + 0.5rem);\n}\n\n:host([clearable][type='number']) input {\n    padding-inline-end: 0.5rem;\n}\n\nslot[name='error'] {\n    display: none;\n    position: absolute;\n    max-width: 100%;\n    min-width: auto;\n    border-radius: 50px;\n    background-color: var(--wje-input-error-background-color, var(--wje-tooltip-background));\n    padding: 0.25rem 0.5rem;\n    top: 0;\n    left: 50%;\n    transform: translate(-50%, -50%);\n    color: var(--wje-input-error-color, var(--wje-tooltip-color));\n    font-size: var(--wje-font-size-small);\n    width: max-content;\n    line-height: normal;\n}\n\n@keyframes shake {\n    8%,\n    41% {\n        transform: translateX(-4px);\n    }\n    25%,\n    58% {\n        transform: translateX(4px);\n    }\n    75% {\n        transform: translateX(-2px);\n    }\n    92% {\n        transform: translateX(2px);\n    }\n    0%,\n    100% {\n        transform: translateX(0);\n    }\n}\n";
 const _Input = class _Input extends FormAssociatedElement {
   /**
    * Creates an instance of Input.
    */
   constructor() {
     super();
+    __privateAdd(this, _Input_instances);
     /**
      * The class name of the input element.
      * @type {string}
@@ -24,8 +32,9 @@ const _Input = class _Input extends FormAssociatedElement {
    * @param {string} value The value to set.
    */
   set value(value) {
+    value = value ?? "";
     this.internals.setFormValue(value);
-    if (this.input) this.input.value = value;
+    if (this.input && this.input.value !== value) this.input.value = value;
     this.pristine = false;
     this._value = value;
     this.syncAria();
@@ -185,7 +194,23 @@ const _Input = class _Input extends FormAssociatedElement {
    * @returns {Array} The attributes to observe for changes.
    */
   static get observedAttributes() {
-    return ["type", "value", "name", "disabled", "placeholder", "label", "message", "error-inline", "required", "readonly", "invalid"];
+    return [
+      "type",
+      "value",
+      "name",
+      "disabled",
+      "placeholder",
+      "label",
+      "message",
+      "error-inline",
+      "required",
+      "readonly",
+      "invalid",
+      "min",
+      "max",
+      "step",
+      "inputmode"
+    ];
   }
   /**
    * Sets up the attributes for the input.
@@ -212,8 +237,8 @@ const _Input = class _Input extends FormAssociatedElement {
     }
     if (name === "value") {
       this._value = newValue ?? "";
-      this.input.value = this.value;
-      this.internals.setFormValue(this.value);
+      if (this.input.value !== this._value) this.input.value = this._value;
+      this.internals.setFormValue(this._value);
     } else if (name === "type") {
       this.input.type = this.getAttribute("type") || "text";
     } else if (name === "name") {
@@ -226,6 +251,8 @@ const _Input = class _Input extends FormAssociatedElement {
       this.input.readOnly = this.hasAttribute("readonly");
     } else if (name === "placeholder") {
       this.input.placeholder = this.placeholder;
+    } else if (["min", "max", "step", "inputmode"].includes(name)) {
+      __privateMethod(this, _Input_instances, syncNativeAttribute_fn).call(this, name, newValue);
     } else if (name === "label") {
       if (this.labelElement) this.labelElement.innerText = this.label || "";
     } else if (name === "invalid") {
@@ -356,7 +383,10 @@ const _Input = class _Input extends FormAssociatedElement {
       event.dispatchCustomEvent(this, "wje-input:input", {
         value: this.input.value
       });
-      this.value = this.input.value;
+      this.pristine = false;
+      this._value = this.input.value;
+      this.internals.setFormValue(this._value);
+      this.syncAria();
     });
     this.addEventListener("invalid", (e) => {
       this.invalid = true;
@@ -407,6 +437,20 @@ const _Input = class _Input extends FormAssociatedElement {
     return el.querySelectorAll(selector).length > 0 ? true : false;
   }
 };
+_Input_instances = new WeakSet();
+/**
+ * Syncs an attribute from the host element to the native input without redrawing.
+ * @param {string} name The attribute name.
+ * @param {string|null} value The new attribute value.
+ */
+syncNativeAttribute_fn = function(name, value) {
+  if (!(this.input instanceof HTMLInputElement)) return;
+  if (value === null) {
+    this.input.removeAttribute(name);
+  } else {
+    this.input.setAttribute(name, value);
+  }
+};
 __publicField(_Input, "_instanceId", 0);
 let Input = _Input;
 Input.define("wje-input", Input);

package/dist/wje-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-input.js","sources":["../packages/wje-input/input.element.js","../packages/wje-input/input.js"],"sourcesContent":["import { FormAssociatedElement } from '../internals/form-associated-element.js';\nimport { event } from '../utils/event.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents a custom input element. It extends the WJElement class and provides additional functionality for handling input.\n * @documentation https://elements.webjet.sk/components/input\n * @status stable\n * @augments {FormAssociatedElement}\n * @csspart native - The native part.\n * @csspart wrapper - The wrapper part.\n * @csspart input - The input part.\n * @csspart clear - The clear part.\n * @slot start - Slot for content at the start of the input.\n * @slot end - Slot for content at the end of the input.\n * @cssproperty [--wje-input-font-family=var(--wje-font-family)] - Defines the font family for the input text.\n * @cssproperty [--wje-input-background-color=var(--wje-background)] - Specifies the background color of the input field.\n * @cssproperty [--wje-input-color=var(--wje-color)] - Sets the text color within the input field.\n * @cssproperty [--wje-input-color-invalid=var(--wje-color-danger)] - Changes the text color when the input value is invalid.\n * @cssproperty [--wje-input-error-background-color=var(--wje-tooltip-background)] - Controls the background color of the validation error bubble.\n * @cssproperty [--wje-input-error-color=var(--wje-tooltip-color)] - Controls the text color of the validation error bubble.\n * @cssproperty [--wje-input-border-color=var(--wje-border-color)] - Defines the border color of the input field.\n * @cssproperty [--wje-input-border-color-focus=var(--wje-color-primary)] - Specifies the border color when the input is focused.\n * @cssproperty [--wje-input-border-width=1px] - Sets the width of the input border.\n * @cssproperty [--wje-input-border-style=solid] - Defines the border style of the input (e.g., solid, dashed).\n * @cssproperty [--wje-input-border-radius=4px] - Specifies the border radius, creating rounded corners.\n * @cssproperty [--wje-input-margin-bottom=.5rem] - Adds spacing below the input field.\n * @cssproperty [--wje-input-line-height=20px] - Sets the line height of the text within the input field.\n * @cssproperty [--wje-input-slot-padding-inline=.5rem] - Controls the padding on the left and right of the input slot content.\n * // @fires wje-input:input - Dispatched when the input value changes.\n * // @fires wje-input:clear - Dispatched when the input is cleared.\n */\nexport default class Input extends FormAssociatedElement {\n    static _instanceId = 0;\n    /**\n     * Creates an instance of Input.\n     */\n    constructor() {\n        super();\n\n        this.invalid = false;\n        this.pristine = true;\n        this._instanceId = ++Input._instanceId;\n    }\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        this.internals.setFormValue(value);\n\n        if (this.input) this.input.value = value;\n\n        this.pristine = false;\n        this._value = value;\n        this.syncAria();\n    }\n\n    /**\n     * Retrieves the value from the input element if available; otherwise,\n     * returns the internal _value property or an empty string as the default.\n     * @returns {string} The current value from the input element, the internal _value, or an empty string.\n     */\n    get value() {\n        return this.input?.value ?? this._value ?? '';\n    }\n\n    /**\n     * Sets the label attribute of the element.\n     * @param {string} value The value to set as the label attribute.\n     */\n    set label(value) {\n        this.setAttribute('label', value);\n    }\n\n    /**\n     * Retrieves the value of the 'label' attribute if it exists.\n     * If the 'label' attribute is not set, it returns false.\n     * @returns {string|boolean} The value of the 'label' attribute as a string, or false if the attribute is not set.\n     */\n    get label() {\n        return this.getAttribute('label') || false;\n    }\n\n    /**\n     * Sets the custom error display attribute for an element.\n     * @param {boolean} value If true, adds the 'custom-error-display' attribute to the element. If false, removes the attribute from the element.\n     */\n    set customErrorDisplay(value) {\n        if (value) {\n            this.setAttribute('custom-error-display', '');\n        } else {\n            this.removeAttribute('custom-error-display');\n        }\n    }\n\n    /**\n     * Getter for the customErrorDisplay attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get customErrorDisplay() {\n        return this.hasAttribute('custom-error-display');\n    }\n\n    /**\n     * Sets the `validateOnChange` property. If set to a truthy value, it adds the\n     * `validate-on-change` attribute to the element. If set to a falsy value, it\n     * removes the `validate-on-change` attribute from the element.\n     * @param {boolean} value Determines whether to add or remove the\n     * `validate-on-change` attribute. A truthy value adds the attribute, whereas a\n     * falsy value removes it.\n     */\n    set validateOnChange(value) {\n        if (value) {\n            this.setAttribute('validate-on-change', '');\n        } else {\n            this.removeAttribute('validate-on-change');\n        }\n    }\n\n    /**\n     * Getter for the validateOnChange attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get validateOnChange() {\n        return this.hasAttribute('validate-on-change');\n    }\n\n    /**\n     * @summary Getter for the defaultValue attribute.\n     * This method retrieves the 'value' attribute of the custom input element.\n     * The 'value' attribute represents the default value of the input element.\n     * If the 'value' attribute is not set, it returns an empty string.\n     * @returns {string} The default value of the input element.\n     */\n    get defaultValue() {\n        return this.getAttribute('value') ?? '';\n    }\n\n    /**\n     * @summary Setter for the defaultValue attribute.\n     * This method sets the 'value' attribute of the custom input element to the provided value.\n     * The 'value' attribute represents the default value of the input element.\n     * @param {string} value The value to set as the default value.\n     */\n    set defaultValue(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets or removes the 'clearable' attribute on the element.\n     * When set to a truthy value, the 'clearable' attribute is added; when falsy, the attribute is removed.\n     * @param {boolean} value Determines whether to set or remove the 'clearable' attribute. If true, the 'clearable' attribute is added. If false, it is removed.\n     */\n    set clearable(value) {\n        if (value) {\n            this.setAttribute('clearable', '');\n        } else {\n            this.removeAttribute('clearable');\n        }\n    }\n\n    /**\n     * Checks if the 'clearable' attribute is present on the element.\n     * @returns {boolean} True if the 'clearable' attribute is set, otherwise false.\n     */\n    get clearable() {\n        return this.hasAttribute('clearable');\n    }\n\n    /**\n     * Sets the placeholder value for an element. If the provided value is non-empty,\n     * it assigns the value to the \"placeholder\" attribute. Otherwise, it removes\n     * the \"placeholder\" attribute from the element.\n     * @param {string} value The placeholder text to set or null/undefined to remove the attribute.\n     */\n    set placeholder(value) {\n        if (value) {\n            this.setAttribute('placeholder', value);\n        } else {\n            this.removeAttribute('placeholder');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'placeholder' attribute from the element.\n     * If the attribute is not set, it returns an empty string.\n     * @returns {string} The value of the 'placeholder' attribute or an empty string if not set.\n     */\n    get placeholder() {\n        return this.getAttribute('placeholder') || '';\n    }\n\n    /**\n     * Sets the `variant` attribute on the element. If a value is provided, it will set the attribute to the given value.\n     * If no value is provided, it removes the `variant` attribute from the element.\n     * @param {string} value The value to set for the `variant` attribute. If falsy, the attribute is removed.\n     */\n    set variant(value) {\n        if (value) {\n            this.setAttribute('variant', value);\n        } else {\n            this.removeAttribute('variant');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'variant' attribute from the element.\n     * If the attribute is not set, it defaults to 'default'.\n     * @returns {string} The value of the 'variant' attribute or 'default' if not set.\n     */\n    get variant() {\n        return this.getAttribute('variant') || 'default';\n    }\n\n    /**\n     * The class name of the input element.\n     * @type {string}\n     */\n    className = 'Input';\n\n    /**\n     * Getter for the cssStyleSheet attribute.\n     * @returns {CSSStyleSheet} The CSS style sheet of the input element.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observedAttributes attribute of the input element.\n     * @returns {Array} The attributes to observe for changes.\n     */\n    static get observedAttributes() {\n        return ['type', 'value', 'name', 'disabled', 'placeholder', 'label', 'message', 'error-inline', 'required', 'readonly', 'invalid'];\n    }\n\n    /**\n     * Sets up the attributes for the input.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        // if some value was set via value setter then dont use default value\n        if (this.pristine) {\n            this.value = this.defaultValue;\n            this.pristine = false;\n        }\n        this.syncAria();\n    }\n\n    attributeChangedCallback(name, oldValue, newValue) {\n        if (oldValue === newValue) return;\n\n        const labelVisibilityChanged = Boolean(oldValue) !== Boolean(newValue);\n\n        if (name === 'label' && labelVisibilityChanged) {\n            super.attributeChangedCallback?.(name, oldValue, newValue);\n            return;\n        }\n\n        if (!this.input) {\n            this.syncAria();\n            return;\n        }\n\n        if (name === 'value') {\n            this._value = newValue ?? '';\n            this.input.value = this.value;\n            this.internals.setFormValue(this.value);\n        } else if (name === 'type') {\n            this.input.type = this.getAttribute('type') || 'text';\n        } else if (name === 'name') {\n            this.input.name = this.name;\n        } else if (name === 'disabled') {\n            this.input.disabled = this.disabled;\n        } else if (name === 'required') {\n            this.input.required = this.required;\n        } else if (name === 'readonly') {\n            this.input.readOnly = this.hasAttribute('readonly');\n        } else if (name === 'placeholder') {\n            this.input.placeholder = this.placeholder;\n        } else if (name === 'label') {\n            if (this.labelElement) this.labelElement.innerText = this.label || '';\n        } else if (name === 'invalid') {\n            this.native?.classList.toggle('has-error', this.invalid);\n\n            if (this.invalid && this.validationMessage) {\n                this.showInvalidMessage();\n            } else if (!this.invalid && this.errorMessage) {\n                this.errorMessage.textContent = '';\n            }\n        }\n\n        this.syncAria();\n    }\n\n    /**\n     * Draws the input element.\n     * @returns {DocumentFragment} The drawn input.\n     */\n    draw() {\n        let hasSlotStart = this.hasSlot(this, 'start');\n        let hasSlotEnd = this.hasSlot(this, 'end');\n        let hasSlotError = this.hasSlot(this, 'error');\n        let fragment = document.createDocumentFragment();\n\n        // Wrapper\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-input', this.variant);\n\n        if (this.invalid) native.classList.add('has-error');\n\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        // Label\n        let label = document.createElement('label');\n        label.setAttribute('part', 'label');\n        label.innerText = this.label;\n        if (this.value && !this.hasAttribute('error')) label.classList.add('fade');\n\n        // Input\n        let input = document.createElement('input');\n        input.setAttribute('type', 'text');\n        input.setAttribute('part', 'input');\n        input.setAttribute('value', this.value || '');\n        input.classList.add('form-control');\n\n        const attributes = Array.from(this.attributes).map((attr) => attr.name);\n\n        attributes.forEach((attr) => {\n            if (this.hasAttribute(attr)) {\n                input.setAttribute(attr, this[attr] || '');\n            }\n        });\n\n        // Error\n        let errorSlot = document.createElement('slot');\n        errorSlot.setAttribute('name', 'error');\n        errorSlot.setAttribute('part', 'error-slot');\n        this._ariaErrorId = this.id ? `${this.id}-error` : `wje-input-${this._instanceId}-error`;\n        errorSlot.id = this._ariaErrorId;\n\n        let error = document.createElement('div');\n        error.setAttribute('slot', 'error');\n\n        let start = null;\n        if (hasSlotStart) {\n            start = document.createElement('slot');\n            start.setAttribute('name', 'start');\n            start.setAttribute('part', 'start');\n        }\n\n        let end = null;\n        if (hasSlotEnd) {\n            end = document.createElement('slot');\n            end.setAttribute('name', 'end');\n            end.setAttribute('part', 'end');\n        }\n\n        if (hasSlotStart) {\n            wrapper.appendChild(start); // zmenene\n            native.classList.add('has-start');\n        }\n\n        if (this.label) {\n            if (this.variant === 'standard') {\n                native.append(label);\n            } else {\n                inputWrapper.appendChild(label);\n            }\n        }\n\n        inputWrapper.appendChild(input);\n        wrapper.appendChild(inputWrapper);\n\n        native.appendChild(wrapper);\n        native.append(errorSlot);\n\n        this.append(error);\n\n        if (this.clearable) {\n            this.clear = document.createElement('wje-button');\n            this.clear.classList.add('clear');\n            this.clear.setAttribute('fill', 'link');\n            this.clear.setAttribute('part', 'clear');\n\n            let clearIcon = document.createElement('wje-icon');\n            clearIcon.setAttribute('name', 'x');\n            this.clear.appendChild(clearIcon);\n            inputWrapper.appendChild(this.clear);\n        }\n\n        if (hasSlotEnd) {\n            wrapper.appendChild(end);// zmenene\n            native.classList.add('has-end');\n        }\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.labelElement = label;\n        this.input = input;\n        this.errorMessage = error;\n\n        this.syncAria();\n        return fragment;\n    }\n\n    /**\n     * Runs after the input is drawn to the DOM.\n     */\n    afterDraw() {\n        this.input.addEventListener('focus', (e) => {\n            this.labelElement.classList.add('fade');\n            this.native.classList.add('focused');\n        });\n\n        this.input.addEventListener('blur', (e) => {\n            this.native.classList.remove('focused');\n            if (!e.target.value) this.labelElement.classList.remove('fade');\n        });\n\n        this.input.addEventListener('input', (e) => {\n            this.validate();\n\n            if (this.validateOnChange) {\n                this.pristine = false;\n                this.propagateValidation();\n            }\n\n            if (this.invalid && this.checkValidity()) {\n                this.invalid = false;\n                this.errorMessage.textContent = '';\n                this.internals.setValidity({}, '');\n            }\n\n            this.input.classList.remove('pristine');\n            this.labelElement.classList.add('fade');\n\n            event.dispatchCustomEvent(this, 'wje-input:input', {\n                value: this.input.value,\n            });\n\n            this.value = this.input.value;\n        });\n\n        this.addEventListener('invalid', (e) => {\n            this.invalid = true;\n            this.pristine = false;\n\n            this.showInvalidMessage();\n\n            if (this.customErrorDisplay) {\n                e.preventDefault();\n            }\n        });\n\n        this.addEventListener('focus', () => this.input.focus());\n\n        if (this.clear) {\n            this.clear.addEventListener('wje-button:click', (e) => {\n                this.input.value = '';\n                event.dispatchCustomEvent(this.clear, 'wje-input:clear');\n            });\n        }\n\n        this.validate();\n\n        if (this.invalid) {\n            this.showInvalidMessage();\n        }\n\n        this.syncAria();\n    }\n\n    /**\n     * Syncs ARIA attributes on the host element.\n     */\n    syncAria() {\n        const requiredInvalid = this.required && !this.value;\n        const invalid = this.invalid || requiredInvalid;\n        const label = this.label && this.label !== false ? this.label.trim() : '';\n        this.setAriaState({\n            role: 'textbox',\n            disabled: this.disabled,\n            required: this.required,\n            readonly: this.hasAttribute('readonly'),\n            invalid,\n            describedBy: this._ariaErrorId,\n            ...(label ? { label } : {}),\n        });\n    }\n\n    /**\n     * Checks whether the input has a slot.\n     * @param {HTMLElement} el The element to check.\n     * @param {string} slotName The name of the slot to check for.\n     * @returns {boolean} Whether the input has the slot.\n     */\n    hasSlot(el, slotName = null) {\n        let selector = slotName ? `[slot=\"${slotName}\"]` : '[slot]';\n\n        return el.querySelectorAll(selector).length > 0 ? true : false;\n    }\n}\n","import Input from './input.element.js';\n\nexport default Input;\n\nInput.define('wje-input', Input);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-input.js","sources":["../packages/wje-input/input.element.js","../packages/wje-input/input.js"],"sourcesContent":["import { FormAssociatedElement } from '../internals/form-associated-element.js';\nimport { event } from '../utils/event.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary This class represents a custom input element. It extends the WJElement class and provides additional functionality for handling input.\n * @documentation https://elements.webjet.sk/components/input\n * @status stable\n * @augments {FormAssociatedElement}\n * @csspart native - The native part.\n * @csspart wrapper - The wrapper part.\n * @csspart input - The input part.\n * @csspart clear - The clear part.\n * @slot start - Slot for content at the start of the input.\n * @slot end - Slot for content at the end of the input.\n * @cssproperty [--wje-input-font-family=var(--wje-font-family)] - Defines the font family for the input text.\n * @cssproperty [--wje-input-background-color=var(--wje-background)] - Specifies the background color of the input field.\n * @cssproperty [--wje-input-color=var(--wje-color)] - Sets the text color within the input field.\n * @cssproperty [--wje-input-color-invalid=var(--wje-color-danger)] - Changes the text color when the input value is invalid.\n * @cssproperty [--wje-input-error-background-color=var(--wje-tooltip-background)] - Controls the background color of the validation error bubble.\n * @cssproperty [--wje-input-error-color=var(--wje-tooltip-color)] - Controls the text color of the validation error bubble.\n * @cssproperty [--wje-input-border-color=var(--wje-border-color)] - Defines the border color of the input field.\n * @cssproperty [--wje-input-border-color-focus=var(--wje-color-primary)] - Specifies the border color when the input is focused.\n * @cssproperty [--wje-input-border-width=1px] - Sets the width of the input border.\n * @cssproperty [--wje-input-border-style=solid] - Defines the border style of the input (e.g., solid, dashed).\n * @cssproperty [--wje-input-border-radius=4px] - Specifies the border radius, creating rounded corners.\n * @cssproperty [--wje-input-margin-bottom=.5rem] - Adds spacing below the input field.\n * @cssproperty [--wje-input-line-height=20px] - Sets the line height of the text within the input field.\n * @cssproperty [--wje-input-slot-padding-inline=.5rem] - Controls the padding on the left and right of the input slot content.\n * // @fires wje-input:input - Dispatched when the input value changes.\n * // @fires wje-input:clear - Dispatched when the input is cleared.\n */\nexport default class Input extends FormAssociatedElement {\n    static _instanceId = 0;\n    /**\n     * Creates an instance of Input.\n     */\n    constructor() {\n        super();\n\n        this.invalid = false;\n        this.pristine = true;\n        this._instanceId = ++Input._instanceId;\n    }\n\n    /**\n     * Setter for the value attribute.\n     * @param {string} value The value to set.\n     */\n    set value(value) {\n        value = value ?? '';\n\n        this.internals.setFormValue(value);\n\n        if (this.input && this.input.value !== value) this.input.value = value;\n\n        this.pristine = false;\n        this._value = value;\n        this.syncAria();\n    }\n\n    /**\n     * Retrieves the value from the input element if available; otherwise,\n     * returns the internal _value property or an empty string as the default.\n     * @returns {string} The current value from the input element, the internal _value, or an empty string.\n     */\n    get value() {\n        return this.input?.value ?? this._value ?? '';\n    }\n\n    /**\n     * Sets the label attribute of the element.\n     * @param {string} value The value to set as the label attribute.\n     */\n    set label(value) {\n        this.setAttribute('label', value);\n    }\n\n    /**\n     * Retrieves the value of the 'label' attribute if it exists.\n     * If the 'label' attribute is not set, it returns false.\n     * @returns {string|boolean} The value of the 'label' attribute as a string, or false if the attribute is not set.\n     */\n    get label() {\n        return this.getAttribute('label') || false;\n    }\n\n    /**\n     * Sets the custom error display attribute for an element.\n     * @param {boolean} value If true, adds the 'custom-error-display' attribute to the element. If false, removes the attribute from the element.\n     */\n    set customErrorDisplay(value) {\n        if (value) {\n            this.setAttribute('custom-error-display', '');\n        } else {\n            this.removeAttribute('custom-error-display');\n        }\n    }\n\n    /**\n     * Getter for the customErrorDisplay attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get customErrorDisplay() {\n        return this.hasAttribute('custom-error-display');\n    }\n\n    /**\n     * Sets the `validateOnChange` property. If set to a truthy value, it adds the\n     * `validate-on-change` attribute to the element. If set to a falsy value, it\n     * removes the `validate-on-change` attribute from the element.\n     * @param {boolean} value Determines whether to add or remove the\n     * `validate-on-change` attribute. A truthy value adds the attribute, whereas a\n     * falsy value removes it.\n     */\n    set validateOnChange(value) {\n        if (value) {\n            this.setAttribute('validate-on-change', '');\n        } else {\n            this.removeAttribute('validate-on-change');\n        }\n    }\n\n    /**\n     * Getter for the validateOnChange attribute.\n     * @returns {boolean} Whether the attribute is present.\n     */\n    get validateOnChange() {\n        return this.hasAttribute('validate-on-change');\n    }\n\n    /**\n     * @summary Getter for the defaultValue attribute.\n     * This method retrieves the 'value' attribute of the custom input element.\n     * The 'value' attribute represents the default value of the input element.\n     * If the 'value' attribute is not set, it returns an empty string.\n     * @returns {string} The default value of the input element.\n     */\n    get defaultValue() {\n        return this.getAttribute('value') ?? '';\n    }\n\n    /**\n     * @summary Setter for the defaultValue attribute.\n     * This method sets the 'value' attribute of the custom input element to the provided value.\n     * The 'value' attribute represents the default value of the input element.\n     * @param {string} value The value to set as the default value.\n     */\n    set defaultValue(value) {\n        this.setAttribute('value', value);\n    }\n\n    /**\n     * Sets or removes the 'clearable' attribute on the element.\n     * When set to a truthy value, the 'clearable' attribute is added; when falsy, the attribute is removed.\n     * @param {boolean} value Determines whether to set or remove the 'clearable' attribute. If true, the 'clearable' attribute is added. If false, it is removed.\n     */\n    set clearable(value) {\n        if (value) {\n            this.setAttribute('clearable', '');\n        } else {\n            this.removeAttribute('clearable');\n        }\n    }\n\n    /**\n     * Checks if the 'clearable' attribute is present on the element.\n     * @returns {boolean} True if the 'clearable' attribute is set, otherwise false.\n     */\n    get clearable() {\n        return this.hasAttribute('clearable');\n    }\n\n    /**\n     * Sets the placeholder value for an element. If the provided value is non-empty,\n     * it assigns the value to the \"placeholder\" attribute. Otherwise, it removes\n     * the \"placeholder\" attribute from the element.\n     * @param {string} value The placeholder text to set or null/undefined to remove the attribute.\n     */\n    set placeholder(value) {\n        if (value) {\n            this.setAttribute('placeholder', value);\n        } else {\n            this.removeAttribute('placeholder');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'placeholder' attribute from the element.\n     * If the attribute is not set, it returns an empty string.\n     * @returns {string} The value of the 'placeholder' attribute or an empty string if not set.\n     */\n    get placeholder() {\n        return this.getAttribute('placeholder') || '';\n    }\n\n    /**\n     * Sets the `variant` attribute on the element. If a value is provided, it will set the attribute to the given value.\n     * If no value is provided, it removes the `variant` attribute from the element.\n     * @param {string} value The value to set for the `variant` attribute. If falsy, the attribute is removed.\n     */\n    set variant(value) {\n        if (value) {\n            this.setAttribute('variant', value);\n        } else {\n            this.removeAttribute('variant');\n        }\n    }\n\n    /**\n     * Retrieves the value of the 'variant' attribute from the element.\n     * If the attribute is not set, it defaults to 'default'.\n     * @returns {string} The value of the 'variant' attribute or 'default' if not set.\n     */\n    get variant() {\n        return this.getAttribute('variant') || 'default';\n    }\n\n    /**\n     * The class name of the input element.\n     * @type {string}\n     */\n    className = 'Input';\n\n    /**\n     * Getter for the cssStyleSheet attribute.\n     * @returns {CSSStyleSheet} The CSS style sheet of the input element.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observedAttributes attribute of the input element.\n     * @returns {Array} The attributes to observe for changes.\n     */\n    static get observedAttributes() {\n        return [\n            'type',\n            'value',\n            'name',\n            'disabled',\n            'placeholder',\n            'label',\n            'message',\n            'error-inline',\n            'required',\n            'readonly',\n            'invalid',\n            'min',\n            'max',\n            'step',\n            'inputmode',\n        ];\n    }\n\n    /**\n     * Sets up the attributes for the input.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n        // if some value was set via value setter then dont use default value\n        if (this.pristine) {\n            this.value = this.defaultValue;\n            this.pristine = false;\n        }\n        this.syncAria();\n    }\n\n    attributeChangedCallback(name, oldValue, newValue) {\n        if (oldValue === newValue) return;\n\n        const labelVisibilityChanged = Boolean(oldValue) !== Boolean(newValue);\n\n        if (name === 'label' && labelVisibilityChanged) {\n            super.attributeChangedCallback?.(name, oldValue, newValue);\n            return;\n        }\n\n        if (!this.input) {\n            this.syncAria();\n            return;\n        }\n\n        if (name === 'value') {\n            this._value = newValue ?? '';\n            if (this.input.value !== this._value) this.input.value = this._value;\n            this.internals.setFormValue(this._value);\n        } else if (name === 'type') {\n            this.input.type = this.getAttribute('type') || 'text';\n        } else if (name === 'name') {\n            this.input.name = this.name;\n        } else if (name === 'disabled') {\n            this.input.disabled = this.disabled;\n        } else if (name === 'required') {\n            this.input.required = this.required;\n        } else if (name === 'readonly') {\n            this.input.readOnly = this.hasAttribute('readonly');\n        } else if (name === 'placeholder') {\n            this.input.placeholder = this.placeholder;\n        } else if (['min', 'max', 'step', 'inputmode'].includes(name)) {\n            this.#syncNativeAttribute(name, newValue);\n        } else if (name === 'label') {\n            if (this.labelElement) this.labelElement.innerText = this.label || '';\n        } else if (name === 'invalid') {\n            this.native?.classList.toggle('has-error', this.invalid);\n\n            if (this.invalid && this.validationMessage) {\n                this.showInvalidMessage();\n            } else if (!this.invalid && this.errorMessage) {\n                this.errorMessage.textContent = '';\n            }\n        }\n\n        this.syncAria();\n    }\n\n    /**\n     * Draws the input element.\n     * @returns {DocumentFragment} The drawn input.\n     */\n    draw() {\n        let hasSlotStart = this.hasSlot(this, 'start');\n        let hasSlotEnd = this.hasSlot(this, 'end');\n        let hasSlotError = this.hasSlot(this, 'error');\n        let fragment = document.createDocumentFragment();\n\n        // Wrapper\n        let native = document.createElement('div');\n        native.setAttribute('part', 'native');\n        native.classList.add('native-input', this.variant);\n\n        if (this.invalid) native.classList.add('has-error');\n\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('wrapper');\n\n        let inputWrapper = document.createElement('div');\n        inputWrapper.setAttribute('part', 'wrapper');\n        inputWrapper.classList.add('input-wrapper');\n\n        // Label\n        let label = document.createElement('label');\n        label.setAttribute('part', 'label');\n        label.innerText = this.label;\n        if (this.value && !this.hasAttribute('error')) label.classList.add('fade');\n\n        // Input\n        let input = document.createElement('input');\n        input.setAttribute('type', 'text');\n        input.setAttribute('part', 'input');\n        input.setAttribute('value', this.value || '');\n        input.classList.add('form-control');\n\n        const attributes = Array.from(this.attributes).map((attr) => attr.name);\n\n        attributes.forEach((attr) => {\n            if (this.hasAttribute(attr)) {\n                input.setAttribute(attr, this[attr] || '');\n            }\n        });\n\n        // Error\n        let errorSlot = document.createElement('slot');\n        errorSlot.setAttribute('name', 'error');\n        errorSlot.setAttribute('part', 'error-slot');\n        this._ariaErrorId = this.id ? `${this.id}-error` : `wje-input-${this._instanceId}-error`;\n        errorSlot.id = this._ariaErrorId;\n\n        let error = document.createElement('div');\n        error.setAttribute('slot', 'error');\n\n        let start = null;\n        if (hasSlotStart) {\n            start = document.createElement('slot');\n            start.setAttribute('name', 'start');\n            start.setAttribute('part', 'start');\n        }\n\n        let end = null;\n        if (hasSlotEnd) {\n            end = document.createElement('slot');\n            end.setAttribute('name', 'end');\n            end.setAttribute('part', 'end');\n        }\n\n        if (hasSlotStart) {\n            wrapper.appendChild(start); // zmenene\n            native.classList.add('has-start');\n        }\n\n        if (this.label) {\n            if (this.variant === 'standard') {\n                native.append(label);\n            } else {\n                inputWrapper.appendChild(label);\n            }\n        }\n\n        inputWrapper.appendChild(input);\n        wrapper.appendChild(inputWrapper);\n\n        native.appendChild(wrapper);\n        native.append(errorSlot);\n\n        this.append(error);\n\n        if (this.clearable) {\n            this.clear = document.createElement('wje-button');\n            this.clear.classList.add('clear');\n            this.clear.setAttribute('fill', 'link');\n            this.clear.setAttribute('part', 'clear');\n\n            let clearIcon = document.createElement('wje-icon');\n            clearIcon.setAttribute('name', 'x');\n            this.clear.appendChild(clearIcon);\n            inputWrapper.appendChild(this.clear);\n        }\n\n        if (hasSlotEnd) {\n            wrapper.appendChild(end);// zmenene\n            native.classList.add('has-end');\n        }\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.labelElement = label;\n        this.input = input;\n        this.errorMessage = error;\n\n        this.syncAria();\n        return fragment;\n    }\n\n    /**\n     * Runs after the input is drawn to the DOM.\n     */\n    afterDraw() {\n        this.input.addEventListener('focus', (e) => {\n            this.labelElement.classList.add('fade');\n            this.native.classList.add('focused');\n        });\n\n        this.input.addEventListener('blur', (e) => {\n            this.native.classList.remove('focused');\n            if (!e.target.value) this.labelElement.classList.remove('fade');\n        });\n\n        this.input.addEventListener('input', (e) => {\n            this.validate();\n\n            if (this.validateOnChange) {\n                this.pristine = false;\n                this.propagateValidation();\n            }\n\n            if (this.invalid && this.checkValidity()) {\n                this.invalid = false;\n                this.errorMessage.textContent = '';\n                this.internals.setValidity({}, '');\n            }\n\n            this.input.classList.remove('pristine');\n            this.labelElement.classList.add('fade');\n\n            event.dispatchCustomEvent(this, 'wje-input:input', {\n                value: this.input.value,\n            });\n\n            this.pristine = false;\n            this._value = this.input.value;\n            this.internals.setFormValue(this._value);\n            this.syncAria();\n        });\n\n        this.addEventListener('invalid', (e) => {\n            this.invalid = true;\n            this.pristine = false;\n\n            this.showInvalidMessage();\n\n            if (this.customErrorDisplay) {\n                e.preventDefault();\n            }\n        });\n\n        this.addEventListener('focus', () => this.input.focus());\n\n        if (this.clear) {\n            this.clear.addEventListener('wje-button:click', (e) => {\n                this.input.value = '';\n                event.dispatchCustomEvent(this.clear, 'wje-input:clear');\n            });\n        }\n\n        this.validate();\n\n        if (this.invalid) {\n            this.showInvalidMessage();\n        }\n\n        this.syncAria();\n    }\n\n    /**\n     * Syncs ARIA attributes on the host element.\n     */\n    syncAria() {\n        const requiredInvalid = this.required && !this.value;\n        const invalid = this.invalid || requiredInvalid;\n        const label = this.label && this.label !== false ? this.label.trim() : '';\n        this.setAriaState({\n            role: 'textbox',\n            disabled: this.disabled,\n            required: this.required,\n            readonly: this.hasAttribute('readonly'),\n            invalid,\n            describedBy: this._ariaErrorId,\n            ...(label ? { label } : {}),\n        });\n    }\n\n    /**\n     * Checks whether the input has a slot.\n     * @param {HTMLElement} el The element to check.\n     * @param {string} slotName The name of the slot to check for.\n     * @returns {boolean} Whether the input has the slot.\n     */\n    hasSlot(el, slotName = null) {\n        let selector = slotName ? `[slot=\"${slotName}\"]` : '[slot]';\n\n        return el.querySelectorAll(selector).length > 0 ? true : false;\n    }\n\n    /**\n     * Syncs an attribute from the host element to the native input without redrawing.\n     * @param {string} name The attribute name.\n     * @param {string|null} value The new attribute value.\n     */\n    #syncNativeAttribute(name, value) {\n        if (!(this.input instanceof HTMLInputElement)) return;\n\n        if (value === null) {\n            this.input.removeAttribute(name);\n        } else {\n            this.input.setAttribute(name, value);\n        }\n    }\n}\n","import Input from './input.element.js';\n\nexport default Input;\n\nInput.define('wje-input', Input);\n"],"names":[],"mappings":"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"}

package/dist/wje-master.js

@@ -105,7 +105,7 @@ import { default as default89 } from "./wje-tooltip.js";
 import { default as default90 } from "./wje-tree.js";
 import { default as default91 } from "./wje-tree-item.js";
 import { default as default92 } from "./wje-visually-hidden.js";
-import { P } from "./popup.element-DklicGea.js";
+import { P } from "./popup.element-C8-g3WLs.js";
 const skSk = {
   code: "sk-sk",
   name: "Slovak",

package/dist/wje-options.js

@@ -8,7 +8,8 @@ var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot
 var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
 var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
 var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), setter ? setter.call(obj, value) : member.set(obj, value), value);
-var _loadedOptions, _drawPreloadedElements;
+var __privateMethod = (obj, member, method) => (__accessCheck(obj, member, "access private method"), method);
+var _loadedOptions, _drawPreloadedElements, _Options_instances, getLazyList_fn;
 import WJElement from "./wje-element.js";
 import InfiniteScroll from "./wje-infinite-scroll.js";
 import List from "./wje-list.js";
@@ -18,6 +19,7 @@ const styles = "/*\n[ WJ OPTIONS ]\n*/\n\n:host {\n  display: block;\n  height:
 class Options extends WJElement {
   constructor() {
     super();
+    __privateAdd(this, _Options_instances);
     __privateAdd(this, _loadedOptions, []);
     __privateAdd(this, _drawPreloadedElements, []);
     __publicField(this, "dependencies", {
@@ -434,8 +436,13 @@ class Options extends WJElement {
       return;
     }
     const item = this.htmlItem(optionData);
+    const lazyList = __privateMethod(this, _Options_instances, getLazyList_fn).call(this);
     __privateGet(this, _drawPreloadedElements).push(item);
-    this.prepend(item);
+    if (lazyList) {
+      lazyList.appendChild(item);
+    } else {
+      this.prepend(item);
+    }
     this.loadedOptions.push(optionData);
   }
   /**
@@ -453,6 +460,12 @@ class Options extends WJElement {
 }
 _loadedOptions = new WeakMap();
 _drawPreloadedElements = new WeakMap();
+_Options_instances = new WeakSet();
+getLazyList_fn = function() {
+  var _a;
+  if (!this.lazy) return null;
+  return ((_a = this.infiniteScroll) == null ? void 0 : _a.querySelector("wje-list")) ?? this.querySelector(":scope > wje-infinite-scroll > wje-list");
+};
 Options.define("wje-options", Options);
 export {
   Options as default