@spw-ds/spw-stencil-library 1.14.1 → 1.14.2

package/dist/collection/components/spw-drawer/spw-drawer.js

@@ -0,0 +1,507 @@
+import { Host, h } from "@stencil/core";
+import { queryShadowRoot, isHidden, isFocusable } from "../../utils/focus-trap";
+import { animationTo } from "../../utils/animation";
+const SLIDE_KEYFRAMES = {
+    left: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(-100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(-100%)' },
+        ],
+    },
+    right: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateX(100%)' },
+        ],
+    },
+    top: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(-100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(-100%)' },
+        ],
+    },
+    bottom: {
+        open: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(100%)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+        ],
+        close: [
+            { offset: 0, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(0)' },
+            { offset: 1, easing: 'cubic-bezier(0.390, 0.575, 0.565, 1.000)', transform: 'translateY(100%)' },
+        ],
+    },
+};
+export class SpwDrawer {
+    constructor() {
+        /** Indique si le drawer est ouvert ou fermé, mutable et reflété dans le DOM */
+        this.opened = false;
+        this.showDrawer = this.opened || false;
+        /** Titre du drawer */
+        this.caption = 'Titre du drawer';
+        /** Texte du bouton de fermeture */
+        this.closeButtonText = 'Fermer';
+        /** Indique si la fermeture du drawer est possible en cliquant sur l'overlay */
+        this.closeOnOverlayClick = true;
+        /** Position du drawer : 'left', 'right', 'top' ou 'bottom' */
+        this.position = 'right';
+        /** Taille du drawer (largeur pour left/right) : 'small', 'medium', 'large' ou 'full' */
+        this.size = 'medium';
+        /** Indique si le bouton de fermeture est visible */
+        this.showCloseButton = true;
+        /** Indique si le titre est visible */
+        this.showCaption = true;
+        /** Indique si l'overlay (fond sombre) est visible */
+        this.modal = true;
+        this.slotFooterPresent = false;
+        this.focusableElements = [];
+        this.handleTriggerClick = (event) => {
+            const path = event.composedPath();
+            const trigger = path.find(el => { var _a; return el instanceof HTMLElement && ((_a = el.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(el, 'data-drawer-trigger')); });
+            if (trigger) {
+                const drawerId = trigger.getAttribute('data-drawer-trigger');
+                if (drawerId === this.hostElement.id) {
+                    this.opened = true;
+                }
+            }
+        };
+        this.handleCloseAttribute = (event) => {
+            const path = event.composedPath();
+            const trigger = path.find(el => { var _a; return el instanceof HTMLElement && ((_a = el.hasAttribute) === null || _a === void 0 ? void 0 : _a.call(el, 'data-drawer-close')); });
+            if (trigger) {
+                const drawerId = trigger.getAttribute('data-drawer-close');
+                if (drawerId === this.hostElement.id) {
+                    this.opened = false;
+                }
+            }
+        };
+        this.handleKeypress = (event) => {
+            if (this.showDrawer && event.key === 'Escape') {
+                this.doBeforeClose('ESCAPE_KEY');
+            }
+        };
+        this.handleBottomFocus = () => {
+            this.attemptFocus(this.getFirstFocusableElement());
+        };
+    }
+    /**
+     * Méthode publique pour ouvrir le drawer programmatiquement
+     */
+    async openDrawer() {
+        this.opened = true;
+    }
+    /**
+     * Méthode publique pour fermer le drawer programmatiquement
+     */
+    async closeDrawer() {
+        this.doBeforeClose('PROGRAMMATIC');
+    }
+    componentDidLoad() {
+        this.focusableElements = queryShadowRoot(this.hostElement.shadowRoot, el => isHidden(el) || el.matches('[data-focus-trap-edge]'), isFocusable);
+        window.addEventListener('click', this.handleTriggerClick, { capture: true });
+        window.addEventListener('click', this.handleCloseAttribute, { capture: true });
+        window.addEventListener('keydown', this.handleKeypress);
+    }
+    disconnectedCallback() {
+        window.removeEventListener('click', this.handleTriggerClick);
+        window.removeEventListener('click', this.handleCloseAttribute);
+        window.removeEventListener('keydown', this.handleKeypress);
+    }
+    getFirstFocusableElement() {
+        return this.focusableElements[0];
+    }
+    attemptFocus(element) {
+        if (element == null) {
+            setTimeout(() => {
+                var _a;
+                (_a = this.closeButtonEl) === null || _a === void 0 ? void 0 : _a.focus();
+            });
+            return;
+        }
+        setTimeout(() => {
+            element.focus();
+        }, 0);
+    }
+    getSiblings() {
+        const parent = this.hostElement.parentElement;
+        if (!parent)
+            return [];
+        return Array.from(parent.children).filter(el => el !== this.hostElement);
+    }
+    setInert(inert) {
+        this.getSiblings().forEach(el => {
+            if (inert) {
+                el.setAttribute('inert', '');
+            }
+            else {
+                el.removeAttribute('inert');
+            }
+        });
+    }
+    open() {
+        this.showDrawer = true;
+        this.setInert(true);
+        requestAnimationFrame(() => {
+            if (this.drawerContent) {
+                this.drawerContent.scrollTop = 0;
+            }
+        });
+        try {
+            const keyframes = SLIDE_KEYFRAMES[this.position];
+            const anim = animationTo(this.drawerPanel, keyframes.open, { duration: 250 });
+            anim.addEventListener('finish', () => {
+                this.attemptFocus(this.getFirstFocusableElement());
+                this.spwDrawerOpen.emit();
+            });
+        }
+        catch (err) {
+            this.attemptFocus(this.getFirstFocusableElement());
+            this.spwDrawerOpen.emit();
+        }
+    }
+    close() {
+        this.setInert(false);
+        try {
+            const keyframes = SLIDE_KEYFRAMES[this.position];
+            const anim = animationTo(this.drawerPanel, keyframes.close, { duration: 250 });
+            anim.addEventListener('finish', () => {
+                this.showDrawer = false;
+                this.spwDrawerClose.emit();
+            });
+        }
+        catch (err) {
+            this.showDrawer = false;
+            this.spwDrawerClose.emit();
+        }
+    }
+    openedChanged(newValue) {
+        newValue === true ? this.open() : this.close();
+    }
+    handleOverlayClick() {
+        if (this.closeOnOverlayClick) {
+            this.doBeforeClose('BACKDROP');
+        }
+    }
+    doBeforeClose(trigger) {
+        const triggers = [];
+        triggers.push(trigger);
+        const prevented = triggers.some((event) => event.defaultPrevented);
+        if (!prevented) {
+            this.opened = false;
+        }
+    }
+    get containerClass() {
+        return {
+            'spw-drawer': true,
+            'spw-drawer--opened': this.showDrawer,
+            [`spw-drawer--${this.position}`]: true,
+        };
+    }
+    get panelClass() {
+        return {
+            'spw-drawer__panel': true,
+            [`spw-drawer__panel--${this.size}`]: true,
+            [`spw-drawer__panel--${this.position}`]: true,
+        };
+    }
+    render() {
+        return (h(Host, { key: '1884a1b336c6eb2d225277379c005daf7530be6f' }, h("div", { key: '95a7e553242502ad92d70d468cfd69738b27d950', class: this.containerClass }, this.modal && h("div", { key: '68ad5a5c2406036e36a3c22819e7e946dc9abfb9', class: "spw-drawer__overlay", onClick: () => this.handleOverlayClick() }), h("div", { key: 'f3631ae7ddcfd2eeae47f92973d54fea7d2dfc31', ref: el => (this.drawerPanel = el), class: this.panelClass, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, h("div", { key: '3da8046661146882ae1322258dec72d68ba10377', class: "spw-drawer__header" }, this.showCaption && h("h2", { key: 'f4a555d0408adb2febc9c30e3d09ac633f7a24e2', class: "spw-drawer__caption" }, this.caption), this.showCloseButton && (h("div", { key: 'd707889f78f1c13f342771a47f9817bdc852f559', class: "spw-drawer__close-button", ref: el => (this.closeButtonEl = el), tabindex: "0", role: "button", onClick: () => this.doBeforeClose('CLOSE_BUTTON'), onKeyDown: (e) => (e.key === 'Enter' || e.key === ' ') && this.doBeforeClose('CLOSE_BUTTON') }, h("spw-link", { key: 'e64251421e038ecbd06e13b18b95e4c2eb91209e', "icon-position": "right", icon: "fa-xmark" }, this.closeButtonText)))), h("div", { key: 'd6ae0d5c001a0955f102db7d05f44fcfccd8e852', class: "spw-drawer__body", ref: el => (this.drawerContent = el) }, h("slot", { key: 'c504f66f8bdf8201cd89add6d2be6564cf463def', name: "content" })), h("div", { key: 'c48a0840f77d49aa32d509fe8cb5d664019bf323', class: {
+                'spw-drawer__footer': true,
+                'spw-drawer__footer--present': this.slotFooterPresent,
+            } }, h("slot", { key: 'dd720c1c5d968a07028bc847ec3f2237fbf6a63c', name: "footer", onSlotchange: (e) => {
+                const slot = e.target;
+                this.slotFooterPresent = slot.assignedNodes({ flatten: true }).length > 0;
+            } }))), h("div", { key: '7b5c33d211b0555de269c69da4a4136d631ba624', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
+    }
+    static get is() { return "spw-drawer"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["spw-drawer.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["spw-drawer.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "opened": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si le drawer est ouvert ou ferm\u00E9, mutable et refl\u00E9t\u00E9 dans le DOM"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "opened",
+                "defaultValue": "false"
+            },
+            "caption": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Titre du drawer"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "caption",
+                "defaultValue": "'Titre du drawer'"
+            },
+            "closeButtonText": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Texte du bouton de fermeture"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "close-button-text",
+                "defaultValue": "'Fermer'"
+            },
+            "closeOnOverlayClick": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si la fermeture du drawer est possible en cliquant sur l'overlay"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "close-on-overlay-click",
+                "defaultValue": "true"
+            },
+            "position": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'left' | 'right' | 'top' | 'bottom'",
+                    "resolved": "\"bottom\" | \"left\" | \"right\" | \"top\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Position du drawer : 'left', 'right', 'top' ou 'bottom'"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "position",
+                "defaultValue": "'right'"
+            },
+            "size": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'small' | 'medium' | 'large' | 'full'",
+                    "resolved": "\"full\" | \"large\" | \"medium\" | \"small\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Taille du drawer (largeur pour left/right) : 'small', 'medium', 'large' ou 'full'"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "size",
+                "defaultValue": "'medium'"
+            },
+            "showCloseButton": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si le bouton de fermeture est visible"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-close-button",
+                "defaultValue": "true"
+            },
+            "showCaption": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si le titre est visible"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "show-caption",
+                "defaultValue": "true"
+            },
+            "modal": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indique si l'overlay (fond sombre) est visible"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "modal",
+                "defaultValue": "true"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "showDrawer": {},
+            "slotFooterPresent": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "spwDrawerOpen",
+                "name": "spwDrawerOpen",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u00C9v\u00E9nement d\u00E9clench\u00E9 lors de l'ouverture du drawer"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }, {
+                "method": "spwDrawerClose",
+                "name": "spwDrawerClose",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u00C9v\u00E9nement d\u00E9clench\u00E9 lors de la fermeture du drawer"
+                },
+                "complexType": {
+                    "original": "any",
+                    "resolved": "any",
+                    "references": {}
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "openDrawer": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "M\u00E9thode publique pour ouvrir le drawer programmatiquement",
+                    "tags": []
+                }
+            },
+            "closeDrawer": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "M\u00E9thode publique pour fermer le drawer programmatiquement",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "hostElement"; }
+    static get watchers() {
+        return [{
+                "propName": "opened",
+                "methodName": "openedChanged"
+            }];
+    }
+}

