wj-elements 0.2.0-alpha.10 → 0.2.0-alpha.12

package/dist/dark.css

@@ -4,7 +4,8 @@
 
 :host,
 .wje-theme-dark,
-.dark {
+.dark,
+[data-theme=dark] {
     color-scheme: dark;
 
     --wje-font-family:
@@ -134,6 +135,13 @@
     --wje-color-contrast-10: hsla(0, 0%, 98%, 1);
     --wje-color-contrast-11: hsla(0, 0%, 100%, 1);
 
+    /*
+    [ Skeleton ]
+    */
+    --wje-skeleton-bg: var(--wje-color-contrast-3);
+    --wje-skeleton-bg-strong: var(--wje-color-contrast-4);
+    --wje-skeleton-highlight: rgba(255, 255, 255, 0.45);
+
     /*
    [ Elements ]
    */

package/dist/light.css

@@ -5,7 +5,8 @@
 :root,
 :host,
 .wje-theme-light,
-.light {
+.light,
+[data-theme=light] {
     * {
         box-sizing: border-box !important;
     }

package/dist/wje-carousel.js

@@ -116,10 +116,20 @@ class Carousel extends WJElement {
     slides.append(slot);
     native.append(wrapper);
     if (this.navigation) {
-      this.prevButton = this.createPreviousButton();
-      this.nextButton = this.createNextButton();
-      this.append(this.prevButton);
-      this.append(this.nextButton);
+      let existingPrev = this.querySelector('[slot="prev"]');
+      let existingNext = this.querySelector('[slot="next"]');
+      this.prevButton = existingPrev || this.createPreviousButton();
+      this.nextButton = existingNext || this.createNextButton();
+      if (this.prevButton && !this.prevButton.dataset.wjeCarouselNavBound) {
+        this.prevButton.addEventListener("click", () => this.previousSlide());
+        this.prevButton.dataset.wjeCarouselNavBound = "true";
+      }
+      if (this.nextButton && !this.nextButton.dataset.wjeCarouselNavBound) {
+        this.nextButton.addEventListener("click", () => this.nextSlide());
+        this.nextButton.dataset.wjeCarouselNavBound = "true";
+      }
+      if (!existingPrev) this.append(this.prevButton);
+      if (!existingNext) this.append(this.nextButton);
       wrapper.append(slotPrev);
       wrapper.append(slotNext);
     }

package/dist/wje-carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-carousel.js","sources":["../packages/wje-carousel/carousel.element.js","../packages/wje-carousel/carousel.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary Carousel class that extends WJElement.\n * @documentation https://elements.webjet.sk/components/carousel\n * @status stable\n * @augments WJElement\n * @slot - The carousel main content.\n * @cssproperty [--wje-carousel-size=100%] - Size of the carousel component;\n */\nexport default class Carousel extends WJElement {\n    /**\n     * Carousel constructor method.\n     */\n    constructor() {\n        super();\n\n        this.slidePerPage = 1;\n    }\n\n    /**\n     * Active slide attribute.\n     * @param value\n     */\n    set activeSlide(value) {\n        this.setAttribute('active-slide', value);\n    }\n\n    /**\n     * Active slide attribute.\n     * @returns {number|number}\n     */\n    get activeSlide() {\n        return +this.getAttribute('active-slide') || 0;\n    }\n\n    /**\n     * Pagination attribute.\n     * @returns {boolean}\n     */\n    get pagination() {\n        return this.hasAttribute('pagination');\n    }\n\n    /**\n     * Navigation attribute.\n     * @returns {boolean}\n     */\n    get navigation() {\n        return this.hasAttribute('navigation');\n    }\n\n    /**\n     * Thumbnails attribute.\n     * @returns {boolean}\n     */\n    get thumbnails() {\n        return this.hasAttribute('thumbnails');\n    }\n\n    /**\n     * Loop attribute.\n     * @returns {boolean}\n     */\n    get loop() {\n        return this.hasAttribute('loop');\n    }\n\n    /**\n     * Class name for the Carousel.\n     * @type {string}\n     */\n    className = 'Carousel';\n\n    /**\n     * Getter for the CSS stylesheet.\n     * @returns {*}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     * @returns {string[]}\n     */\n    static get observedAttributes() {\n        return ['active-slide'];\n    }\n\n    /**\n     * Sets up the attributes for the Carousel.\n     * @param name\n     * @param old\n     * @param newName\n     */\n    attributeChangedCallback(name, old, newName) {\n        if (name === 'active-slide') {\n            if (this.pagination) this.changePagination();\n\n            if (this.thumbnails) this.changeThumbnails();\n        }\n    }\n\n    /**\n     * Sets up the attributes for the Carousel.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Before draw method for the Carousel.\n     */\n    beforeDraw() {\n        this.cloneFirstAndLastItems();\n    }\n\n    /**\n     * Draw method for the Carousel.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-carousel');\n\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('slides-wrapper');\n\n        let slides = document.createElement('div');\n        slides.classList.add('carousel-slides');\n\n        let slot = document.createElement('slot');\n\n        let slotPrev = document.createElement('slot');\n        slotPrev.setAttribute('name', 'prev');\n\n        let slotNext = document.createElement('slot');\n        slotNext.setAttribute('name', 'next');\n\n        slides.append(slot);\n        native.append(wrapper);\n\n        if (this.navigation) {\n            this.prevButton = this.createPreviousButton();\n            this.nextButton = this.createNextButton();\n\n            this.append(this.prevButton);\n            this.append(this.nextButton);\n\n            wrapper.append(slotPrev);\n            wrapper.append(slotNext);\n        }\n\n        wrapper.append(slides);\n\n        if (this.pagination) native.append(this.createPagination());\n\n        if (this.thumbnails) native.append(this.createThumbnails());\n\n        fragment.append(native);\n\n        this.slides = slides;\n\n        return fragment;\n    }\n\n    /**\n     * After draw method for the Carousel.\n     */\n    afterDraw() {\n        this.setIntersectionObserver();\n        this.getSlidesWithClones().forEach((slide, i) => {\n            this.intersectionObserver.observe(slide);\n        });\n\n        this.slidePerPage = this.getAttribute('slide-per-page') || 1;\n        let carouselSize = 100 / +this.slidePerPage;\n        this.style.setProperty('--wje-carousel-size', carouselSize + '%');\n\n        this.goToSlide(this.activeSlide, 'auto');\n\n        requestAnimationFrame(() => requestAnimationFrame(() => this.syncActiveToCenter()));\n\n        this.slides.addEventListener('scrollend', (e) => {\n            this.syncActiveToCenter();\n        });\n    }\n\n    /**\n     * Sync `activeSlide` to the slide whose center is closest to the container center.\n     */\n    syncActiveToCenter() {\n        const slides = this.getSlides();\n        const withClones = this.getSlidesWithClones();\n        if (!withClones.length) return;\n\n        const containerRect = this.slides.getBoundingClientRect();\n        const containerCenterX = containerRect.left + containerRect.width / 2;\n\n        let best = null;\n        let bestDist = Infinity;\n        withClones.forEach((el) => {\n            const r = el.getBoundingClientRect();\n            const center = r.left + r.width / 2;\n            const dist = Math.abs(center - containerCenterX);\n            if (dist < bestDist) {\n                bestDist = dist;\n                best = el;\n            }\n        });\n\n        if (!best) return;\n\n        const vIndex = withClones.indexOf(best);\n        if (vIndex === -1) return;\n\n        const logicalIndex = this.getLogicalIndexForVisual(vIndex);\n        this.activeSlide = logicalIndex;\n\n        // If we landed on a clone, silently snap to the corresponding real slide\n        if (this.loop && (vIndex === 0 || vIndex === withClones.length - 1)) {\n            this.goToSlide(logicalIndex, 'auto');\n        }\n    }\n\n    /**\n     * Sets up the IntersectionObserver for the Carousel.\n     */\n    setIntersectionObserver() {\n        this.intersectionObserver = new IntersectionObserver(\n            (entries) => {\n                entries.forEach((entry) => {\n                    this.entriesMap.set(entry.target, entry);\n                });\n            },\n            {\n                root: this.context.querySelector('.carousel-slides'),\n                threshold: 0.5,\n            }\n        );\n\n        this.entriesMap = new Map();\n        this.records = this.intersectionObserver.takeRecords();\n        this.records.forEach((entry) => {\n            this.entriesMap.set(entry.target, entry);\n        });\n    }\n\n    /**\n     * Goes to the slide.\n     * @param index\n     * @param behavior\n     * @param next\n     */\n    goToSlide(index, behavior = 'smooth', next = true) {\n        const slides = this.getSlides();\n        const withClones = this.getSlidesWithClones();\n\n        // remove active class from all slides (including clones)\n        withClones.forEach(slide => slide.classList.remove('active'));\n\n        // compute logical index: wrap when loop=true, else clamp\n        const maxIndex = Math.max(slides.length - 1, 0);\n        let logical;\n        if (this.loop && slides.length > 0) {\n            logical = ((index % slides.length) + slides.length) % slides.length; // safe modulo\n        } else {\n            logical = Math.min(Math.max(index, 0), maxIndex);\n        }\n        this.activeSlide = logical;\n\n        // compute visual target considering clones when loop=true\n        const vIndex = this.getVisualIndexForLogical(logical);\n        const targetEl = withClones[vIndex];\n        if (!targetEl) return;\n\n        targetEl.classList.add('active');\n\n        const targetRect = targetEl.getBoundingClientRect();\n        const containerRect = this.slides.getBoundingClientRect();\n\n        this.slides.scrollTo({\n            left: targetRect.left - containerRect.left + this.slides.scrollLeft,\n            top: targetRect.top - containerRect.top + this.slides.scrollTop,\n            behavior: behavior === 'smooth' ? 'smooth' : 'auto',\n        });\n\n        if (this.navigation && !this.loop) {\n            this.nextButton.removeAttribute('disabled');\n            this.prevButton.removeAttribute('disabled');\n\n            if (this.activeSlide === slides.length - 1) this.nextButton.setAttribute('disabled', '');\n            if (this.activeSlide === 0) this.prevButton.setAttribute('disabled', '');\n        }\n    }\n\n    /**\n     * Clones the first and last items.\n     */\n    cloneFirstAndLastItems() {\n        const items = this.getSlides();\n\n        if (items.length && this.loop) {\n            // Clone first -> append to end\n            const firstItemClone = items[0].cloneNode(true);\n            firstItemClone.classList.add('clone');\n            this.append(firstItemClone);\n\n            // Clone last -> insert before the first original item so it becomes the leading clone\n            const lastItemClone = items[items.length - 1].cloneNode(true);\n            lastItemClone.classList.add('clone');\n            this.insertBefore(lastItemClone, items[0]);\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    removeActiveSlide() {\n        this.getSlidesWithClones().forEach((slide, i) => {\n            slide.classList.remove('active');\n        });\n\n        if (this.pagination) {\n            this.context.querySelectorAll('.pagination-item').forEach((item) => {\n                item.classList.remove('active');\n            });\n        }\n\n        if (this.thumbnails) {\n            this.context.querySelectorAll('wje-thumbnail').forEach((item) => {\n                item.classList.remove('active');\n            });\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    changePagination() {\n        if (this.pagination) {\n            this.removeActiveSlide();\n            this.context.querySelectorAll('.pagination-item').forEach((item, i) => {\n                if (i === this.activeSlide) {\n                    item.classList.add('active');\n                }\n            });\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    changeThumbnails() {\n        if (this.thumbnails) {\n            this.removeActiveSlide();\n            this.context.querySelectorAll('wje-thumbnail').forEach((item, i) => {\n                if (i === this.activeSlide) {\n                    item.classList.add('active');\n                }\n            });\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createNextButton() {\n        const nextButton = document.createElement('wje-button');\n        nextButton.setAttribute('part', 'next-button');\n        nextButton.setAttribute('circle', '');\n        nextButton.setAttribute('fill', 'link');\n        nextButton.setAttribute('slot', 'next');\n        nextButton.innerHTML = '<wje-icon name=\"chevron-right\" size=\"large\"></wje-icon>';\n        nextButton.classList.add('next');\n        nextButton.addEventListener('click', (e) => {\n            this.nextSlide();\n        });\n\n        return nextButton;\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createPreviousButton() {\n        const previousButton = document.createElement('wje-button');\n        previousButton.setAttribute('part', 'previous-button');\n        previousButton.setAttribute('circle', '');\n        previousButton.setAttribute('fill', 'link');\n        previousButton.setAttribute('slot', 'prev');\n        previousButton.innerHTML = '<wje-icon name=\"chevron-left\" size=\"large\"></wje-icon>';\n        previousButton.classList.add('prev');\n        previousButton.addEventListener('click', (e) => {\n            this.previousSlide();\n        });\n\n        return previousButton;\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createPagination() {\n        const pagination = document.createElement('div');\n        pagination.setAttribute('part', 'pagination');\n        pagination.classList.add('pagination');\n\n        const slides = this.getSlides();\n        slides.forEach((slide, i) => {\n            const paginationItem = document.createElement('div');\n            paginationItem.classList.add('pagination-item');\n            paginationItem.addEventListener('click', (e) => {\n                this.removeActiveSlide();\n                e.target.classList.add('active');\n                this.goToSlide(i);\n            });\n            pagination.append(paginationItem);\n        });\n\n        return pagination;\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createThumbnails() {\n        const thumbnails = document.createElement('div');\n        thumbnails.classList.add('thumbnails');\n\n        const slides = this.getSlides();\n        slides.forEach((slide, i) => {\n            const thumbnail = document.createElement('wje-thumbnail');\n            thumbnail.innerHTML = `<img src=\"${slide.querySelector('wje-img').getAttribute('src')}\"></img>`;\n            thumbnail.addEventListener('click', (e) => {\n                this.removeActiveSlide();\n                e.target.closest('wje-thumbnail').classList.add('active');\n                this.goToSlide(i);\n            });\n            thumbnails.append(thumbnail);\n        });\n\n        return thumbnails;\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    nextSlide() {\n        this.goToSlide(this.activeSlide + this.slidePerPage);\n    }\n\n    /**\n     * Goes to the previous slide.\n     */\n    previousSlide() {\n        this.goToSlide(this.activeSlide - this.slidePerPage);\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {Array}\n     */\n    getSlides() {\n        return Array.from(this.querySelectorAll('wje-carousel-item:not(.clone)'));\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {Array}\n     */\n    getSlidesWithClones() {\n        return Array.from(this.querySelectorAll('wje-carousel-item'));\n    }\n\n    /** Maps logical index -> visual index (accounts for leading clone when loop=true) */\n    getVisualIndexForLogical(index) {\n        return this.loop ? index + 1 : index;\n    }\n\n    /** Maps visual index -> logical index (handles clones at 0 and last when loop=true) */\n    getLogicalIndexForVisual(vIndex) {\n        const slides = this.getSlides();\n        const withClones = this.getSlidesWithClones();\n        if (!this.loop) return vIndex;\n        if (vIndex === 0) return slides.length - 1;           // leading clone\n        if (vIndex === withClones.length - 1) return 0;       // trailing clone\n        return vIndex - 1;\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {boolean}\n     */\n    canGoNext() {\n        const el = this.context.querySelector('.carousel-slides');\n        return el.scrollLeft < (el.scrollWidth - el.clientWidth);\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {boolean}\n     */\n    canGoPrevious() {\n        const el = this.context.querySelector('.carousel-slides');\n        return el.scrollLeft > 0;\n    }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Carousel from './carousel.element.js';\n\n// export * from \"./carousel.element.js\";\nexport default Carousel;\n\nWJElement.define('wje-carousel', Carousel);\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"wje-carousel.js","sources":["../packages/wje-carousel/carousel.element.js","../packages/wje-carousel/carousel.js"],"sourcesContent":["import { default as WJElement, event } from '../wje-element/element.js';\nimport styles from './styles/styles.css?inline';\n\n/**\n * @summary Carousel class that extends WJElement.\n * @documentation https://elements.webjet.sk/components/carousel\n * @status stable\n * @augments WJElement\n * @slot - The carousel main content.\n * @cssproperty [--wje-carousel-size=100%] - Size of the carousel component;\n */\nexport default class Carousel extends WJElement {\n    /**\n     * Carousel constructor method.\n     */\n    constructor() {\n        super();\n\n        this.slidePerPage = 1;\n    }\n\n    /**\n     * Active slide attribute.\n     * @param value\n     */\n    set activeSlide(value) {\n        this.setAttribute('active-slide', value);\n    }\n\n    /**\n     * Active slide attribute.\n     * @returns {number|number}\n     */\n    get activeSlide() {\n        return +this.getAttribute('active-slide') || 0;\n    }\n\n    /**\n     * Pagination attribute.\n     * @returns {boolean}\n     */\n    get pagination() {\n        return this.hasAttribute('pagination');\n    }\n\n    /**\n     * Navigation attribute.\n     * @returns {boolean}\n     */\n    get navigation() {\n        return this.hasAttribute('navigation');\n    }\n\n    /**\n     * Thumbnails attribute.\n     * @returns {boolean}\n     */\n    get thumbnails() {\n        return this.hasAttribute('thumbnails');\n    }\n\n    /**\n     * Loop attribute.\n     * @returns {boolean}\n     */\n    get loop() {\n        return this.hasAttribute('loop');\n    }\n\n    /**\n     * Class name for the Carousel.\n     * @type {string}\n     */\n    className = 'Carousel';\n\n    /**\n     * Getter for the CSS stylesheet.\n     * @returns {*}\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for the observed attributes.\n     * @returns {string[]}\n     */\n    static get observedAttributes() {\n        return ['active-slide'];\n    }\n\n    /**\n     * Sets up the attributes for the Carousel.\n     * @param name\n     * @param old\n     * @param newName\n     */\n    attributeChangedCallback(name, old, newName) {\n        if (name === 'active-slide') {\n            if (this.pagination) this.changePagination();\n\n            if (this.thumbnails) this.changeThumbnails();\n        }\n    }\n\n    /**\n     * Sets up the attributes for the Carousel.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    /**\n     * Before draw method for the Carousel.\n     */\n    beforeDraw() {\n        this.cloneFirstAndLastItems();\n    }\n\n    /**\n     * Draw method for the Carousel.\n     * @returns {DocumentFragment}\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-carousel');\n\n        let wrapper = document.createElement('div');\n        wrapper.classList.add('slides-wrapper');\n\n        let slides = document.createElement('div');\n        slides.classList.add('carousel-slides');\n\n        let slot = document.createElement('slot');\n\n        let slotPrev = document.createElement('slot');\n        slotPrev.setAttribute('name', 'prev');\n\n        let slotNext = document.createElement('slot');\n        slotNext.setAttribute('name', 'next');\n\n        slides.append(slot);\n        native.append(wrapper);\n\n        if (this.navigation) {\n            let existingPrev = this.querySelector('[slot=\"prev\"]');\n            let existingNext = this.querySelector('[slot=\"next\"]');\n\n            this.prevButton = existingPrev || this.createPreviousButton();\n            this.nextButton = existingNext || this.createNextButton();\n\n            if (this.prevButton && !this.prevButton.dataset.wjeCarouselNavBound) {\n                this.prevButton.addEventListener('click', () => this.previousSlide());\n                this.prevButton.dataset.wjeCarouselNavBound = 'true';\n            }\n\n            if (this.nextButton && !this.nextButton.dataset.wjeCarouselNavBound) {\n                this.nextButton.addEventListener('click', () => this.nextSlide());\n                this.nextButton.dataset.wjeCarouselNavBound = 'true';\n            }\n\n            if (!existingPrev) this.append(this.prevButton);\n            if (!existingNext) this.append(this.nextButton);\n\n            wrapper.append(slotPrev);\n            wrapper.append(slotNext);\n        }\n\n        wrapper.append(slides);\n\n        if (this.pagination) native.append(this.createPagination());\n\n        if (this.thumbnails) native.append(this.createThumbnails());\n\n        fragment.append(native);\n\n        this.slides = slides;\n\n        return fragment;\n    }\n\n    /**\n     * After draw method for the Carousel.\n     */\n    afterDraw() {\n        this.setIntersectionObserver();\n        this.getSlidesWithClones().forEach((slide, i) => {\n            this.intersectionObserver.observe(slide);\n        });\n\n        this.slidePerPage = this.getAttribute('slide-per-page') || 1;\n        let carouselSize = 100 / +this.slidePerPage;\n        this.style.setProperty('--wje-carousel-size', carouselSize + '%');\n\n        this.goToSlide(this.activeSlide, 'auto');\n\n        requestAnimationFrame(() => requestAnimationFrame(() => this.syncActiveToCenter()));\n\n        this.slides.addEventListener('scrollend', (e) => {\n            this.syncActiveToCenter();\n        });\n    }\n\n    /**\n     * Sync `activeSlide` to the slide whose center is closest to the container center.\n     */\n    syncActiveToCenter() {\n        const slides = this.getSlides();\n        const withClones = this.getSlidesWithClones();\n        if (!withClones.length) return;\n\n        const containerRect = this.slides.getBoundingClientRect();\n        const containerCenterX = containerRect.left + containerRect.width / 2;\n\n        let best = null;\n        let bestDist = Infinity;\n        withClones.forEach((el) => {\n            const r = el.getBoundingClientRect();\n            const center = r.left + r.width / 2;\n            const dist = Math.abs(center - containerCenterX);\n            if (dist < bestDist) {\n                bestDist = dist;\n                best = el;\n            }\n        });\n\n        if (!best) return;\n\n        const vIndex = withClones.indexOf(best);\n        if (vIndex === -1) return;\n\n        const logicalIndex = this.getLogicalIndexForVisual(vIndex);\n        this.activeSlide = logicalIndex;\n\n        // If we landed on a clone, silently snap to the corresponding real slide\n        if (this.loop && (vIndex === 0 || vIndex === withClones.length - 1)) {\n            this.goToSlide(logicalIndex, 'auto');\n        }\n    }\n\n    /**\n     * Sets up the IntersectionObserver for the Carousel.\n     */\n    setIntersectionObserver() {\n        this.intersectionObserver = new IntersectionObserver(\n            (entries) => {\n                entries.forEach((entry) => {\n                    this.entriesMap.set(entry.target, entry);\n                });\n            },\n            {\n                root: this.context.querySelector('.carousel-slides'),\n                threshold: 0.5,\n            }\n        );\n\n        this.entriesMap = new Map();\n        this.records = this.intersectionObserver.takeRecords();\n        this.records.forEach((entry) => {\n            this.entriesMap.set(entry.target, entry);\n        });\n    }\n\n    /**\n     * Goes to the slide.\n     * @param index\n     * @param behavior\n     * @param next\n     */\n    goToSlide(index, behavior = 'smooth', next = true) {\n        const slides = this.getSlides();\n        const withClones = this.getSlidesWithClones();\n\n        // remove active class from all slides (including clones)\n        withClones.forEach(slide => slide.classList.remove('active'));\n\n        // compute logical index: wrap when loop=true, else clamp\n        const maxIndex = Math.max(slides.length - 1, 0);\n        let logical;\n        if (this.loop && slides.length > 0) {\n            logical = ((index % slides.length) + slides.length) % slides.length; // safe modulo\n        } else {\n            logical = Math.min(Math.max(index, 0), maxIndex);\n        }\n        this.activeSlide = logical;\n\n        // compute visual target considering clones when loop=true\n        const vIndex = this.getVisualIndexForLogical(logical);\n        const targetEl = withClones[vIndex];\n        if (!targetEl) return;\n\n        targetEl.classList.add('active');\n\n        const targetRect = targetEl.getBoundingClientRect();\n        const containerRect = this.slides.getBoundingClientRect();\n\n        this.slides.scrollTo({\n            left: targetRect.left - containerRect.left + this.slides.scrollLeft,\n            top: targetRect.top - containerRect.top + this.slides.scrollTop,\n            behavior: behavior === 'smooth' ? 'smooth' : 'auto',\n        });\n\n        if (this.navigation && !this.loop) {\n            this.nextButton.removeAttribute('disabled');\n            this.prevButton.removeAttribute('disabled');\n\n            if (this.activeSlide === slides.length - 1) this.nextButton.setAttribute('disabled', '');\n            if (this.activeSlide === 0) this.prevButton.setAttribute('disabled', '');\n        }\n    }\n\n    /**\n     * Clones the first and last items.\n     */\n    cloneFirstAndLastItems() {\n        const items = this.getSlides();\n\n        if (items.length && this.loop) {\n            // Clone first -> append to end\n            const firstItemClone = items[0].cloneNode(true);\n            firstItemClone.classList.add('clone');\n            this.append(firstItemClone);\n\n            // Clone last -> insert before the first original item so it becomes the leading clone\n            const lastItemClone = items[items.length - 1].cloneNode(true);\n            lastItemClone.classList.add('clone');\n            this.insertBefore(lastItemClone, items[0]);\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    removeActiveSlide() {\n        this.getSlidesWithClones().forEach((slide, i) => {\n            slide.classList.remove('active');\n        });\n\n        if (this.pagination) {\n            this.context.querySelectorAll('.pagination-item').forEach((item) => {\n                item.classList.remove('active');\n            });\n        }\n\n        if (this.thumbnails) {\n            this.context.querySelectorAll('wje-thumbnail').forEach((item) => {\n                item.classList.remove('active');\n            });\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    changePagination() {\n        if (this.pagination) {\n            this.removeActiveSlide();\n            this.context.querySelectorAll('.pagination-item').forEach((item, i) => {\n                if (i === this.activeSlide) {\n                    item.classList.add('active');\n                }\n            });\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    changeThumbnails() {\n        if (this.thumbnails) {\n            this.removeActiveSlide();\n            this.context.querySelectorAll('wje-thumbnail').forEach((item, i) => {\n                if (i === this.activeSlide) {\n                    item.classList.add('active');\n                }\n            });\n        }\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createNextButton() {\n        const nextButton = document.createElement('wje-button');\n        nextButton.setAttribute('part', 'next-button');\n        nextButton.setAttribute('circle', '');\n        nextButton.setAttribute('fill', 'link');\n        nextButton.setAttribute('slot', 'next');\n        nextButton.innerHTML = '<wje-icon name=\"chevron-right\" size=\"large\"></wje-icon>';\n        nextButton.classList.add('next');\n        nextButton.addEventListener('click', (e) => {\n            this.nextSlide();\n        });\n\n        return nextButton;\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createPreviousButton() {\n        const previousButton = document.createElement('wje-button');\n        previousButton.setAttribute('part', 'previous-button');\n        previousButton.setAttribute('circle', '');\n        previousButton.setAttribute('fill', 'link');\n        previousButton.setAttribute('slot', 'prev');\n        previousButton.innerHTML = '<wje-icon name=\"chevron-left\" size=\"large\"></wje-icon>';\n        previousButton.classList.add('prev');\n        previousButton.addEventListener('click', (e) => {\n            this.previousSlide();\n        });\n\n        return previousButton;\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createPagination() {\n        const pagination = document.createElement('div');\n        pagination.setAttribute('part', 'pagination');\n        pagination.classList.add('pagination');\n\n        const slides = this.getSlides();\n        slides.forEach((slide, i) => {\n            const paginationItem = document.createElement('div');\n            paginationItem.classList.add('pagination-item');\n            paginationItem.addEventListener('click', (e) => {\n                this.removeActiveSlide();\n                e.target.classList.add('active');\n                this.goToSlide(i);\n            });\n            pagination.append(paginationItem);\n        });\n\n        return pagination;\n    }\n\n    /**\n     * Goes to the next slide.\n     * @returns {Element}\n     */\n    createThumbnails() {\n        const thumbnails = document.createElement('div');\n        thumbnails.classList.add('thumbnails');\n\n        const slides = this.getSlides();\n        slides.forEach((slide, i) => {\n            const thumbnail = document.createElement('wje-thumbnail');\n            thumbnail.innerHTML = `<img src=\"${slide.querySelector('wje-img').getAttribute('src')}\"></img>`;\n            thumbnail.addEventListener('click', (e) => {\n                this.removeActiveSlide();\n                e.target.closest('wje-thumbnail').classList.add('active');\n                this.goToSlide(i);\n            });\n            thumbnails.append(thumbnail);\n        });\n\n        return thumbnails;\n    }\n\n    /**\n     * Goes to the next slide.\n     */\n    nextSlide() {\n        this.goToSlide(this.activeSlide + this.slidePerPage);\n    }\n\n    /**\n     * Goes to the previous slide.\n     */\n    previousSlide() {\n        this.goToSlide(this.activeSlide - this.slidePerPage);\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {Array}\n     */\n    getSlides() {\n        return Array.from(this.querySelectorAll('wje-carousel-item:not(.clone)'));\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {Array}\n     */\n    getSlidesWithClones() {\n        return Array.from(this.querySelectorAll('wje-carousel-item'));\n    }\n\n    /** Maps logical index -> visual index (accounts for leading clone when loop=true) */\n    getVisualIndexForLogical(index) {\n        return this.loop ? index + 1 : index;\n    }\n\n    /** Maps visual index -> logical index (handles clones at 0 and last when loop=true) */\n    getLogicalIndexForVisual(vIndex) {\n        const slides = this.getSlides();\n        const withClones = this.getSlidesWithClones();\n        if (!this.loop) return vIndex;\n        if (vIndex === 0) return slides.length - 1;           // leading clone\n        if (vIndex === withClones.length - 1) return 0;       // trailing clone\n        return vIndex - 1;\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {boolean}\n     */\n    canGoNext() {\n        const el = this.context.querySelector('.carousel-slides');\n        return el.scrollLeft < (el.scrollWidth - el.clientWidth);\n    }\n\n    /**\n     * Goes to the slide.\n     * @returns {boolean}\n     */\n    canGoPrevious() {\n        const el = this.context.querySelector('.carousel-slides');\n        return el.scrollLeft > 0;\n    }\n}\n","import { default as WJElement } from '../wje-element/element.js';\nimport Carousel from './carousel.element.js';\n\n// export * from \"./carousel.element.js\";\nexport default Carousel;\n\nWJElement.define('wje-carousel', Carousel);\n"],"names":[],"mappings":"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"}

package/dist/wje-element.js

@@ -104,7 +104,6 @@ const skeletonCss = `/*
 
 .wje-skeleton-circle {
   display: block;
-  /* Take remaining width in flex row (e.g. 40% if sibling is w-60) */
   flex: 1 1 0;
   max-width: 100%;
   aspect-ratio: 1 / 1;
@@ -115,7 +114,7 @@ const skeletonCss = `/*
   display: block;
   width: 100%;
   height: 150px;
-  border-radius: 8px;
+  border-radius: var(--wje-skeleton-radius);
 }
 
 /* Shimmer layer */

package/dist/wje-element.js.map

@@ -1 +1 @@
-{"version":3,"file":"wje-element.js","sources":["../packages/wje-element/element.js"],"sourcesContent":["import { UniversalService } from '../utils/universal-service.js';\nimport { Permissions } from '../utils/permissions.js';\nimport { WjElementUtils } from '../utils/element-utils.js';\nimport { event } from '../utils/event.js';\nimport { defaultStoreActions, store } from '../wje-store/store.js';\nimport skeletonCss from '../styles/skeleton.css?inline';\n\nconst template = document.createElement('template');\ntemplate.innerHTML = ``;\n\n// Shared skeleton helpers for Shadow DOM (global CSS doesn't cross the shadow boundary)\nconst wjSkeletonSheet = new CSSStyleSheet();\ntry {\n\twjSkeletonSheet.replaceSync(skeletonCss);\n} catch (e) {\n\t// ignore (older browsers / non-constructable stylesheets)\n}\n\nexport default class WJElement extends HTMLElement {\n\t#drawingStatus;\n\t#isAttached;\n\t#isRendering;\n\t#originalVisibility;\n\t#pristine;\n\n\t/**\n\t * Initializes a new instance of the WJElement class.\n\t */\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis.#isAttached = false;\n\t\tthis.service = new UniversalService({\n\t\t\tstore: store,\n\t\t});\n\n\t\t// definujeme vsetky zavislosti.\n\t\t// Do zavislosti patria len komponenty, ktore su zavisle od ktoreho je zavisly tento komponent\n\t\tthis.defineDependencies();\n\n\t\tthis.#isRendering = false;\n\t\tthis._dependencies = {};\n\n\t\t/**\n\t\t * @typedef {object} DrawingStatuses\n\t\t * @property {number} CREATED - The component has been created.\n\t\t * @property {number} ATTACHED - The component has been attached to the DOM.\n\t\t * @property {number} BEGINING - The component is beginning to draw.\n\t\t * @property {number} START - The component has started drawing.\n\t\t * @property {number} DRAWING - The component is drawing.\n\t\t * @property {number} DONE - The component has finished drawing.\n\t\t * @property {number} DISCONNECTED - The component has been disconnected from the DOM.\n\t\t */\n\n\t\t/**\n\t\t * WJElement is a base class for custom web components with managed lifecycle, attribute/property sync,\n\t\t * permission-based visibility, and extensibility hooks.\n\t\t * @property {boolean} isAttached - True if the component is currently attached to the DOM.\n\t\t * @property {DrawingStatuses} drawingStatuses - Enum of possible drawing states.\n\t\t * @property {number} drawingStatus - Current drawing status (see drawingStatuses).\n\t\t * @property {boolean} _pristine - True if the component has not been updated since last render.\n\t\t * @property {boolean} isRendering - True if a render is currently in progress.\n\t\t * @property {number|null} rafId - ID of the scheduled animation frame for rendering, or null.\n\t\t * @property {string|null} originalVisibility - Stores the original CSS visibility before rendering.\n\t\t * @property {object} params - Stores the current attributes/properties for rendering.\n\t\t * @property {Promise<void>} updateComplete - Promise resolved when the current update/render is complete.\n\t\t * @property {string[]} permission - List of required permissions (from 'permission' attribute).\n\t\t * @property {boolean} isPermissionCheck - Whether permission checking is enabled (from 'permission-check' attribute).\n\t\t * @property {boolean} noShow - Whether the element should be hidden (from 'no-show' attribute).\n\t\t * @property {string|undefined} isShadowRoot - Value of the 'shadow' attribute, if present.\n\t\t * @property {boolean} hasShadowRoot - True if the 'shadow' attribute is present.\n\t\t * @property {string} shadowType - Type of shadow root ('open' by default).\n\t\t * @property {object} store - Reference to the global store instance.\n\t\t * @property {object} defaultStoreActions - Default store actions for arrays and objects.\n\t\t * @property {string[]|undefined} removeClassAfterConnect - Classes to remove after connect (from 'remove-class-after-connect' attribute).\n\t\t * @property {object} dependencies - Registered component dependencies.\n\t\t * @property {HTMLElement|ShadowRoot} context - The rendering context (shadow root or element itself).\n\t\t */\n\t\tthis.drawingStatuses = {\n\t\t\tCREATED: 0,\n\t\t\tATTACHED: 1,\n\t\t\tBEGINING: 2,\n\t\t\tSTART: 3,\n\t\t\tDRAWING: 4,\n\t\t\tDONE: 5,\n\t\t\tDISCONNECTED: 6,\n\t\t};\n\n\t\tthis.#drawingStatus = this.drawingStatuses.CREATED;\n\n\t\tthis.#pristine = true;\n\t\tthis.#isRendering = false;\n\t\tthis.rafId = null;\n\t\tthis.#originalVisibility = null;\n\t\tthis.params = {};\n\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\t}\n\n\tget drawingStatus() {\n\t\treturn this.#drawingStatus;\n\t}\n\n\t/**\n\t * Sets the value of the 'permission' attribute.\n\t * @param {string[]} value The value to set for the 'permission' attribute.\n\t */\n\tset permission(value) {\n\t\tthis.setAttribute('permission', value.join(','));\n\t}\n\n\t/**\n\t * Gets the value of the 'permission-check' attribute.\n\t * @returns {string[]} The value of the 'permission' attribute.\n\t */\n\tget permission() {\n\t\treturn this.getAttribute('permission')?.split(',') || [];\n\t}\n\n\t/**\n\t * Sets the 'permission-check' attribute.\n\t * @param {boolean} value The value to set for the 'permission-check' attribute.\n\t */\n\tset isPermissionCheck(value) {\n\t\tif (value) this.setAttribute('permission-check', '');\n\t\telse this.removeAttribute('permission-check');\n\t}\n\n\t/**\n\t * Checks if the 'permission-check' attribute is present.\n\t * @returns {boolean} True if the 'permission-check' attribute is present.\n\t */\n\tget isPermissionCheck() {\n\t\treturn this.hasAttribute('permission-check');\n\t}\n\n\tset noShow(value) {\n\t\tif (value) this.setAttribute('no-show', '');\n\t\telse this.removeAttribute('no-show');\n\t}\n\n\t/**\n\t * Checks if the 'show' attribute is present.\n\t * @returns {boolean} True if the 'show' attribute is present.\n\t */\n\tget noShow() {\n\t\treturn this.hasAttribute('no-show');\n\t}\n\n\t/**\n\t * Sets the 'shadow' attribute.\n\t * @param {string} value The value to set for the 'shadow' attribute.\n\t */\n\tset isShadowRoot(value) {\n\t\treturn this.setAttribute('shadow', value);\n\t}\n\n\tget isShadowRoot() {\n\t\treturn this.getAttribute('shadow');\n\t}\n\n\t/**\n\t * Checks if the 'shadow' attribute is present.\n\t * @returns {boolean} True if the 'shadow' attribute is present.\n\t */\n\tget hasShadowRoot() {\n\t\treturn this.hasAttribute('shadow');\n\t}\n\n\t/**\n\t * Gets the value of the 'shadow' attribute or 'open' if not set.\n\t * @returns {string} The value of the 'shadow' attribute or 'open'.\n\t */\n\tget shadowType() {\n\t\treturn this.getAttribute('shadow') || 'open';\n\t}\n\n\t/**\n\t * Gets the rendering context, either the shadow root or the component itself.\n\t * @returns The rendering context.\n\t */\n\tget context() {\n\t\tif (this.hasShadowRoot) {\n\t\t\treturn this.shadowRoot;\n\t\t} else {\n\t\t\treturn this;\n\t\t}\n\t}\n\n\t/**\n\t * Gets the store instance.\n\t * @returns {object} The store instance.\n\t */\n\tget store() {\n\t\treturn store;\n\t}\n\n\t/**\n\t * @typedef {object} ArrayActions\n\t * @property {Function} addAction - Adds an item to the array.\n\t * @property {Function} deleteAction - Deletes an item from the array.\n\t * @property {Function} loadAction - Loads an array.\n\t * @property {Function} updateAction - Updates an item in the array.\n\t * @property {Function} addManyAction - Adds many items to the array.\n\t */\n\n\t/**\n\t * @typedef {object} ObjectActions\n\t * @property {Function} addAction - Replace old object with new object\n\t * @property {Function} deleteAction - Delete item based on key\n\t * @property {Function} updateAction - Update item based on key\n\t */\n\n\t/**\n\t * Gets the default store actions.\n\t * @returns The default store actions for arrays and objects.\n\t */\n\tget defaultStoreActions() {\n\t\treturn defaultStoreActions;\n\t}\n\n\t/**\n\t * Gets the classes to be removed after the component is connected.\n\t * @returns An array of class names to remove.\n\t */\n\tget removeClassAfterConnect() {\n\t\treturn this.getAttribute('remove-class-after-connect')?.split(' ');\n\t}\n\n\t/**\n\t * Sets the component dependencies.\n\t * @param value The dependencies to set.\n\t */\n\tset dependencies(value) {\n\t\tthis._dependencies = value;\n\t}\n\n\t/**\n\t * Gets the component dependencies.\n\t * @returns The component dependencies.\n\t */\n\tget dependencies() {\n\t\treturn this._dependencies;\n\t}\n\n\t/**\n\t * Processes and combines two templates into one.\n\t * @param pTemplate The primary template.\n\t * @param inputTemplate The secondary template.\n\t * @returns The combined template.\n\t */\n\tstatic processTemplates = (pTemplate, inputTemplate) => {\n\t\tconst newTemplate = document.createElement('template');\n\t\tnewTemplate.innerHTML = [inputTemplate.innerHTML, pTemplate?.innerHTML || ''].join('');\n\t\treturn newTemplate;\n\t};\n\n\t/**\n\t * Defines a custom element if not already defined.\n\t * @param name The name of the custom element.\n\t * @param [elementConstructor] The constructor for the custom element.\n\t * @param [options] Additional options for defining the element.\n\t */\n\tstatic define(name, elementConstructor = this, options = {}) {\n\t\tconst definedElement = customElements.get(name);\n\n\t\tif (!definedElement) {\n\t\t\tcustomElements.define(name, elementConstructor, options);\n\t\t}\n\t}\n\n\t/**\n\t * Defines component dependencies by registering custom elements.\n\t */\n\tdefineDependencies() {\n\t\tif (this.dependencies) {\n\t\t\tObject.entries(this.dependencies).forEach(([name, component]) => WJElement.define(name, component));\n\t\t}\n\t}\n\n\t/**\n\t * Hook for extending behavior before drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tbeforeDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior before drawing\n\t}\n\n\t/**\n\t * Renders the component within the provided context.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj\n\t * @param params Additional parameters or attributes for rendering the component.\n\t * @returns This implementation does not render anything and returns `null`.\n\t * @description\n\t * The `draw` method is responsible for rendering the component's content.\n\t * Override this method in subclasses to define custom rendering logic.\n\t * @example\n\t * class MyComponent extends WJElement {\n\t *   draw(context, appStoreObj, params) {\n\t *     const div = document.createElement('div');\n\t *     div.textContent = 'Hello, world!';\n\t *     context.appendChild(div);\n\t *   }\n\t * }\n\t */\n\tdraw(context, appStoreObj, params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Hook for extending behavior after drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tafterDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior after drawing\n\t}\n\n\t/**\n\t * Optional hook: return skeleton markup used while async draw is in progress.\n\t * Prefer declarative skeleton via `<div slot=\"skeleton\">...</div>`.\n\t * Return: string | Node | DocumentFragment | null | Promise of those.\n\t */\n\trenderSkeleton(params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Retrieves the delay duration for the skeleton display, determining the value based on a hierarchy of overrides and defaults.\n\t * The method prioritizes in the following order:\n\t * 1. A finite number set as the `_wjSkeletonSlotClone` property.\n\t * 2. A valid numeric value from the `skeleton-delay` attribute.\n\t * 3. The `skeletonDelayMs` property, if defined with a finite number.\n\t * 4. A default value of 150 if none of the above are set.\n\t * @returns {number} The delay in milliseconds before the skeleton is displayed.\n\t */\n\tget skeletonDelay() {\n\t\t// 1) property override\n\t\tif (Number.isFinite(this._wjSkeletonSlotClone)) return this._wjSkeletonSlotClone;\n\n\t\t// 2) attribute override\n\t\tconst v = this.getAttribute('skeleton-delay');\n\t\tconst n = v == null ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\t// 3) backward compat (if some components still set this)\n\t\tif (Number.isFinite(this.skeletonDelayMs)) return this.skeletonDelayMs;\n\n\t\t// 4) default\n\t\treturn 150;\n\t}\n\n\t/**\n\t * Retrieves the minimum duration for the skeleton animation.\n\t * The method checks for an internally stored finite value. If unavailable,\n\t * it retrieves the value from the 'skeleton-min-duration' attribute,\n\t * converts it to a number if possible, and uses it. If neither is valid,\n\t * a default duration of 300 is returned.\n\t * @returns {number} The minimum duration for the skeleton animation in milliseconds.\n\t */\n\tget skeletonMinDuration() {\n\t\tif (Number.isFinite(this._wjSkeletonSlotClone)) return this._wjSkeletonSlotClone;\n\n\t\tconst v = this.getAttribute('skeleton-min-duration');\n\t\tconst n = v == null ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\t// 3) default\n\t\treturn 300;\n\t}\n\n\tset skeletonMinDuration(value) {\n\t\t// allow null/undefined to reset\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonSlotClone;\n\t\t\tthis.removeAttribute('skeleton-min-duration');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonSlotClone = n;\n\t\t\tthis.setAttribute('skeleton-min-duration', String(n));\n\t\t}\n\t}\n\n\t// Public API: property-based control\n\tset skeleton(value) {\n\t\tif (value) this.setAttribute('skeleton', '');\n\t\telse this.removeAttribute('skeleton');\n\t}\n\tget skeleton() {\n\t\treturn this.hasAttribute('skeleton');\n\t}\n\n\tset skeletonDelay(value) {\n\t\t// allow null/undefined to reset\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonSlotClone;\n\t\t\tthis.removeAttribute('skeleton-delay');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonSlotClone = n;\n\t\t\tthis.setAttribute('skeleton-delay', String(n));\n\t\t}\n\t}\n\tget skeletonDelayValue() {\n\t\treturn this.skeletonDelay;\n\t}\n\n\n\t/**\n\t * Lifecycle method invoked when the component is connected to the DOM.\n\t */\n\tconnectedCallback() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.#originalVisibility = this.#originalVisibility ?? this.style.visibility;\n\t\t\tthis.style.visibility = 'hidden';\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.ATTACHED;\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\t/**\n\t * Initializes the component, setting up attributes and rendering.\n\t * @param [force] Whether to force initialization.\n\t * @returns A promise that resolves when initialization is complete.\n\t */\n\tinitWjElement = (force = false) => {\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tthis.#drawingStatus = this.drawingStatuses.BEGINING;\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\tif (!this.shadowRoot) this.attachShadow({ mode: this.shadowType || 'open', delegatesFocus: true });\n\t\t\t}\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.START;\n\n\t\t\t// Adopt component + skeleton styles BEFORE display, so skeleton is visible in Shadow DOM.\n\t\t\tconst sheet = new CSSStyleSheet();\n\t\t\tsheet.replaceSync(this.constructor.cssStyleSheet);\n\n\t\t\tif (this.shadowRoot) {\n\t\t\t\tconst existing = this.shadowRoot.adoptedStyleSheets || [];\n\t\t\t\tconst next = [...existing];\n\n\t\t\t\tif (!next.includes(wjSkeletonSheet) && wjSkeletonSheet.cssRules !== undefined) {\n\t\t\t\t\tnext.push(wjSkeletonSheet);\n\t\t\t\t}\n\n\t\t\t\tif (!next.includes(sheet)) next.push(sheet);\n\n\t\t\t\tthis.shadowRoot.adoptedStyleSheets = next;\n\t\t\t}\n\n\t\t\tawait this.display(force);\n\n\t\t\tresolve();\n\t\t});\n\t};\n\n\t/**\n\t * Sets up attributes and event listeners for the component.\n\t * This method retrieves all custom events defined for the component\n\t * and adds event listeners for each of them. When an event is triggered,\n\t * it calls the corresponding method on the host element.\n\t */\n\tsetupAttributes() {\n\t\t// Keď neaký element si zadefinuje funkciu \"setupAttributes\" tak sa obsah tejto funkcie nezavolá\n\n\t\tlet allEvents = WjElementUtils.getEvents(this);\n\t\tallEvents.forEach((customEvent, domEvent) => {\n\t\t\tthis.addEventListener(domEvent, (e) => {\n\t\t\t\tthis.getRootNode().host[customEvent]?.();\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Hook for extending behavior before disconnecting the component.\n\t */\n\tbeforeDisconnect() {\n\t\t// Hook for extending behavior before disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior after disconnecting the component.\n\t */\n\tafterDisconnect() {\n\t\t// Hook for extending behavior after disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior before redrawing the component.\n\t */\n\tbeforeRedraw() {\n\t\t// Hook for extending behavior before redrawing\n\t}\n\n\t/**\n\t * Cleans up resources and event listeners for the component.\n\t */\n\tcomponentCleanup() {\n\t\t// Hook for cleaning up the component\n\t}\n\n\t/**\n\t * Lifecycle method invoked when the component is disconnected from the DOM.\n\t */\n\tdisconnectedCallback() {\n\t\tif (this.#isAttached) {\n\t\t\tthis.beforeDisconnect?.();\n\t\t\tthis.context.innerHTML = '';\n\t\t\tthis.afterDisconnect?.();\n\t\t\tthis.#isAttached = false;\n\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\tthis.#originalVisibility = null;\n\t\t}\n\n\t\tif (this.#isRendering) {\n\t\t\tthis.stopRenderLoop();\n\t\t}\n\n\t\tthis.#drawingStatus = this.drawingStatuses.DISCONNECTED;\n\n\t\tthis.componentCleanup();\n\t}\n\n\t/**\n\t * Enqueues an update for the component.\n\t * This method processes the current render promise and then refreshes the component.\n\t */\n\t#enqueueUpdate() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t}\n\t}\n\n\t/**\n\t * Lifecycle method invoked when an observed attribute changes.\n\t * @param name The name of the attribute that changed.\n\t * @param old The old value of the attribute.\n\t * @param newName The new value of the attribute.\n\t */\n\tattributeChangedCallback(name, old, newName) {\n\t\tif (old !== newName) {\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\trefresh() {\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\n\t\tthis.#pristine = false;\n\t\tthis.#enqueueUpdate();\n\t}\n\n\t/**\n\t * Refreshes the component by reinitializing it if it is in a drawing state.\n\t * This method checks if the component's drawing status is at least in the START state.\n\t * If so, it performs the following steps:\n\t * 1. Calls the `beforeRedraw` hook if defined.\n\t * 2. Calls the `beforeDisconnect` hook if defined.\n\t * 3. Refreshes the update promise to manage the rendering lifecycle.\n\t * 4. Calls the `afterDisconnect` hook if defined.\n\t * 5. Reinitializes the component by calling `initWjElement` with `true` to force initialization.\n\t * If the component is not in a drawing state, it simply returns a resolved promise.\n\t */\n\tasync #refresh() {\n\t\tif (this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t\treturn; // Skip if async render is still processing\n\t\t}\n\n\t\tif (!this.#pristine) {\n\t\t\tthis.#pristine = true;\n\t\t\tthis.#isRendering = true;\n\n\t\t\tif (this.#isAttached) {\n\t\t\t\tthis.beforeRedraw?.();\n\t\t\t\tthis.beforeDisconnect?.();\n\t\t\t\tthis.afterDisconnect?.();\n\t\t\t} else {\n\t\t\t\tthis.stopRenderLoop();\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tawait this.initWjElement(true);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Render error:', error);\n\t\t\t} finally {\n\t\t\t\tthis.#isRendering = false;\n\n\t\t\t\tif (!this.#pristine) {\n\t\t\t\t\tthis.#pristine = false;\n\t\t\t\t\tthis.#enqueueUpdate();\n\t\t\t\t} else {\n\t\t\t\t\tthis.finisPromise();\n\t\t\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tstopRenderLoop() {\n\t\tif (this.rafId) {\n\t\t\tcancelAnimationFrame(this.rafId);\n\t\t\tthis.rafId = null;\n\t\t}\n\t}\n\n\t/**\n\t * Renders the component within the provided context.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStore The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t * @returns This implementation does not render anything and returns `null`.\n\t * @description\n\t * The `draw` method is responsible for rendering the component's content.\n\t * Override this method in subclasses to define custom rendering logic.\n\t * @example\n\t * class MyComponent extends WJElement {\n\t *   draw(context, appStore, params) {\n\t *     const div = document.createElement('div');\n\t *     div.textContent = 'Hello, world!';\n\t *     context.appendChild(div);\n\t *   }\n\t * }\n\t */\n\tdraw(context, appStore, params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Displays the component's content, optionally forcing a re-render.\n\t * @param [force] Whether to force a re-render.\n\t * @returns A promise that resolves when the display is complete.\n\t */\n\t\tdisplay(force = false) {\n\t\tthis.template = this.constructor.customTemplate || document.createElement('template');\n\n\t\t// Build the next context offscreen\n\t\tconst nextContext = document.createDocumentFragment();\n\t\tnextContext.append(this.template.content.cloneNode(true));\n\n\t\t// Check permission/noShow before DOM swap\n\t\tif (this.noShow || (this.isPermissionCheck && !Permissions.isPermissionFulfilled(this.permission))) {\n\t\t\tthis.remove();\n\t\t\treturn Promise.resolve();\n\t\t}\n\n\t\tlet skeletonTimer = null;\n\t\tlet renderFinished = false;\n\t\tlet skeletonShownAt = null;\n\n\t\tconst clearSkeletonTimer = () => {\n\t\t\tif (skeletonTimer) {\n\t\t\t\tclearTimeout(skeletonTimer);\n\t\t\t\tskeletonTimer = null;\n\t\t\t}\n\t\t};\n\n\t\tconst buildSkeletonFragment = async () => {\n\t\t\t// Prefer declarative skeleton in light DOM.\n\t\t\t// NOTE: after the first render we may `replaceChildren()` on the host, which removes light DOM.\n\t\t\t// Persist a clone so skeleton keeps working on subsequent refreshes.\n\t\t\tconst slotted = this.querySelector('[slot=\"skeleton\"]');\n\t\t\tif (slotted) {\n\t\t\t\tthis._wjSkeletonSlotClone = slotted.cloneNode(true);\n\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\tfrag.append(this._wjSkeletonSlotClone.cloneNode(true));\n\t\t\t\treturn frag;\n\t\t\t}\n\n\t\t\t// If light DOM was replaced by render, use the persisted clone\n\t\t\tif (this._wjSkeletonSlotClone) {\n\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\tfrag.append(this._wjSkeletonSlotClone.cloneNode(true));\n\t\t\t\treturn frag;\n\t\t\t}\n\n\t\t\t// Fallback to hook\n\t\t\tconst frag = document.createDocumentFragment();\n\t\t\tlet skel = this.renderSkeleton?.(WjElementUtils.getAttributes(this));\n\t\t\tif (skel instanceof Promise || skel?.constructor?.name === 'Promise') {\n\t\t\t\tskel = await skel;\n\t\t\t}\n\t\t\tif (skel == null) return null;\n\n\t\t\tlet node;\n\t\t\tif (skel instanceof HTMLElement || skel instanceof DocumentFragment) {\n\t\t\t\tnode = skel;\n\t\t\t} else {\n\t\t\t\tconst t = document.createElement('template');\n\t\t\t\tt.innerHTML = skel;\n\t\t\t\tnode = t.content.cloneNode(true);\n\t\t\t}\n\t\t\tfrag.append(node);\n\t\t\treturn frag;\n\t\t};\n\n\t\tconst showSkeleton = async () => {\n\t\t\tif (renderFinished) return;\n\t\t\tif (!this.hasAttribute('skeleton')) return;\n\n\t\t\tconst frag = await buildSkeletonFragment();\n\t\t\tif (!frag) return;\n\n\t\t\t// Ensure the host has a box to render into (custom elements default to display:inline)\n\t\t\ttry {\n\t\t\t\tconst cs = getComputedStyle(this);\n\t\t\t\tif (cs.display === 'inline') this.style.display = 'block';\n\t\t\t\tif (cs.width === '0px') this.style.width = '100%';\n\t\t\t} catch (e) {\n\t\t\t\t// ignore\n\t\t\t}\n\n\t\t\t// REPLACE mode only\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t// Ensure skeleton styles are present in shadowRoot\n\t\t\t\tif (this.shadowRoot) {\n\t\t\t\t\tconst existing = this.shadowRoot.adoptedStyleSheets || [];\n\t\t\t\t\tif (!existing.includes(wjSkeletonSheet) && wjSkeletonSheet.cssRules !== undefined) {\n\t\t\t\t\t\tthis.shadowRoot.adoptedStyleSheets = [...existing, wjSkeletonSheet];\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tthis.shadowRoot.replaceChildren(frag);\n\t\t\t} else {\n\t\t\t\tthis.replaceChildren(frag);\n\t\t\t}\n\n\t\t\tskeletonShownAt = performance.now();\n\n\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:show', {\n\t\t\t\tdetail: { delay: this.skeletonDelay },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}));\n\t\t\tif (this.hasAttribute('debug-skeleton')) {\n\t\t\t\tdebugger;\n\t\t\t}\n\t\t};\n\n\t\t// If the element is hidden during initial render, allow skeleton to be visible\n\t\tif (this.hasAttribute('skeleton') && this.style.visibility === 'hidden') {\n\t\t\tthis.style.visibility = this.#originalVisibility ?? 'visible';\n\t\t}\n\n\t\t// Schedule skeleton only after a short delay to avoid flashing on fast renders\n\t\tlet skeletonPlannedAt;\n\t\tif (this.hasAttribute('skeleton')) {\n\t\t\tskeletonPlannedAt = performance.now();\n\t\t\tskeletonTimer = setTimeout(() => {\n\t\t\t\tshowSkeleton();\n\t\t\t}, this.skeletonDelay);\n\t\t}\n\n\t\treturn this.#resolveRender(nextContext, { skipAfterDraw: true })\n\t\t\t.then(async () => {\n\t\t\t\t// Real render finished; cancel pending skeleton\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\n\t\t\t\tif (skeletonShownAt === null) {\n\t\t\t\t\t// Skeleton never shown (render was fast)\n\t\t\t\t\tconst elapsed = skeletonPlannedAt ? (performance.now() - skeletonPlannedAt) : 0;\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:skip', {\n\t\t\t\t\t\tdetail: { reason: 'render-finished-fast', elapsedMs: elapsed, delay: this.skeletonDelay },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t} else {\n\t\t\t\t\t// Skeleton was shown: enforce minimum visible duration to avoid flashing\n\t\t\t\t\tconst now = performance.now();\n\t\t\t\t\tconst visibleFor = now - skeletonShownAt;\n\t\t\t\t\tconst remaining = this.skeletonMinDuration - visibleFor;\n\t\t\t\t\tif (remaining > 0) {\n\t\t\t\t\t\tawait new Promise((r) => setTimeout(r, remaining));\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t\tthis.shadowRoot.replaceChildren(nextContext);\n\t\t\t\t} else {\n\t\t\t\t\tthis.replaceChildren(nextContext);\n\t\t\t\t}\n\n\t\t\t\t// If skeleton was visible, it has just been removed by the swap\n\t\t\t\tif (skeletonShownAt !== null) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:hide', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\treason: 'render-finished',\n\t\t\t\t\t\t\tvisibleMs: Math.max(this.skeletonMinDuration, performance.now() - skeletonShownAt),\n\t\t\t\t\t\t\tdelay: this.skeletonDelay,\n\t\t\t\t\t\t\tminDuration: this.skeletonMinDuration,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\n\t\t\t\tconst liveContext = this.hasShadowRoot ? this.shadowRoot : this;\n\t\t\t\tconst _afterDraw = this.afterDraw?.(liveContext, this.store, WjElementUtils.getAttributes(this));\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t})\n\t\t\t.finally(() => {\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\t\t\t\t// If render failed, ensure skeleton timer is cleared and notify\n\t\t\t\tif (!this.#isRendering) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:hide', {\n\t\t\t\t\t\tdetail: { reason: 'finally' },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\t/**\n\t * Renders the content into the provided target context.\n\t * This method handles asynchronous rendering, processes the output from the `draw` method,\n\t * and appends the resulting content to the specified target context.\n\t * @returns {Promise<void>} A promise that resolves once the render operation is complete and the content is appended to the target context.\n\t * @param targetContext\n\t */\n\tasync render(targetContext = this.context) {\n\t\tthis.#drawingStatus = this.drawingStatuses.DRAWING;\n\n\t\tlet _draw = this.draw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\tif (_draw instanceof Promise || _draw?.constructor.name === 'Promise') {\n\t\t\t_draw = await _draw;\n\t\t}\n\n\t\tlet rend = _draw;\n\t\tlet element;\n\n\t\tif (rend instanceof HTMLElement || rend instanceof DocumentFragment) {\n\t\t\telement = rend;\n\t\t} else {\n\t\t\tlet inputTemplate = document.createElement('template');\n\t\t\tinputTemplate.innerHTML = rend;\n\t\t\telement = inputTemplate.content.cloneNode(true);\n\t\t}\n\n\t\tlet rendered = element;\n\n\t\ttargetContext.appendChild(rendered);\n\t}\n\n\t/**\n\t * Sanitizes a given name by converting it from kebab-case to camelCase.\n\t * @param {string} name The name in kebab-case format (e.g., \"example-name\").\n\t * @returns {string} The sanitized name in camelCase format (e.g., \"exampleName\").\n\t * @example\n\t * sanitizeName('example-name');\n\t * @example\n\t * sanitizeName('my-custom-component');\n\t */\n\tsanitizeName(name) {\n\t\tlet parts = name.split('-');\n\t\treturn [parts.shift(), ...parts.map((n) => n[0].toUpperCase() + n.slice(1))].join('');\n\t}\n\n\t/**\n\t * Checks if a property on an object has a getter or setter method defined.\n\t * @param {object} obj The object on which the property is defined.\n\t * @param {string} property The name of the property to check.\n\t * @returns {object} An object indicating the presence of getter and setter methods.\n\t * @property {Function|null} hasGetter The getter function if it exists, otherwise `null`.\n\t * @property {Function|null} hasSetter The setter function if it exists, otherwise `null`.\n\t * @example\n\t * const obj = {\n\t *   get name() { return 'value'; },\n\t *   set name(val) { console.log(val); }\n\t * };\n\t * checkGetterSetter(obj, 'name');\n\t * @example\n\t * const obj = { prop: 42 };\n\t * checkGetterSetter(obj, 'prop');\n\t */\n\tcheckGetterSetter(obj, property) {\n\t\tlet descriptor = Object.getOwnPropertyDescriptor(obj, property);\n\n\t\t// Check if the descriptor is found on the object itself\n\t\tif (descriptor) {\n\t\t\treturn {\n\t\t\t\thasGetter: typeof descriptor.get === 'function' ? descriptor.get : null,\n\t\t\t\thasSetter: typeof descriptor.set === 'function' ? descriptor.set : null,\n\t\t\t};\n\t\t}\n\n\t\t// Otherwise, check the prototype chain\n\t\tlet proto = Object.getPrototypeOf(obj);\n\t\tif (proto) {\n\t\t\treturn this.checkGetterSetter(proto, property);\n\t\t}\n\n\t\t// If the property doesn't exist at all\n\t\treturn { hasGetter: null, hasSetter: null };\n\t}\n\n\t/**\n\t * Sets up property accessors for the component's attributes.\n\t */\n\tsetUpAccessors() {\n\t\tlet attrs = this.getAttributeNames();\n\t\tattrs.forEach((name) => {\n\t\t\tconst sanitizedName = this.sanitizeName(name);\n\n\t\t\tconst { hasGetter, hasSetter } = this.checkGetterSetter(this, sanitizedName);\n\n\t\t\tObject.defineProperty(this, sanitizedName, {\n\t\t\t\tset: hasSetter ?? ((value) => this.setAttribute(name, value)),\n\t\t\t\tget: hasGetter ?? (() => this.getAttribute(name)),\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Resolves the rendering process of the component, using the given target context.\n\t * @param {HTMLElement|ShadowRoot|DocumentFragment} targetContext Target for rendering (defaults to this.context)\n\t * @returns A promise that resolves when rendering is complete.\n\t * @private\n\t */\n\t#resolveRender(targetContext = this.context, { skipAfterDraw = false } = {}) {\n\t\tthis.params = WjElementUtils.getAttributes(this);\n\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tconst _beforeDraw = this.beforeDraw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\tif (_beforeDraw instanceof Promise || _beforeDraw?.constructor.name === 'Promise') {\n\t\t\t\tawait _beforeDraw;\n\t\t\t}\n\n\t\t\tawait this.render(targetContext);\n\n\t\t\tif (!skipAfterDraw) {\n\t\t\t\tconst _afterDraw = this.afterDraw?.(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// RHR toto je bicykel pre slickRouter  pretože routovanie nieje vykonané pokiaľ sa nezavolá updateComplete promise,\n\t\t\t// toto bude treba rozšíriť aby sme lepšie vedeli kontrolovať vykreslovanie elementov, a flow hookov.\n\t\t\tthis.#isRendering = false;\n\t\t\tthis.#isAttached = true;\n\n\t\t\tif (this.removeClassAfterConnect) {\n\t\t\t\tthis.classList.remove(...this.removeClassAfterConnect);\n\t\t\t}\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.DONE;\n\n\t\t\tresolve();\n\t\t}).catch((e) => {\n\t\t\tconsole.error(e);\n\t\t});\n\t}\n}\n\nlet __esModule = 'true';\nexport { __esModule, Permissions, WjElementUtils, event };\n"],"names":["frag"],"mappings":"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"}
+{"version":3,"file":"wje-element.js","sources":["../packages/wje-element/element.js"],"sourcesContent":["import { UniversalService } from '../utils/universal-service.js';\nimport { Permissions } from '../utils/permissions.js';\nimport { WjElementUtils } from '../utils/element-utils.js';\nimport { event } from '../utils/event.js';\nimport { defaultStoreActions, store } from '../wje-store/store.js';\nimport skeletonCss from '../styles/skeleton.css?inline';\n\nconst template = document.createElement('template');\ntemplate.innerHTML = ``;\n\n// Shared skeleton helpers for Shadow DOM (global CSS doesn't cross the shadow boundary)\nconst wjSkeletonSheet = new CSSStyleSheet();\ntry {\n\twjSkeletonSheet.replaceSync(skeletonCss);\n} catch (e) {\n\t// ignore (older browsers / non-constructable stylesheets)\n}\n\nexport default class WJElement extends HTMLElement {\n\t#drawingStatus;\n\t#isAttached;\n\t#isRendering;\n\t#originalVisibility;\n\t#pristine;\n\n\t/**\n\t * Initializes a new instance of the WJElement class.\n\t */\n\n\tconstructor() {\n\t\tsuper();\n\n\t\tthis.#isAttached = false;\n\t\tthis.service = new UniversalService({\n\t\t\tstore: store,\n\t\t});\n\n\t\t// definujeme vsetky zavislosti.\n\t\t// Do zavislosti patria len komponenty, ktore su zavisle od ktoreho je zavisly tento komponent\n\t\tthis.defineDependencies();\n\n\t\tthis.#isRendering = false;\n\t\tthis._dependencies = {};\n\n\t\t/**\n\t\t * @typedef {object} DrawingStatuses\n\t\t * @property {number} CREATED - The component has been created.\n\t\t * @property {number} ATTACHED - The component has been attached to the DOM.\n\t\t * @property {number} BEGINING - The component is beginning to draw.\n\t\t * @property {number} START - The component has started drawing.\n\t\t * @property {number} DRAWING - The component is drawing.\n\t\t * @property {number} DONE - The component has finished drawing.\n\t\t * @property {number} DISCONNECTED - The component has been disconnected from the DOM.\n\t\t */\n\n\t\t/**\n\t\t * WJElement is a base class for custom web components with managed lifecycle, attribute/property sync,\n\t\t * permission-based visibility, and extensibility hooks.\n\t\t * @property {boolean} isAttached - True if the component is currently attached to the DOM.\n\t\t * @property {DrawingStatuses} drawingStatuses - Enum of possible drawing states.\n\t\t * @property {number} drawingStatus - Current drawing status (see drawingStatuses).\n\t\t * @property {boolean} _pristine - True if the component has not been updated since last render.\n\t\t * @property {boolean} isRendering - True if a render is currently in progress.\n\t\t * @property {number|null} rafId - ID of the scheduled animation frame for rendering, or null.\n\t\t * @property {string|null} originalVisibility - Stores the original CSS visibility before rendering.\n\t\t * @property {object} params - Stores the current attributes/properties for rendering.\n\t\t * @property {Promise<void>} updateComplete - Promise resolved when the current update/render is complete.\n\t\t * @property {string[]} permission - List of required permissions (from 'permission' attribute).\n\t\t * @property {boolean} isPermissionCheck - Whether permission checking is enabled (from 'permission-check' attribute).\n\t\t * @property {boolean} noShow - Whether the element should be hidden (from 'no-show' attribute).\n\t\t * @property {string|undefined} isShadowRoot - Value of the 'shadow' attribute, if present.\n\t\t * @property {boolean} hasShadowRoot - True if the 'shadow' attribute is present.\n\t\t * @property {string} shadowType - Type of shadow root ('open' by default).\n\t\t * @property {object} store - Reference to the global store instance.\n\t\t * @property {object} defaultStoreActions - Default store actions for arrays and objects.\n\t\t * @property {string[]|undefined} removeClassAfterConnect - Classes to remove after connect (from 'remove-class-after-connect' attribute).\n\t\t * @property {object} dependencies - Registered component dependencies.\n\t\t * @property {HTMLElement|ShadowRoot} context - The rendering context (shadow root or element itself).\n\t\t */\n\t\tthis.drawingStatuses = {\n\t\t\tCREATED: 0,\n\t\t\tATTACHED: 1,\n\t\t\tBEGINING: 2,\n\t\t\tSTART: 3,\n\t\t\tDRAWING: 4,\n\t\t\tDONE: 5,\n\t\t\tDISCONNECTED: 6,\n\t\t};\n\n\t\tthis.#drawingStatus = this.drawingStatuses.CREATED;\n\n\t\tthis.#pristine = true;\n\t\tthis.#isRendering = false;\n\t\tthis.rafId = null;\n\t\tthis.#originalVisibility = null;\n\t\tthis.params = {};\n\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\t}\n\n\tget drawingStatus() {\n\t\treturn this.#drawingStatus;\n\t}\n\n\t/**\n\t * Sets the value of the 'permission' attribute.\n\t * @param {string[]} value The value to set for the 'permission' attribute.\n\t */\n\tset permission(value) {\n\t\tthis.setAttribute('permission', value.join(','));\n\t}\n\n\t/**\n\t * Gets the value of the 'permission-check' attribute.\n\t * @returns {string[]} The value of the 'permission' attribute.\n\t */\n\tget permission() {\n\t\treturn this.getAttribute('permission')?.split(',') || [];\n\t}\n\n\t/**\n\t * Sets the 'permission-check' attribute.\n\t * @param {boolean} value The value to set for the 'permission-check' attribute.\n\t */\n\tset isPermissionCheck(value) {\n\t\tif (value) this.setAttribute('permission-check', '');\n\t\telse this.removeAttribute('permission-check');\n\t}\n\n\t/**\n\t * Checks if the 'permission-check' attribute is present.\n\t * @returns {boolean} True if the 'permission-check' attribute is present.\n\t */\n\tget isPermissionCheck() {\n\t\treturn this.hasAttribute('permission-check');\n\t}\n\n\tset noShow(value) {\n\t\tif (value) this.setAttribute('no-show', '');\n\t\telse this.removeAttribute('no-show');\n\t}\n\n\t/**\n\t * Checks if the 'show' attribute is present.\n\t * @returns {boolean} True if the 'show' attribute is present.\n\t */\n\tget noShow() {\n\t\treturn this.hasAttribute('no-show');\n\t}\n\n\t/**\n\t * Sets the 'shadow' attribute.\n\t * @param {string} value The value to set for the 'shadow' attribute.\n\t */\n\tset isShadowRoot(value) {\n\t\treturn this.setAttribute('shadow', value);\n\t}\n\n\tget isShadowRoot() {\n\t\treturn this.getAttribute('shadow');\n\t}\n\n\t/**\n\t * Checks if the 'shadow' attribute is present.\n\t * @returns {boolean} True if the 'shadow' attribute is present.\n\t */\n\tget hasShadowRoot() {\n\t\treturn this.hasAttribute('shadow');\n\t}\n\n\t/**\n\t * Gets the value of the 'shadow' attribute or 'open' if not set.\n\t * @returns {string} The value of the 'shadow' attribute or 'open'.\n\t */\n\tget shadowType() {\n\t\treturn this.getAttribute('shadow') || 'open';\n\t}\n\n\t/**\n\t * Gets the rendering context, either the shadow root or the component itself.\n\t * @returns The rendering context.\n\t */\n\tget context() {\n\t\tif (this.hasShadowRoot) {\n\t\t\treturn this.shadowRoot;\n\t\t} else {\n\t\t\treturn this;\n\t\t}\n\t}\n\n\t/**\n\t * Gets the store instance.\n\t * @returns {object} The store instance.\n\t */\n\tget store() {\n\t\treturn store;\n\t}\n\n\t/**\n\t * @typedef {object} ArrayActions\n\t * @property {Function} addAction - Adds an item to the array.\n\t * @property {Function} deleteAction - Deletes an item from the array.\n\t * @property {Function} loadAction - Loads an array.\n\t * @property {Function} updateAction - Updates an item in the array.\n\t * @property {Function} addManyAction - Adds many items to the array.\n\t */\n\n\t/**\n\t * @typedef {object} ObjectActions\n\t * @property {Function} addAction - Replace old object with new object\n\t * @property {Function} deleteAction - Delete item based on key\n\t * @property {Function} updateAction - Update item based on key\n\t */\n\n\t/**\n\t * Gets the default store actions.\n\t * @returns The default store actions for arrays and objects.\n\t */\n\tget defaultStoreActions() {\n\t\treturn defaultStoreActions;\n\t}\n\n\t/**\n\t * Gets the classes to be removed after the component is connected.\n\t * @returns An array of class names to remove.\n\t */\n\tget removeClassAfterConnect() {\n\t\treturn this.getAttribute('remove-class-after-connect')?.split(' ');\n\t}\n\n\t/**\n\t * Sets the component dependencies.\n\t * @param value The dependencies to set.\n\t */\n\tset dependencies(value) {\n\t\tthis._dependencies = value;\n\t}\n\n\t/**\n\t * Gets the component dependencies.\n\t * @returns The component dependencies.\n\t */\n\tget dependencies() {\n\t\treturn this._dependencies;\n\t}\n\n\t/**\n\t * Processes and combines two templates into one.\n\t * @param pTemplate The primary template.\n\t * @param inputTemplate The secondary template.\n\t * @returns The combined template.\n\t */\n\tstatic processTemplates = (pTemplate, inputTemplate) => {\n\t\tconst newTemplate = document.createElement('template');\n\t\tnewTemplate.innerHTML = [inputTemplate.innerHTML, pTemplate?.innerHTML || ''].join('');\n\t\treturn newTemplate;\n\t};\n\n\t/**\n\t * Defines a custom element if not already defined.\n\t * @param name The name of the custom element.\n\t * @param [elementConstructor] The constructor for the custom element.\n\t * @param [options] Additional options for defining the element.\n\t */\n\tstatic define(name, elementConstructor = this, options = {}) {\n\t\tconst definedElement = customElements.get(name);\n\n\t\tif (!definedElement) {\n\t\t\tcustomElements.define(name, elementConstructor, options);\n\t\t}\n\t}\n\n\t/**\n\t * Defines component dependencies by registering custom elements.\n\t */\n\tdefineDependencies() {\n\t\tif (this.dependencies) {\n\t\t\tObject.entries(this.dependencies).forEach(([name, component]) => WJElement.define(name, component));\n\t\t}\n\t}\n\n\t/**\n\t * Hook for extending behavior before drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tbeforeDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior before drawing\n\t}\n\n\t/**\n\t * Renders the component within the provided context.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj\n\t * @param params Additional parameters or attributes for rendering the component.\n\t * @returns This implementation does not render anything and returns `null`.\n\t * @description\n\t * The `draw` method is responsible for rendering the component's content.\n\t * Override this method in subclasses to define custom rendering logic.\n\t * @example\n\t * class MyComponent extends WJElement {\n\t *   draw(context, appStoreObj, params) {\n\t *     const div = document.createElement('div');\n\t *     div.textContent = 'Hello, world!';\n\t *     context.appendChild(div);\n\t *   }\n\t * }\n\t */\n\tdraw(context, appStoreObj, params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Hook for extending behavior after drawing the component.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStoreObj The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t */\n\tafterDraw(context, appStoreObj, params) {\n\t\t// Hook for extending behavior after drawing\n\t}\n\n\t/**\n\t * Optional hook: return skeleton markup used while async draw is in progress.\n\t * Prefer declarative skeleton via `<div slot=\"skeleton\">...</div>`.\n\t * Return: string | Node | DocumentFragment | null | Promise of those.\n\t */\n\trenderSkeleton(params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Retrieves the delay duration for the skeleton display, determining the value based on a hierarchy of overrides and defaults.\n\t * The method prioritizes in the following order:\n\t * 1. A finite number set as the `_wjSkeletonSlotClone` property.\n\t * 2. A valid numeric value from the `skeleton-delay` attribute.\n\t * 3. The `skeletonDelayMs` property, if defined with a finite number.\n\t * 4. A default value of 150 if none of the above are set.\n\t * @returns {number} The delay in milliseconds before the skeleton is displayed.\n\t */\n\tget skeletonDelay() {\n\t\t// 1) property override\n\t\tif (Number.isFinite(this._wjSkeletonSlotClone)) return this._wjSkeletonSlotClone;\n\n\t\t// 2) attribute override\n\t\tconst v = this.getAttribute('skeleton-delay');\n\t\tconst n = v == null ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\t// 3) backward compat (if some components still set this)\n\t\tif (Number.isFinite(this.skeletonDelayMs)) return this.skeletonDelayMs;\n\n\t\t// 4) default\n\t\treturn 150;\n\t}\n\n\t/**\n\t * Retrieves the minimum duration for the skeleton animation.\n\t * The method checks for an internally stored finite value. If unavailable,\n\t * it retrieves the value from the 'skeleton-min-duration' attribute,\n\t * converts it to a number if possible, and uses it. If neither is valid,\n\t * a default duration of 300 is returned.\n\t * @returns {number} The minimum duration for the skeleton animation in milliseconds.\n\t */\n\tget skeletonMinDuration() {\n\t\tif (Number.isFinite(this._wjSkeletonSlotClone)) return this._wjSkeletonSlotClone;\n\n\t\tconst v = this.getAttribute('skeleton-min-duration');\n\t\tconst n = v == null ? NaN : Number(v);\n\t\tif (Number.isFinite(n)) return n;\n\n\t\t// 3) default\n\t\treturn 300;\n\t}\n\n\tset skeletonMinDuration(value) {\n\t\t// allow null/undefined to reset\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonSlotClone;\n\t\t\tthis.removeAttribute('skeleton-min-duration');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonSlotClone = n;\n\t\t\tthis.setAttribute('skeleton-min-duration', String(n));\n\t\t}\n\t}\n\n\t// Public API: property-based control\n\tset skeleton(value) {\n\t\tif (value) this.setAttribute('skeleton', '');\n\t\telse this.removeAttribute('skeleton');\n\t}\n\tget skeleton() {\n\t\treturn this.hasAttribute('skeleton');\n\t}\n\n\tset skeletonDelay(value) {\n\t\t// allow null/undefined to reset\n\t\tif (value === null || value === undefined || value === '') {\n\t\t\tdelete this._wjSkeletonSlotClone;\n\t\t\tthis.removeAttribute('skeleton-delay');\n\t\t\treturn;\n\t\t}\n\t\tconst n = Number(value);\n\t\tif (Number.isFinite(n)) {\n\t\t\tthis._wjSkeletonSlotClone = n;\n\t\t\tthis.setAttribute('skeleton-delay', String(n));\n\t\t}\n\t}\n\tget skeletonDelayValue() {\n\t\treturn this.skeletonDelay;\n\t}\n\n\n\t/**\n\t * Lifecycle method invoked when the component is connected to the DOM.\n\t */\n\tconnectedCallback() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.#originalVisibility = this.#originalVisibility ?? this.style.visibility;\n\t\t\tthis.style.visibility = 'hidden';\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.ATTACHED;\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\t/**\n\t * Initializes the component, setting up attributes and rendering.\n\t * @param [force] Whether to force initialization.\n\t * @returns A promise that resolves when initialization is complete.\n\t */\n\tinitWjElement = (force = false) => {\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tthis.#drawingStatus = this.drawingStatuses.BEGINING;\n\n\t\t\tthis.setupAttributes?.();\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\tif (!this.shadowRoot) this.attachShadow({ mode: this.shadowType || 'open', delegatesFocus: true });\n\t\t\t}\n\t\t\tthis.setUpAccessors();\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.START;\n\n\t\t\t// Adopt component + skeleton styles BEFORE display, so skeleton is visible in Shadow DOM.\n\t\t\tconst sheet = new CSSStyleSheet();\n\t\t\tsheet.replaceSync(this.constructor.cssStyleSheet);\n\n\t\t\tif (this.shadowRoot) {\n\t\t\t\tconst existing = this.shadowRoot.adoptedStyleSheets || [];\n\t\t\t\tconst next = [...existing];\n\n\t\t\t\tif (!next.includes(wjSkeletonSheet) && wjSkeletonSheet.cssRules !== undefined) {\n\t\t\t\t\tnext.push(wjSkeletonSheet);\n\t\t\t\t}\n\n\t\t\t\tif (!next.includes(sheet)) next.push(sheet);\n\n\t\t\t\tthis.shadowRoot.adoptedStyleSheets = next;\n\t\t\t}\n\n\t\t\tawait this.display(force);\n\n\t\t\tresolve();\n\t\t});\n\t};\n\n\t/**\n\t * Sets up attributes and event listeners for the component.\n\t * This method retrieves all custom events defined for the component\n\t * and adds event listeners for each of them. When an event is triggered,\n\t * it calls the corresponding method on the host element.\n\t */\n\tsetupAttributes() {\n\t\t// Keď neaký element si zadefinuje funkciu \"setupAttributes\" tak sa obsah tejto funkcie nezavolá\n\n\t\tlet allEvents = WjElementUtils.getEvents(this);\n\t\tallEvents.forEach((customEvent, domEvent) => {\n\t\t\tthis.addEventListener(domEvent, (e) => {\n\t\t\t\tthis.getRootNode().host[customEvent]?.();\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Hook for extending behavior before disconnecting the component.\n\t */\n\tbeforeDisconnect() {\n\t\t// Hook for extending behavior before disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior after disconnecting the component.\n\t */\n\tafterDisconnect() {\n\t\t// Hook for extending behavior after disconnecting\n\t}\n\n\t/**\n\t * Hook for extending behavior before redrawing the component.\n\t */\n\tbeforeRedraw() {\n\t\t// Hook for extending behavior before redrawing\n\t}\n\n\t/**\n\t * Cleans up resources and event listeners for the component.\n\t */\n\tcomponentCleanup() {\n\t\t// Hook for cleaning up the component\n\t}\n\n\t/**\n\t * Lifecycle method invoked when the component is disconnected from the DOM.\n\t */\n\tdisconnectedCallback() {\n\t\tif (this.#isAttached) {\n\t\t\tthis.beforeDisconnect?.();\n\t\t\tthis.context.innerHTML = '';\n\t\t\tthis.afterDisconnect?.();\n\t\t\tthis.#isAttached = false;\n\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\tthis.#originalVisibility = null;\n\t\t}\n\n\t\tif (this.#isRendering) {\n\t\t\tthis.stopRenderLoop();\n\t\t}\n\n\t\tthis.#drawingStatus = this.drawingStatuses.DISCONNECTED;\n\n\t\tthis.componentCleanup();\n\t}\n\n\t/**\n\t * Enqueues an update for the component.\n\t * This method processes the current render promise and then refreshes the component.\n\t */\n\t#enqueueUpdate() {\n\t\tif (!this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t}\n\t}\n\n\t/**\n\t * Lifecycle method invoked when an observed attribute changes.\n\t * @param name The name of the attribute that changed.\n\t * @param old The old value of the attribute.\n\t * @param newName The new value of the attribute.\n\t */\n\tattributeChangedCallback(name, old, newName) {\n\t\tif (old !== newName) {\n\t\t\tthis.#pristine = false;\n\t\t\tthis.#enqueueUpdate();\n\t\t}\n\t}\n\n\trefresh() {\n\t\tthis.updateComplete = new Promise((resolve, reject) => {\n\t\t\tthis.finisPromise = resolve;\n\t\t\tthis.rejectPromise = reject;\n\t\t});\n\n\t\tthis.#pristine = false;\n\t\tthis.#enqueueUpdate();\n\t}\n\n\t/**\n\t * Refreshes the component by reinitializing it if it is in a drawing state.\n\t * This method checks if the component's drawing status is at least in the START state.\n\t * If so, it performs the following steps:\n\t * 1. Calls the `beforeRedraw` hook if defined.\n\t * 2. Calls the `beforeDisconnect` hook if defined.\n\t * 3. Refreshes the update promise to manage the rendering lifecycle.\n\t * 4. Calls the `afterDisconnect` hook if defined.\n\t * 5. Reinitializes the component by calling `initWjElement` with `true` to force initialization.\n\t * If the component is not in a drawing state, it simply returns a resolved promise.\n\t */\n\tasync #refresh() {\n\t\tif (this.#isRendering) {\n\t\t\tthis.rafId = requestAnimationFrame(() => this.#refresh());\n\t\t\treturn; // Skip if async render is still processing\n\t\t}\n\n\t\tif (!this.#pristine) {\n\t\t\tthis.#pristine = true;\n\t\t\tthis.#isRendering = true;\n\n\t\t\tif (this.#isAttached) {\n\t\t\t\tthis.beforeRedraw?.();\n\t\t\t\tthis.beforeDisconnect?.();\n\t\t\t\tthis.afterDisconnect?.();\n\t\t\t} else {\n\t\t\t\tthis.stopRenderLoop();\n\t\t\t}\n\n\t\t\ttry {\n\t\t\t\tawait this.initWjElement(true);\n\t\t\t} catch (error) {\n\t\t\t\tconsole.error('Render error:', error);\n\t\t\t} finally {\n\t\t\t\tthis.#isRendering = false;\n\n\t\t\t\tif (!this.#pristine) {\n\t\t\t\t\tthis.#pristine = false;\n\t\t\t\t\tthis.#enqueueUpdate();\n\t\t\t\t} else {\n\t\t\t\t\tthis.finisPromise();\n\t\t\t\t\tthis.style.visibility = this.#originalVisibility;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\t}\n\n\tstopRenderLoop() {\n\t\tif (this.rafId) {\n\t\t\tcancelAnimationFrame(this.rafId);\n\t\t\tthis.rafId = null;\n\t\t}\n\t}\n\n\t/**\n\t * Renders the component within the provided context.\n\t * @param context The rendering context, usually the element's shadow root or main DOM element.\n\t * @param appStore The global application store for managing state.\n\t * @param params Additional parameters or attributes for rendering the component.\n\t * @returns This implementation does not render anything and returns `null`.\n\t * @description\n\t * The `draw` method is responsible for rendering the component's content.\n\t * Override this method in subclasses to define custom rendering logic.\n\t * @example\n\t * class MyComponent extends WJElement {\n\t *   draw(context, appStore, params) {\n\t *     const div = document.createElement('div');\n\t *     div.textContent = 'Hello, world!';\n\t *     context.appendChild(div);\n\t *   }\n\t * }\n\t */\n\tdraw(context, appStore, params) {\n\t\treturn null;\n\t}\n\n\t/**\n\t * Displays the component's content, optionally forcing a re-render.\n\t * @param [force] Whether to force a re-render.\n\t * @returns A promise that resolves when the display is complete.\n\t */\n\t\tdisplay(force = false) {\n\t\tthis.template = this.constructor.customTemplate || document.createElement('template');\n\n\t\t// Build the next context offscreen\n\t\tconst nextContext = document.createDocumentFragment();\n\t\tnextContext.append(this.template.content.cloneNode(true));\n\n\t\t// Check permission/noShow before DOM swap\n\t\tif (this.noShow || (this.isPermissionCheck && !Permissions.isPermissionFulfilled(this.permission))) {\n\t\t\tthis.remove();\n\t\t\treturn Promise.resolve();\n\t\t}\n\n\t\tlet skeletonTimer = null;\n\t\tlet renderFinished = false;\n\t\tlet skeletonShownAt = null;\n\n\t\tconst clearSkeletonTimer = () => {\n\t\t\tif (skeletonTimer) {\n\t\t\t\tclearTimeout(skeletonTimer);\n\t\t\t\tskeletonTimer = null;\n\t\t\t}\n\t\t};\n\n\t\tconst buildSkeletonFragment = async () => {\n\t\t\t// Prefer declarative skeleton in light DOM.\n\t\t\t// NOTE: after the first render we may `replaceChildren()` on the host, which removes light DOM.\n\t\t\t// Persist a clone so skeleton keeps working on subsequent refreshes.\n\t\t\tconst slotted = this.querySelector('[slot=\"skeleton\"]');\n\t\t\tif (slotted) {\n\t\t\t\tthis._wjSkeletonSlotClone = slotted.cloneNode(true);\n\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\tfrag.append(this._wjSkeletonSlotClone.cloneNode(true));\n\t\t\t\treturn frag;\n\t\t\t}\n\n\t\t\t// If light DOM was replaced by render, use the persisted clone\n\t\t\tif (this._wjSkeletonSlotClone) {\n\t\t\t\tconst frag = document.createDocumentFragment();\n\t\t\t\tfrag.append(this._wjSkeletonSlotClone.cloneNode(true));\n\t\t\t\treturn frag;\n\t\t\t}\n\n\t\t\t// Fallback to hook\n\t\t\tconst frag = document.createDocumentFragment();\n\t\t\tlet skel = this.renderSkeleton?.(WjElementUtils.getAttributes(this));\n\t\t\tif (skel instanceof Promise || skel?.constructor?.name === 'Promise') {\n\t\t\t\tskel = await skel;\n\t\t\t}\n\t\t\tif (skel == null) return null;\n\n\t\t\tlet node;\n\t\t\tif (skel instanceof HTMLElement || skel instanceof DocumentFragment) {\n\t\t\t\tnode = skel;\n\t\t\t} else {\n\t\t\t\tconst t = document.createElement('template');\n\t\t\t\tt.innerHTML = skel;\n\t\t\t\tnode = t.content.cloneNode(true);\n\t\t\t}\n\t\t\tfrag.append(node);\n\t\t\treturn frag;\n\t\t};\n\n\t\tconst showSkeleton = async () => {\n\t\t\tif (renderFinished) return;\n\t\t\tif (!this.hasAttribute('skeleton')) return;\n\n\t\t\tconst frag = await buildSkeletonFragment();\n\t\t\tif (!frag) return;\n\n\t\t\t// Ensure the host has a box to render into (custom elements default to display:inline)\n\t\t\ttry {\n\t\t\t\tconst cs = getComputedStyle(this);\n\t\t\t\tif (cs.display === 'inline') this.style.display = 'block';\n\t\t\t\tif (cs.width === '0px') this.style.width = '100%';\n\t\t\t} catch (e) {\n\t\t\t\t// ignore\n\t\t\t}\n\n\t\t\t// REPLACE mode only\n\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t// Ensure skeleton styles are present in shadowRoot\n\t\t\t\tif (this.shadowRoot) {\n\t\t\t\t\tconst existing = this.shadowRoot.adoptedStyleSheets || [];\n\t\t\t\t\tif (!existing.includes(wjSkeletonSheet) && wjSkeletonSheet.cssRules !== undefined) {\n\t\t\t\t\t\tthis.shadowRoot.adoptedStyleSheets = [...existing, wjSkeletonSheet];\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\tthis.shadowRoot.replaceChildren(frag);\n\t\t\t} else {\n\t\t\t\tthis.replaceChildren(frag);\n\t\t\t}\n\n\t\t\tskeletonShownAt = performance.now();\n\n\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:show', {\n\t\t\t\tdetail: { delay: this.skeletonDelay },\n\t\t\t\tbubbles: true,\n\t\t\t\tcomposed: true,\n\t\t\t}));\n\t\t\tif (this.hasAttribute('debug-skeleton')) {\n\t\t\t\tdebugger;\n\t\t\t}\n\t\t};\n\n\t\t// If the element is hidden during initial render, allow skeleton to be visible\n\t\tif (this.hasAttribute('skeleton') && this.style.visibility === 'hidden') {\n\t\t\tthis.style.visibility = this.#originalVisibility ?? 'visible';\n\t\t}\n\n\t\t// Schedule skeleton only after a short delay to avoid flashing on fast renders\n\t\tlet skeletonPlannedAt;\n\t\tif (this.hasAttribute('skeleton')) {\n\t\t\tskeletonPlannedAt = performance.now();\n\t\t\tskeletonTimer = setTimeout(() => {\n\t\t\t\tshowSkeleton();\n\t\t\t}, this.skeletonDelay);\n\t\t}\n\n\t\treturn this.#resolveRender(nextContext, { skipAfterDraw: true })\n\t\t\t.then(async () => {\n\t\t\t\t// Real render finished; cancel pending skeleton\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\n\t\t\t\tif (skeletonShownAt === null) {\n\t\t\t\t\t// Skeleton never shown (render was fast)\n\t\t\t\t\tconst elapsed = skeletonPlannedAt ? (performance.now() - skeletonPlannedAt) : 0;\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:skip', {\n\t\t\t\t\t\tdetail: { reason: 'render-finished-fast', elapsedMs: elapsed, delay: this.skeletonDelay },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t} else {\n\t\t\t\t\t// Skeleton was shown: enforce minimum visible duration to avoid flashing\n\t\t\t\t\tconst now = performance.now();\n\t\t\t\t\tconst visibleFor = now - skeletonShownAt;\n\t\t\t\t\tconst remaining = this.skeletonMinDuration - visibleFor;\n\t\t\t\t\tif (remaining > 0) {\n\t\t\t\t\t\tawait new Promise((r) => setTimeout(r, remaining));\n\t\t\t\t\t}\n\t\t\t\t}\n\n\t\t\t\tif (this.hasShadowRoot) {\n\t\t\t\t\tthis.shadowRoot.replaceChildren(nextContext);\n\t\t\t\t} else {\n\t\t\t\t\tthis.replaceChildren(nextContext);\n\t\t\t\t}\n\n\t\t\t\t// If skeleton was visible, it has just been removed by the swap\n\t\t\t\tif (skeletonShownAt !== null) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:hide', {\n\t\t\t\t\t\tdetail: {\n\t\t\t\t\t\t\treason: 'render-finished',\n\t\t\t\t\t\t\tvisibleMs: Math.max(this.skeletonMinDuration, performance.now() - skeletonShownAt),\n\t\t\t\t\t\t\tdelay: this.skeletonDelay,\n\t\t\t\t\t\t\tminDuration: this.skeletonMinDuration,\n\t\t\t\t\t\t},\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\n\t\t\t\tconst liveContext = this.hasShadowRoot ? this.shadowRoot : this;\n\t\t\t\tconst _afterDraw = this.afterDraw?.(liveContext, this.store, WjElementUtils.getAttributes(this));\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t})\n\t\t\t.finally(() => {\n\t\t\t\trenderFinished = true;\n\t\t\t\tclearSkeletonTimer();\n\t\t\t\t// If render failed, ensure skeleton timer is cleared and notify\n\t\t\t\tif (!this.#isRendering) {\n\t\t\t\t\tthis.dispatchEvent(new CustomEvent('wj:skeleton:hide', {\n\t\t\t\t\t\tdetail: { reason: 'finally' },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}));\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\t/**\n\t * Renders the content into the provided target context.\n\t * This method handles asynchronous rendering, processes the output from the `draw` method,\n\t * and appends the resulting content to the specified target context.\n\t * @returns {Promise<void>} A promise that resolves once the render operation is complete and the content is appended to the target context.\n\t * @param targetContext\n\t */\n\tasync render(targetContext = this.context) {\n\t\tthis.#drawingStatus = this.drawingStatuses.DRAWING;\n\n\t\tlet _draw = this.draw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\tif (_draw instanceof Promise || _draw?.constructor.name === 'Promise') {\n\t\t\t_draw = await _draw;\n\t\t}\n\n\t\tlet rend = _draw;\n\t\tlet element;\n\n\t\tif (rend instanceof HTMLElement || rend instanceof DocumentFragment) {\n\t\t\telement = rend;\n\t\t} else {\n\t\t\tlet inputTemplate = document.createElement('template');\n\t\t\tinputTemplate.innerHTML = rend;\n\t\t\telement = inputTemplate.content.cloneNode(true);\n\t\t}\n\n\t\tlet rendered = element;\n\n\t\ttargetContext.appendChild(rendered);\n\t}\n\n\t/**\n\t * Sanitizes a given name by converting it from kebab-case to camelCase.\n\t * @param {string} name The name in kebab-case format (e.g., \"example-name\").\n\t * @returns {string} The sanitized name in camelCase format (e.g., \"exampleName\").\n\t * @example\n\t * sanitizeName('example-name');\n\t * @example\n\t * sanitizeName('my-custom-component');\n\t */\n\tsanitizeName(name) {\n\t\tlet parts = name.split('-');\n\t\treturn [parts.shift(), ...parts.map((n) => n[0].toUpperCase() + n.slice(1))].join('');\n\t}\n\n\t/**\n\t * Checks if a property on an object has a getter or setter method defined.\n\t * @param {object} obj The object on which the property is defined.\n\t * @param {string} property The name of the property to check.\n\t * @returns {object} An object indicating the presence of getter and setter methods.\n\t * @property {Function|null} hasGetter The getter function if it exists, otherwise `null`.\n\t * @property {Function|null} hasSetter The setter function if it exists, otherwise `null`.\n\t * @example\n\t * const obj = {\n\t *   get name() { return 'value'; },\n\t *   set name(val) { console.log(val); }\n\t * };\n\t * checkGetterSetter(obj, 'name');\n\t * @example\n\t * const obj = { prop: 42 };\n\t * checkGetterSetter(obj, 'prop');\n\t */\n\tcheckGetterSetter(obj, property) {\n\t\tlet descriptor = Object.getOwnPropertyDescriptor(obj, property);\n\n\t\t// Check if the descriptor is found on the object itself\n\t\tif (descriptor) {\n\t\t\treturn {\n\t\t\t\thasGetter: typeof descriptor.get === 'function' ? descriptor.get : null,\n\t\t\t\thasSetter: typeof descriptor.set === 'function' ? descriptor.set : null,\n\t\t\t};\n\t\t}\n\n\t\t// Otherwise, check the prototype chain\n\t\tlet proto = Object.getPrototypeOf(obj);\n\t\tif (proto) {\n\t\t\treturn this.checkGetterSetter(proto, property);\n\t\t}\n\n\t\t// If the property doesn't exist at all\n\t\treturn { hasGetter: null, hasSetter: null };\n\t}\n\n\t/**\n\t * Sets up property accessors for the component's attributes.\n\t */\n\tsetUpAccessors() {\n\t\tlet attrs = this.getAttributeNames();\n\t\tattrs.forEach((name) => {\n\t\t\tconst sanitizedName = this.sanitizeName(name);\n\n\t\t\tconst { hasGetter, hasSetter } = this.checkGetterSetter(this, sanitizedName);\n\n\t\t\tObject.defineProperty(this, sanitizedName, {\n\t\t\t\tset: hasSetter ?? ((value) => this.setAttribute(name, value)),\n\t\t\t\tget: hasGetter ?? (() => this.getAttribute(name)),\n\t\t\t});\n\t\t});\n\t}\n\n\t/**\n\t * Resolves the rendering process of the component, using the given target context.\n\t * @param {HTMLElement|ShadowRoot|DocumentFragment} targetContext Target for rendering (defaults to this.context)\n\t * @returns A promise that resolves when rendering is complete.\n\t * @private\n\t */\n\t#resolveRender(targetContext = this.context, { skipAfterDraw = false } = {}) {\n\t\tthis.params = WjElementUtils.getAttributes(this);\n\n\t\treturn new Promise(async (resolve, reject) => {\n\t\t\tconst _beforeDraw = this.beforeDraw(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\tif (_beforeDraw instanceof Promise || _beforeDraw?.constructor.name === 'Promise') {\n\t\t\t\tawait _beforeDraw;\n\t\t\t}\n\n\t\t\tawait this.render(targetContext);\n\n\t\t\tif (!skipAfterDraw) {\n\t\t\t\tconst _afterDraw = this.afterDraw?.(targetContext, this.store, WjElementUtils.getAttributes(this));\n\n\t\t\t\tif (_afterDraw instanceof Promise || _afterDraw?.constructor.name === 'Promise') {\n\t\t\t\t\tawait _afterDraw;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t// RHR toto je bicykel pre slickRouter  pretože routovanie nieje vykonané pokiaľ sa nezavolá updateComplete promise,\n\t\t\t// toto bude treba rozšíriť aby sme lepšie vedeli kontrolovať vykreslovanie elementov, a flow hookov.\n\t\t\tthis.#isRendering = false;\n\t\t\tthis.#isAttached = true;\n\n\t\t\tif (this.removeClassAfterConnect) {\n\t\t\t\tthis.classList.remove(...this.removeClassAfterConnect);\n\t\t\t}\n\n\t\t\tthis.#drawingStatus = this.drawingStatuses.DONE;\n\n\t\t\tresolve();\n\t\t}).catch((e) => {\n\t\t\tconsole.error(e);\n\t\t});\n\t}\n}\n\nlet __esModule = 'true';\nexport { __esModule, Permissions, WjElementUtils, event };\n"],"names":["frag"],"mappings":"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"}

package/dist/wje-file-upload.js

@@ -336,7 +336,7 @@ class FileUpload extends WJElement {
    * @returns {number} The maximum number of files allowed.
    */
   get maxFiles() {
-    return parseInt(this.getAttribute("max-files")) || 1;
+    return parseInt(this.getAttribute("max-files")) || 10;
   }
   /**
    * Getter for cssStyleSheet.
@@ -504,6 +504,7 @@ class FileUpload extends WJElement {
       (_a = this.onAllFilesUploaded) == null ? void 0 : _a.call(this);
       this._queuedFiles = [];
     }).catch((err) => {
+      this._queuedFiles = this._queuedFiles.filter((file) => file !== err.file);
       event.dispatchCustomEvent(this, "wje-file-upload:error", err);
     });
   }

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

@@ -1 +1 @@
-{"version":3,"file":"wje-file-upload.js","sources":["../packages/wje-file-upload/service/service.js","../packages/wje-file-upload/file-upload.element.js","../packages/wje-file-upload/file-upload.js"],"sourcesContent":["/**\n * Returns a list of file type categories and their corresponding icon names.\n * @returns {Array<object>} An array of objects representing file type categories.\n * Each object contains the following properties:\n * - `type` {Array&lt;string>} A list of file extensions associated with the category.\n * - `name` {string} The name of the icon representing the category.\n * @example\n * const types = fileType();\n * console.log(types);\n * // [\n * //   { type: [\"jpg\", \"jpeg\", \"png\", \"gif\", \"bpm\", \"tiff\", \"svg\"], name: \"photo\" },\n * //   { type: [\"zip\", \"rar\", \"cab\", \"jar\", \"tar\", \"gzip\", \"uue\", \"bz2\", \"scorm\", \"war\"], name: \"file-type-zip\" },\n * //   ...\n * // ]\n */\nfunction fileType() {\n    return [\n        {\n            type: ['jpg', 'jpeg', 'png', 'gif', 'bpm', 'tiff', 'svg'],\n            name: 'photo',\n        },\n        {\n            type: ['zip', 'rar', 'cab', 'jar', 'tar', 'gzip', 'uue', 'bz2', 'scorm', 'war'],\n            name: 'file-type-zip',\n        },\n        {\n            type: ['mov', 'mp4', 'avi', 'flv'],\n            name: 'video',\n        },\n        {\n            type: ['m4a', 'mp3', 'wav'],\n            name: 'audio',\n        },\n        {\n            type: ['html', 'html'],\n            name: 'file-type-html',\n        },\n        {\n            type: ['css'],\n            name: 'code',\n        },\n        {\n            type: ['txt'],\n            name: 'file-type-txt',\n        },\n        {\n            type: ['doc', 'docx'],\n            name: 'file-type-doc',\n        },\n        {\n            type: ['xls', 'xlsx'],\n            name: 'file-type-xls',\n        },\n        {\n            type: ['pdf'],\n            name: 'file-type-pdf',\n        },\n        {\n            type: ['ppt', 'pptx', 'odp'],\n            name: 'file-type-ppt',\n        },\n    ];\n}\n\n/**\n * Retrieves the icon name for a given file type.\n * @param {string} type The file type or category (e.g., \"pdf\", \"image\", \"folder\").\n * @returns {string} The name of the icon associated with the file type.\n * @example\n * getFileTypeIcon('pdf'); // Returns the icon name for PDF files.\n * getFileTypeIcon('folder'); // Returns 'folder'.\n */\nexport function getFileTypeIcon(type) {\n    let searchType;\n    if (type.toLowerCase() !== 'folder') {\n        fileType().forEach((i) => {\n            if (i.type.includes(type.toLowerCase())) {\n                searchType = i.name;\n            }\n        });\n    } else {\n        searchType = 'folder';\n    }\n\n    return searchType;\n}\n\n/**\n * 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     * Retrieves the maximum number of files allowed from the `max-files` attribute.\n     * If the attribute is not set or is invalid, defaults to 0.\n     * @returns {number} The maximum number of files allowed.\n     */\n    get maxFiles() {\n        return parseInt(this.getAttribute('max-files')) || 1;\n    }\n\n    className = 'FileUpload';\n\n    /**\n     * Getter for cssStyleSheet.\n     * @returns {string} The CSS styles for the component.\n     */\n    static get cssStyleSheet() {\n        return styles;\n    }\n\n    /**\n     * Getter for observedAttributes.\n     * @returns {Array} An empty array as no attributes are observed.\n     */\n    static get observedAttributes() {\n        return [];\n    }\n\n    /**\n     * Method to setup attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    beforeDraw() {\n        this.uploadFunction = upload(this.uploadUrl, this.chunkSize, !this.toChunk);\n    }\n\n    /**\n     * Method to draw the component on the screen.\n     * @returns {DocumentFragment} The fragment containing the component.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-file-upload');\n        native.setAttribute('part', 'native');\n\n        let label = document.createElement('div');\n        label.setAttribute('part', 'file-label');\n        label.classList.add('file-label');\n\n        let fileList = document.createElement('slot');\n        fileList.setAttribute('name', 'item');\n        fileList.setAttribute('part', 'items');\n        fileList.classList.add('file-list');\n\n        let slot = document.createElement('slot');\n        label.appendChild(slot);\n\n        let fileInput = document.createElement('input');\n        fileInput.setAttribute('type', 'file');\n        fileInput.setAttribute('multiple', '');\n        fileInput.setAttribute('style', 'display:none;');\n\n        if (!this.noUploadButton) {\n            let button = document.createElement('wje-button');\n            button.innerText = this.label || this.localizer.translate('wj.file.upload.button');\n            button.setAttribute('part', 'upload-button');\n\n            label.appendChild(button);\n\n            this.button = button;\n        }\n\n        native.appendChild(fileInput);\n        native.appendChild(label);\n        native.appendChild(fileList);\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.fileList = fileList;\n        this.fileInput = fileInput;\n\n        return fragment;\n    }\n\n    /**\n     * Method to perform actions after the component is drawn.\n     */\n    afterDraw() {\n        this.button?.addEventListener('click', () => {\n            this.fileInput.click();\n        });\n\n        this.fileInput.addEventListener('change', this.handleInputChange);\n        this.native.addEventListener('drop', this.handleDrop);\n\n        let dragEventCounter = 0;\n\n        this.native.addEventListener('dragenter', (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        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                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        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=\"${getFileTypeIcon(file.type.split('/')[1])}\" 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"],"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 associated with the category.\n * - `name` {string} The name of the icon representing the category.\n * @example\n * const types = fileType();\n * console.log(types);\n * // [\n * //   { type: [\"jpg\", \"jpeg\", \"png\", \"gif\", \"bpm\", \"tiff\", \"svg\"], name: \"photo\" },\n * //   { type: [\"zip\", \"rar\", \"cab\", \"jar\", \"tar\", \"gzip\", \"uue\", \"bz2\", \"scorm\", \"war\"], name: \"file-type-zip\" },\n * //   ...\n * // ]\n */\nfunction fileType() {\n    return [\n        {\n            type: ['jpg', 'jpeg', 'png', 'gif', 'bpm', 'tiff', 'svg'],\n            name: 'photo',\n        },\n        {\n            type: ['zip', 'rar', 'cab', 'jar', 'tar', 'gzip', 'uue', 'bz2', 'scorm', 'war'],\n            name: 'file-type-zip',\n        },\n        {\n            type: ['mov', 'mp4', 'avi', 'flv'],\n            name: 'video',\n        },\n        {\n            type: ['m4a', 'mp3', 'wav'],\n            name: 'audio',\n        },\n        {\n            type: ['html', 'html'],\n            name: 'file-type-html',\n        },\n        {\n            type: ['css'],\n            name: 'code',\n        },\n        {\n            type: ['txt'],\n            name: 'file-type-txt',\n        },\n        {\n            type: ['doc', 'docx'],\n            name: 'file-type-doc',\n        },\n        {\n            type: ['xls', 'xlsx'],\n            name: 'file-type-xls',\n        },\n        {\n            type: ['pdf'],\n            name: 'file-type-pdf',\n        },\n        {\n            type: ['ppt', 'pptx', 'odp'],\n            name: 'file-type-ppt',\n        },\n    ];\n}\n\n/**\n * Retrieves the icon name for a given file type.\n * @param {string} type The file type or category (e.g., \"pdf\", \"image\", \"folder\").\n * @returns {string} The name of the icon associated with the file type.\n * @example\n * getFileTypeIcon('pdf'); // Returns the icon name for PDF files.\n * getFileTypeIcon('folder'); // Returns 'folder'.\n */\nexport function getFileTypeIcon(type) {\n    let searchType;\n    if (type.toLowerCase() !== 'folder') {\n        fileType().forEach((i) => {\n            if (i.type.includes(type.toLowerCase())) {\n                searchType = i.name;\n            }\n        });\n    } else {\n        searchType = 'folder';\n    }\n\n    return searchType;\n}\n\n/**\n * 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     * 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 [];\n    }\n\n    /**\n     * Method to setup attributes for the component.\n     */\n    setupAttributes() {\n        this.isShadowRoot = 'open';\n    }\n\n    beforeDraw() {\n        this.uploadFunction = upload(this.uploadUrl, this.chunkSize, !this.toChunk);\n    }\n\n    /**\n     * Method to draw the component on the screen.\n     * @returns {DocumentFragment} The fragment containing the component.\n     */\n    draw() {\n        let fragment = document.createDocumentFragment();\n\n        let native = document.createElement('div');\n        native.classList.add('native-file-upload');\n        native.setAttribute('part', 'native');\n\n        let label = document.createElement('div');\n        label.setAttribute('part', 'file-label');\n        label.classList.add('file-label');\n\n        let fileList = document.createElement('slot');\n        fileList.setAttribute('name', 'item');\n        fileList.setAttribute('part', 'items');\n        fileList.classList.add('file-list');\n\n        let slot = document.createElement('slot');\n        label.appendChild(slot);\n\n        let fileInput = document.createElement('input');\n        fileInput.setAttribute('type', 'file');\n        fileInput.setAttribute('multiple', '');\n        fileInput.setAttribute('style', 'display:none;');\n\n        if (!this.noUploadButton) {\n            let button = document.createElement('wje-button');\n            button.innerText = this.label || this.localizer.translate('wj.file.upload.button');\n            button.setAttribute('part', 'upload-button');\n\n            label.appendChild(button);\n\n            this.button = button;\n        }\n\n        native.appendChild(fileInput);\n        native.appendChild(label);\n        native.appendChild(fileList);\n\n        fragment.appendChild(native);\n\n        this.native = native;\n        this.fileList = fileList;\n        this.fileInput = fileInput;\n\n        return fragment;\n    }\n\n    /**\n     * Method to perform actions after the component is drawn.\n     */\n    afterDraw() {\n        this.button?.addEventListener('click', () => {\n            this.fileInput.click();\n        });\n\n        this.fileInput.addEventListener('change', this.handleInputChange);\n        this.native.addEventListener('drop', this.handleDrop);\n\n        let dragEventCounter = 0;\n\n        this.native.addEventListener('dragenter', (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        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        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=\"${getFileTypeIcon(file.type.split('/')[1])}\" 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"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "wj-elements",
   "description": "WebJET Elements is a modern set of user interface tools harnessing the power of web components designed to simplify web application development.",
-  "version": "0.2.0-alpha.10",
+  "version": "0.2.0-alpha.12",
   "homepage": "https://github.com/lencys/wj-elements",
   "author": "Lukáš Ondrejček <lukas.ondrejcek@gmail.com>",
   "license": "MIT",