package/dist/collection/components/spw-dropdown/spw-dropdown-container/spw-dropdown-container.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class SpwDropdownContainer {
     render() {
-        return (h(Host, { key: '79dc2cc099719ae4705b6b17fa914f137145bbf4' }, h("div", { key: 'e91b67898f25f782a67681a03c5a7ab6c2ed58a1', class: "spw-dropdown-container" }, h("slot", { key: 'c3ddaa4ae9f44d5e90cd1e26d93297935910be85' }))));
+        return (h(Host, { key: '48d874f662c7ecf665c4fd8e0bd8b426e7289c87' }, h("div", { key: '0cc824dad665cb14da6b12e3b24090ff315cf0fe', class: "spw-dropdown-container" }, h("slot", { key: 'f8a4c2f3e66128a94deda7b5f00a15949299d8f2' }))));
     }
     static get is() { return "spw-dropdown-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-dropdown/spw-dropdown-item/spw-dropdown-item.js

@@ -83,7 +83,7 @@ export class SpwDropdownItem {
             'spw-dropdown-item__toggle': true,
             'spw-dropdown-item__toggle--open': this.subItemsOpen,
         };
-        return (h(Host, { key: '9972c17813e0f7be9d07188a6a6596fc5f3e9b75' }, h(Tag, { key: '9048817b668d6f9ea4294f327af676b2128b2632', class: this.classes, href: this.href, "aria-disabled": this.disabled ? 'true' : undefined, role: "menuitem", tabindex: this.disabled ? -1 : 0, onClick: this.handleItemClick, onKeyDown: this.handleItemKeyDown }, this.icon && (h("div", { key: 'a43132e6f697d77849d158164bcdbe783b56ab21', class: "spw-dropdown-item__icon" }, h("spw-icon", { key: '5c8643b3c22b79c1a665c420edb9529453699341', variant: this.iconVariant, icon: this.icon }))), h("div", { key: '65db2295b5086d4e342234a336251ec282b9eebc', class: "spw-dropdown-item__content" }, h("div", { key: '54d0059dd24a51a136b0afee730cea8c25f02ecb', class: "spw-dropdown-item__label" }, h("slot", { key: '4e992a877d20ec0b84c83a8f5786eec8301a1e63' })), this.hasSubItems && (h("div", { key: 'f8a34e4a575ae202670cb86ec3095e0b7b717ed2', class: toggleClasses, onClick: this.handleToggleSubItems }, h("spw-icon", { key: '44593757e5e18c481ed0faab171adaf6129e29fe', icon: "fa-chevron-down" }))))), this.hasSubItems && (h("div", { key: 'fde76f69a90e770c732899d326c4880915b0baa7', class: "spw-dropdown-item__sub-items", style: { display: this.subItemsOpen ? 'block' : 'none' } }, h("slot", { key: '2b1f6087cd1063dd3a028b9ba2f091702f960290', name: "sub-items" })))));
+        return (h(Host, { key: '77c0018164181046d760a1b6442e7428683043a3' }, h(Tag, { key: 'bbfce979bcd7984df8e98322200d41ad646a3929', class: this.classes, href: this.href, "aria-disabled": this.disabled ? 'true' : undefined, role: "menuitem", tabindex: this.disabled ? -1 : 0, onClick: this.handleItemClick, onKeyDown: this.handleItemKeyDown }, this.icon && (h("div", { key: '66bfddabf7f2b4cbeb47374ab20b36af04c6ba36', class: "spw-dropdown-item__icon" }, h("spw-icon", { key: 'ab7379b23b55ee580f172c9753de20f293fba609', variant: this.iconVariant, icon: this.icon }))), h("div", { key: '8c00965f636f69b33bbc9a70e7226e2ca3a46b05', class: "spw-dropdown-item__content" }, h("div", { key: 'd3fcee523706d6d17485c41f08a7a60ebbbf0016', class: "spw-dropdown-item__label" }, h("slot", { key: '4b5f86480f72daa0a73b4464bb81674b914f9c7f' })), this.hasSubItems && (h("div", { key: 'feab6bd1e1b716f9e67539dee9e10044e2bf56ca', class: toggleClasses, onClick: this.handleToggleSubItems }, h("spw-icon", { key: '3b09c91ff1625cf4c7057035f9462cdeda451a57', icon: "fa-chevron-down" }))))), this.hasSubItems && (h("div", { key: '151bd6199199c1ecb99a8c757e4a963020229c3b', class: "spw-dropdown-item__sub-items", style: { display: this.subItemsOpen ? 'block' : 'none' } }, h("slot", { key: '369f2b8c03221c05a42d4ad24df5cddb66f0421f', name: "sub-items" })))));
     }
     static get is() { return "spw-dropdown-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/spw-dropdown/spw-dropdown.js

@@ -228,7 +228,7 @@ export class SpwDropdown {
         dropdown.style.visibility = 'visible';
     }
     render() {
-        return (h("div", { key: '9436b4657389ba587830dcc8f7dc9f13aa33ef0a', class: "spw-dropdown__trigger", onClick: () => (this.open = !this.open), "aria-expanded": this.open ? 'true' : 'false', "aria-haspopup": "menu" }, h("slot", { key: '3abcf24a43d046fde173ffe2ac73d376cf78ec6e' })));
+        return (h("div", { key: '6705afef902fe813cd774240f0f035e0f3815e1f', class: "spw-dropdown__trigger", onClick: () => (this.open = !this.open), "aria-expanded": this.open ? 'true' : 'false', "aria-haspopup": "menu" }, h("slot", { key: '7534de2442b031fa671364bb5a5459f9eb2d1875' })));
     }
     static get is() { return "spw-dropdown"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-field-label/spw-field-label.js

@@ -21,7 +21,7 @@ export class SpwFieldLabel {
         return !!(this.tooltipText || this.tooltipTitle);
     }
     render() {
-        return (h(Host, { key: 'cb454d092cd78fb71bf1167a4e387ad9fd416d69' }, h("label", { key: '641218aa7a026e9dd5805d51926b88ae94692926', class: "spw-field-label", htmlFor: this.name, onClick: this.handleClick }, h("span", { key: '53de42be7abcc40b2418489bc13bcd449dcb342f', class: "spw-field-label__text" }, this.label), this.hasTooltip && (h("spw-tooltip", { key: 'c1f0fdbb0e3742a3f303846b89078a727d69bc04', tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, maxWidth: this.tooltipMaxWidth, direction: this.tooltipDirection, cursor: this.tooltipCursor }, h("spw-icon", { key: '01b65ea5af7cbf012902ee0b9d50bede9451d0aa', variant: "fa-regular", icon: "fa-circle-info", class: "spw-field-label__icon" }))), this.required && h("span", { key: '5eb8fd2d808a54133da51de5eaa7f7277d08c393', class: "spw-field-label__required" }, "*"))));
+        return (h(Host, { key: '76ae81158304b7f866203868a1cbdc7ca25eaec7' }, h("label", { key: '76885e88c2754d5a72a82c560701686ef379699d', class: "spw-field-label", htmlFor: this.name, onClick: this.handleClick }, h("span", { key: 'fc3148fa7ca0bbb4545efd808d7b5bb32341415a', class: "spw-field-label__text" }, this.label), this.hasTooltip && (h("spw-tooltip", { key: 'b4b74142f95e973bfd5962b0bde2ab8454b31ffc', tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, maxWidth: this.tooltipMaxWidth, direction: this.tooltipDirection, cursor: this.tooltipCursor }, h("spw-icon", { key: '9265151c1e8fb4df1bb37cd581a92fc599988aab', variant: "fa-regular", icon: "fa-circle-info", class: "spw-field-label__icon" }))), this.required && h("span", { key: '949b7b0959cae8f7ba1eef634c732af8049ad7ac', class: "spw-field-label__required" }, "*"))));
     }
     static get is() { return "spw-field-label"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-field-message/spw-field-message.js

@@ -25,7 +25,7 @@ export class SpwFieldMessage {
         };
     }
     render() {
-        return (h(Host, { key: 'c37e4fcd1a62f74a582ea34b5ad35405d1fdfe15' }, h("div", { key: 'dec558441b64aaaba6fd7ce8501be8c674ade97d', class: this.elementClass }, this.showIcon && (h("div", { key: '867ccb3a82414bc19f8f0e59857b879d615f2d69', class: "spw-field-message__icon" }, h("spw-icon", { key: '2fde1c1acdcbe924bf3448355a17433540ff6a59', icon: this.variantIcon }))), h("span", { key: '0c9b68f44ec54d00aa6ee52b007a3c34e721ebdc', class: "spw-field-message__text" }, h("slot", { key: 'f2fb8c461e7b9b81d5b8a96a2fbcdf3373e66aea' })))));
+        return (h(Host, { key: 'fd1aac2d7b1d801d9cce01b064807cddb9fd4079' }, h("div", { key: 'd8a255c0adb6b038cefaaebd9a227bf73338a5b7', class: this.elementClass }, this.showIcon && (h("div", { key: '61a5d17d3c4599cfcdc5e5e38474f177bd928569', class: "spw-field-message__icon" }, h("spw-icon", { key: '007903bb65b6795494ad591cce8e3c77e49b0514', icon: this.variantIcon }))), h("span", { key: '87ee6842c805bc3c7964fb97201118a2da85caa8', class: "spw-field-message__text" }, h("slot", { key: 'e80d8091ceeae38262698160ff1b5d89a0bb8cf5' })))));
     }
     static get is() { return "spw-field-message"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-file-upload/spw-file-upload.js

@@ -252,10 +252,10 @@ export class SpwFileUpload {
     render() {
         const inputTextNoDrop = this.multiple ? this.textChooseFiles : this.textChooseFile;
         const inputTextDrop = this.multiple ? this.textDropFiles : this.textDropFile;
-        return (h("div", { key: '095815bbee9c872183a2341238301ac432ce869d', class: this.elementClass, onDragOver: this.handleDragOver.bind(this), onDragLeave: this.handleDragLeave.bind(this), onDrop: this.handleDrop.bind(this) }, h("input", { key: '726cfe005146924eaf46928a526d82e82ddab1c3', type: "file", ref: el => (this.inputElement = el), onChange: this.handleFileChange.bind(this), name: this.name, multiple: this.multiple, accept: this.accept, style: { display: 'none' }, disabled: this.isMaxFilesReached }), this.enableDropZone ? (h("div", { tabindex: this.disabled || this.isMaxFilesReached ? -1 : 0, onKeyDown: this.handleKeydown.bind(this), onClick: () => !this.disabled && !this.isMaxFilesReached && this.inputElement.click(), class: "spw-file-upload__dropzone" }, inputTextDrop, " ", h("span", { class: "spw-file-upload__dropzone-link" }, this.textChooseFromComputer))) : (h("spw-button", { variant: "secondary", onClick: () => !this.disabled && !this.isMaxFilesReached && this.inputElement.click(), disabled: this.disabled || this.isMaxFilesReached }, inputTextNoDrop)), h("div", { key: 'a6a12a7dc2df2f202897002c1f1feab51557700f', class: "spw-file-upload__hints" }, this.hintsMessages.length > 0 && (h("ul", { key: '1d9643b6214b0d4b312a16f4a91ee063b96de380' }, this.hintsMessages.map((message, index) => (h("li", { key: index }, message)))))), h("div", { key: 'e98776cde22505ae8d1ffe0016ed205544031c9b', class: "spw-file-upload__info" }, this.selectedFiles.length > 0 ? (h("ul", { class: "spw-file-upload__info-list" }, this.selectedFiles.map((file, index) => (h("li", { key: index }, h("span", { class: "spw-file-upload__info-list-name" }, file.name), h("div", { class: "spw-file-upload__info-list-actions" }, h("span", { class: "spw-file-upload__spacing" }, formatFileSize(file.size)), h("a", { class: "spw-file-upload__info-list-delete", href: "#", onClick: e => {
+        return (h("div", { key: 'a9bc1ff13714fdede9c180e695e5e13c5b340664', class: this.elementClass, onDragOver: this.handleDragOver.bind(this), onDragLeave: this.handleDragLeave.bind(this), onDrop: this.handleDrop.bind(this) }, h("input", { key: '9356170f44fc7d87b640877c5b6fd2f0395e859e', type: "file", ref: el => (this.inputElement = el), onChange: this.handleFileChange.bind(this), name: this.name, multiple: this.multiple, accept: this.accept, style: { display: 'none' }, disabled: this.isMaxFilesReached }), this.enableDropZone ? (h("div", { tabindex: this.disabled || this.isMaxFilesReached ? -1 : 0, onKeyDown: this.handleKeydown.bind(this), onClick: () => !this.disabled && !this.isMaxFilesReached && this.inputElement.click(), class: "spw-file-upload__dropzone" }, inputTextDrop, " ", h("span", { class: "spw-file-upload__dropzone-link" }, this.textChooseFromComputer))) : (h("spw-button", { variant: "secondary", onClick: () => !this.disabled && !this.isMaxFilesReached && this.inputElement.click(), disabled: this.disabled || this.isMaxFilesReached }, inputTextNoDrop)), h("div", { key: 'aa8214d48fa23b98b8283f532d3f1c42fd3a84a5', class: "spw-file-upload__hints" }, this.hintsMessages.length > 0 && (h("ul", { key: '9fc657196da95335098c4a802db420752cf23027' }, this.hintsMessages.map((message, index) => (h("li", { key: index }, message)))))), h("div", { key: '8038c8f9ea2b8cf34c1fc02aae309fb1b776a717', class: "spw-file-upload__info" }, this.selectedFiles.length > 0 ? (h("ul", { class: "spw-file-upload__info-list" }, this.selectedFiles.map((file, index) => (h("li", { key: index }, h("span", { class: "spw-file-upload__info-list-name" }, file.name), h("div", { class: "spw-file-upload__info-list-actions" }, h("span", { class: "spw-file-upload__spacing" }, formatFileSize(file.size)), h("a", { class: "spw-file-upload__info-list-delete", href: "#", onClick: e => {
                 e.preventDefault();
                 this.removeFile(index);
-            } }, this.textDelete))))))) : (''), this.fileLimitErrors.length > 0 && (h("ul", { key: '87d3841b82f412458d986ec97a6d6636a1f038d1', class: `spw-file-upload__errors ${this.isMaxFilesReachedExact ? 'spw-file-upload__errors--warning' : ''}` }, this.fileLimitErrors.map((message, index) => (h("li", { key: index }, h("spw-icon", { class: "spw-file-upload__spacing", icon: this.isMaxFilesReachedExact ? 'fa-circle-exclamation' : 'fa-warning' }), message))))), this.fileTypeErrors.length > 0 && (h("ul", { key: '5878e2f09ff3249386fe3d3d68a4ac79b2f05868', class: "spw-file-upload__errors" }, this.fileTypeErrors.map((message, index) => (h("li", { key: index }, h("spw-icon", { class: "spw-file-upload__spacing", icon: "fa-warning" }), message))))))));
+            } }, this.textDelete))))))) : (''), this.fileLimitErrors.length > 0 && (h("ul", { key: '76f54fe38944f06415298032f868eb11b8aeba47', class: `spw-file-upload__errors ${this.isMaxFilesReachedExact ? 'spw-file-upload__errors--warning' : ''}` }, this.fileLimitErrors.map((message, index) => (h("li", { key: index }, h("spw-icon", { class: "spw-file-upload__spacing", icon: this.isMaxFilesReachedExact ? 'fa-circle-exclamation' : 'fa-warning' }), message))))), this.fileTypeErrors.length > 0 && (h("ul", { key: 'c36238b7e7751850b3065b2f53f5410c2bc73318', class: "spw-file-upload__errors" }, this.fileTypeErrors.map((message, index) => (h("li", { key: index }, h("spw-icon", { class: "spw-file-upload__spacing", icon: "fa-warning" }), message))))))));
     }
     static get is() { return "spw-file-upload"; }
     static get encapsulation() { return "shadow"; }