@spw-ds/spw-stencil-library 1.16.0 → 1.17.0

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

@@ -12,11 +12,20 @@ export class SpwSidenavItem {
         this.hasChildren = false;
         this.childrenOpen = false;
         this.hasActiveChild = false;
+        this.mobileFocused = false;
         this.handleChevronClick = (e) => {
             e.preventDefault();
             e.stopPropagation();
             if (this.disabled)
                 return;
+            if (window.matchMedia('(max-width: 767px)').matches) {
+                this.el.dispatchEvent(new CustomEvent('spwMobileFocusRequest', {
+                    detail: { item: this.el },
+                    bubbles: true,
+                    composed: true,
+                }));
+                return;
+            }
             this.toggleGroup();
         };
         this.handleLabelClick = (e) => {
@@ -125,21 +134,26 @@ export class SpwSidenavItem {
             this.childrenOpen = false;
         }
     }
+    /** Utilisé par spw-sidenav pour focaliser cet item en mobile */
+    async setMobileFocus(value) {
+        this.mobileFocused = value;
+    }
     get isLink() {
         return !!this.href && !this.disabled && !this.openOnClick;
     }
     render() {
         const LabelTag = this.isLink ? 'a' : 'button';
-        return (h(Host, { key: '7ce11484152ad8cd4139bd3493aae972e30789fd' }, h("div", { key: 'aae075da414f38a73015233033376d1deb53fc51', class: {
+        return (h(Host, { key: '17607fea24545b9b75737d89a04f23bfd770c470' }, h("div", { key: 'b35c32d3848704761a361422d53d6c7f541c1c98', class: {
                 'spw-sidenav-item': true,
                 'spw-sidenav-item--active': this.active || this.hasActiveChild,
                 'spw-sidenav-item--disabled': this.disabled,
                 'spw-sidenav-item--has-children': this.hasChildren,
                 'spw-sidenav-item--children-open': this.childrenOpen,
-            } }, h("div", { key: '4155f5d5b8b58a6a8f2b0c09dbbb48dbf2a31510', class: "spw-sidenav-item__row" }, h(LabelTag, { key: '8422b15196e1874bfbe1af698bae06efb60d09bb', class: "spw-sidenav-item__label", href: this.isLink ? this.href : undefined, disabled: LabelTag === 'button' && this.disabled ? true : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-expanded": this.hasChildren ? this.childrenOpen.toString() : undefined, "aria-current": this.active ? 'page' : undefined, onClick: this.handleLabelClick }, this.icon && (h("span", { key: 'b53dad8f63925f1ade16e34a10909f3dc8d7230f', class: "spw-sidenav-item__icon" }, h("spw-icon", { key: '25b441c95d6a66fba855ca8f726252f74bc91b04', variant: this.iconVariant, icon: this.icon }))), h("span", { key: 'c1c0557e37cf76445427dcd6b0648cbcb8b68e9a', class: "spw-sidenav-item__text" }, h("slot", { key: 'c1d9269d0b07e0814588ba20ce0d2fedf3ed4d0c' }))), this.hasChildren && (h("button", { key: '7003cc5fac5b859a6814d9aa2d0bdbcf42d4ab7d', type: "button", class: {
+                'spw-sidenav-item--mobile-focused': this.mobileFocused,
+            } }, h("div", { key: 'fb937b1690063919eb303816ddf66ea6fefa5cd1', class: "spw-sidenav-item__row" }, h(LabelTag, { key: '6288f1a598107aa27a7fee5fcec30cf521792933', class: "spw-sidenav-item__label", href: this.isLink ? this.href : undefined, disabled: LabelTag === 'button' && this.disabled ? true : undefined, "aria-disabled": this.disabled ? 'true' : undefined, "aria-expanded": this.hasChildren ? this.childrenOpen.toString() : undefined, "aria-current": this.active ? 'page' : undefined, onClick: this.handleLabelClick }, this.icon && (h("span", { key: 'd4e427cb15f5b019a0ad4fe5373ec61faf415949', class: "spw-sidenav-item__icon" }, h("spw-icon", { key: '065d165607922c9d33f5300a72eaaa2c38e75d7e', variant: this.iconVariant, icon: this.icon }))), h("span", { key: 'f89a8915244e9346c0edef997c1277bd10c8c18c', class: "spw-sidenav-item__text" }, h("slot", { key: '97152c49d15ef22ba48b3d0a6d98d02a62f7a7fc' }))), this.hasChildren && (h("button", { key: '5ef0937493a17b9f09741fd15a2ade6d6ce0f0da', type: "button", class: {
                 'spw-sidenav-item__chevron': true,
                 'spw-sidenav-item__chevron--open': this.childrenOpen,
-            }, "aria-label": this.childrenOpen ? 'Réduire' : 'Développer', disabled: this.disabled, onClick: this.handleChevronClick }, h("spw-icon", { key: 'ade031d1c331c21f32513de8354a9a651479d308', icon: "fa-chevron-down" })))), h("slot", { key: '3a03696d3d8c10576f41624c7a28a11407a3f75d', name: "children" }))));
+            }, "aria-label": this.childrenOpen ? 'Réduire' : 'Développer', disabled: this.disabled, onClick: this.handleChevronClick }, h("spw-icon", { key: '42a4b347a3354c51af6f2b7fecd95d262721d2a7', icon: "fa-chevron-down" })))), h("slot", { key: 'e0627c82022966740d540a35854a74ddba926ad6', name: "children" }))));
     }
     static get is() { return "spw-sidenav-item"; }
     static get originalStyleUrls() {
@@ -278,7 +292,8 @@ export class SpwSidenavItem {
         return {
             "hasChildren": {},
             "childrenOpen": {},
-            "hasActiveChild": {}
+            "hasActiveChild": {},
+            "mobileFocused": {}
         };
     }
     static get methods() {
@@ -316,6 +331,27 @@ export class SpwSidenavItem {
                     "text": "Ferme les enfants",
                     "tags": []
                 }
+            },
+            "setMobileFocus": {
+                "complexType": {
+                    "signature": "(value: boolean) => Promise<void>",
+                    "parameters": [{
+                            "name": "value",
+                            "type": "boolean",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Utilis\u00E9 par spw-sidenav pour focaliser cet item en mobile",
+                    "tags": []
+                }
             }
         };
     }

package/dist/collection/components/spw-sidenav/spw-sidenav.css

@@ -367,4 +367,37 @@ template {
 .spw-sidenav {
   display: flex;
   flex-direction: column;
+}
+.spw-sidenav__back {
+  display: inline-flex;
+  align-items: center;
+  gap: 8px;
+  align-self: flex-start;
+  padding: 8px 0;
+  margin-bottom: 4px;
+  border: none;
+  background: none;
+  cursor: pointer;
+  font-size: 14px;
+  font-family: inherit;
+  color: var(--spw-colors-support-grey-grey-600);
+  transition: color 0.15s ease;
+}
+.spw-sidenav__back:hover {
+  color: var(--spw-ds-primary);
+}
+.spw-sidenav__back:focus-visible {
+  outline: 3px solid black;
+  outline-offset: 2px;
+  border-radius: 4px;
+}
+.spw-sidenav__back spw-icon {
+  font-size: 12px;
+}
+.spw-sidenav__section-title {
+  font-size: 18px;
+  font-weight: 700;
+  color: var(--spw-colors-support-grey-grey-900);
+  padding: 8px 0;
+  margin-bottom: 4px;
 }

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

@@ -1,12 +1,123 @@
 import { Host, h } from "@stencil/core";
 export class SpwSidenav {
+    constructor() {
+        /** Texte du bouton retour affiché en mobile lors de la navigation dans l'arborescence (fallback quand aucun parent n'a de label) */
+        this.mobileBackLabel = 'Retour';
+        this.focusedItem = null;
+        this.isMobile = false;
+        this.showRoot = false;
+        this.mediaListener = () => this.updateBreakpoint();
+        this.handleBack = () => {
+            const target = this.getCurrentTarget();
+            if (!target)
+                return;
+            const parent = this.getParentItem(target);
+            this.clearFocus();
+            if (parent) {
+                this.setFocus(parent);
+            }
+            else {
+                this.showRoot = true;
+            }
+        };
+    }
+    componentDidLoad() {
+        this.mediaQuery = window.matchMedia('(max-width: 767px)');
+        this.mediaQuery.addEventListener('change', this.mediaListener);
+        this.updateBreakpoint();
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.mediaQuery) === null || _a === void 0 ? void 0 : _a.removeEventListener('change', this.mediaListener);
+    }
+    updateBreakpoint() {
+        this.isMobile = this.mediaQuery.matches;
+        if (!this.isMobile) {
+            this.clearFocus();
+            this.showRoot = false;
+        }
+    }
+    handleFocusRequest(e) {
+        this.showRoot = false;
+        this.setFocus(e.detail.item);
+    }
+    clearFocus() {
+        var _a, _b;
+        if (this.focusedItem) {
+            (_b = (_a = this.focusedItem).setMobileFocus) === null || _b === void 0 ? void 0 : _b.call(_a, false);
+            this.focusedItem = null;
+        }
+    }
+    setFocus(item) {
+        var _a, _b;
+        this.clearFocus();
+        (_b = (_a = item).setMobileFocus) === null || _b === void 0 ? void 0 : _b.call(_a, true);
+        this.focusedItem = item;
+    }
+    getParentItem(item) {
+        var _a;
+        return (_a = item.parentElement) === null || _a === void 0 ? void 0 : _a.closest('spw-sidenav-item');
+    }
+    getItemLabel(item) {
+        var _a, _b;
+        const textEl = item.querySelector(':scope > .spw-sidenav-item .spw-sidenav-item__text');
+        return (_b = (_a = textEl === null || textEl === void 0 ? void 0 : textEl.textContent) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
+    }
+    findLeafActive() {
+        const items = Array.from(this.el.querySelectorAll('spw-sidenav-item'));
+        for (const item of items) {
+            const val = item.getAttribute('active');
+            if (val === '' || val === 'true')
+                return item;
+        }
+        return null;
+    }
+    getCurrentTarget() {
+        if (this.focusedItem)
+            return this.focusedItem;
+        const leaf = this.findLeafActive();
+        if (!leaf)
+            return null;
+        return this.getParentItem(leaf);
+    }
     /** Ferme tous les items ouverts */
     async closeAll() {
         const items = this.el.querySelectorAll('spw-sidenav-item');
         items.forEach(item => { var _a; return (_a = item.close) === null || _a === void 0 ? void 0 : _a.call(item); });
     }
+    get backLabel() {
+        if (this.showRoot)
+            return null;
+        const target = this.getCurrentTarget();
+        if (!target)
+            return null;
+        const parent = this.getParentItem(target);
+        if (parent)
+            return this.getItemLabel(parent) || this.mobileBackLabel;
+        return this.mobileBackLabel;
+    }
+    // Titre de la section courante en mobile — c'est le label du target
+    // (l'item dont on affiche les enfants).
+    get sectionTitle() {
+        if (this.showRoot)
+            return null;
+        const target = this.getCurrentTarget();
+        if (!target)
+            return null;
+        return this.getItemLabel(target) || null;
+    }
     render() {
-        return (h(Host, { key: 'c248ceeea7443805b4471b20553fe005a71af44d' }, h("nav", { key: '32ac7857681d12475f5c09d61d21e9c1c0645a00', class: "spw-sidenav" }, h("slot", { key: '0e88515dba47eb47d0db02eb6c7b45fe9e341db9' }))));
+        let showBack = false;
+        let title = null;
+        if (this.isMobile && !this.showRoot) {
+            const target = this.getCurrentTarget();
+            showBack = !!target;
+            title = this.sectionTitle;
+        }
+        return (h(Host, { key: '5162ae79d8fbc5754bed694e6dc9a49197f1decd', "data-show-root": this.showRoot ? 'true' : null }, h("nav", { key: '15a13f2b45e705d2f451d66c3483d7d4c4b0a9d4', class: {
+                'spw-sidenav': true,
+                'spw-sidenav--show-root': this.showRoot,
+            } }, showBack && (h("button", { key: 'b1e9252722cf292e851a24a91dbfb6063e30d592', class: "spw-sidenav__back", type: "button", onClick: this.handleBack }, h("spw-icon", { key: 'd4539634e276aaf5cedffce58a653a1069fbfbfe', icon: "fa-arrow-left" }), h("span", { key: '90f52019e15f5991aa41aa273595ebaa03ff3fb8' }, this.backLabel))), title && h("div", { key: '3b92611317c70878bd4cf4447351881176b7611e', class: "spw-sidenav__section-title" }, title), h("slot", { key: '2d4291c015bf5c4322689868244d449f0dbdf42a' }))));
     }
     static get is() { return "spw-sidenav"; }
     static get encapsulation() { return "shadow"; }
@@ -20,6 +131,37 @@ export class SpwSidenav {
             "$": ["spw-sidenav.css"]
         };
     }
+    static get properties() {
+        return {
+            "mobileBackLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Texte du bouton retour affich\u00E9 en mobile lors de la navigation dans l'arborescence (fallback quand aucun parent n'a de label)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "mobile-back-label",
+                "defaultValue": "'Retour'"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "focusedItem": {},
+            "isMobile": {},
+            "showRoot": {}
+        };
+    }
     static get methods() {
         return {
             "closeAll": {
@@ -46,4 +188,13 @@ export class SpwSidenav {
         };
     }
     static get elementRef() { return "el"; }
+    static get listeners() {
+        return [{
+                "name": "spwMobileFocusRequest",
+                "method": "handleFocusRequest",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
 }

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

@@ -44,7 +44,7 @@ export class SpwSkeleton {
         }
     }
     render() {
-        return (h(Host, { key: 'baf6617e7f6f8d16bc09d9ed86ddfb299a23f94a' }, h("div", { key: '089813b4d4cdeb5d8e9737ed121df936711a8de6', class: "spw-skeleton" }, this.renderVariant(), h("slot", { key: 'bc44a9531c3922c90137cf8110ebcf80cc6f3f16' }))));
+        return (h(Host, { key: '122cd42914b44494633bd055c531072c713e8e91' }, h("div", { key: '2f7e32675363854e4c595059f598154ed1e535a4', class: "spw-skeleton" }, this.renderVariant(), h("slot", { key: '8529d418a3de0d953d519d6cc6308be5c17b9d3f' }))));
     }
     static get is() { return "spw-skeleton"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class SpwSliderItem {
     render() {
-        return (h(Host, { key: 'c1227e735448eaea0fa907b30fcefb1c707be454' }, h("div", { key: '276be5b2365d43ae37f11d217a321f0fdddf0f90', class: "spw-slider-item" }, h("slot", { key: '594ebb9169c11d0e08debc43f12dce462cbc4ff3' }))));
+        return (h(Host, { key: 'c7a9c50b508ee6623a2699b6800608e1ada2fd39' }, h("div", { key: '30703082a21bda0f84027b749944b3551e04e78c', class: "spw-slider-item" }, h("slot", { key: 'c60a133e08883f8d413375c343162e0b95b0ff84' }))));
     }
     static get is() { return "spw-slider-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -394,7 +394,7 @@ export class SpwSlider {
             }, onClick: () => this.handleDotClick(i), "aria-label": `Slide ${i + 1}`, "aria-current": i === this.activeIndex ? 'true' : 'false' })))));
     }
     render() {
-        return (h(Host, { key: 'e3cdcffa3cd1e788cb9ba3b14b54b93154658998' }, h("div", { key: '4e5895bcfa1c51594acd207537bdb6b793609f0c', class: this.elementClass, style: { height: `${this.currentHeight}px` }, tabindex: "0", role: "region", "aria-label": this.accAriaLabel }, h("div", { key: 'ee4be86960ea0cdf99f105d34a2b511a1a2ef7c9', class: "spw-slider__track" }, h("slot", { key: '9324d09e7496a54d2f70684c815a7b833668d3ef' })), this.showArrows && (h("div", { key: 'f817cf37896af468a2a595ebff223457bcb80622', class: "spw-slider__navigation" }, h("button", { key: '9002d2d66e93dc132a7c054931a259559e8e2398', class: "spw-slider__arrow spw-slider__arrow--prev", onClick: this.handlePrevious, disabled: this.activeIndex === 0, "aria-label": this.previousSlideText }, h("spw-icon", { key: '881b9786ec4c1bad320800688a99c1cdd05864f7', icon: "fa-chevron-left" })), h("button", { key: '531a890269a510ce25cbaaac99d6a7b556ebdbd5', class: "spw-slider__arrow spw-slider__arrow--next", onClick: this.handleNext, disabled: this.activeIndex === this.totalSlides - 1, "aria-label": this.nextSlideText }, h("spw-icon", { key: '67da2f2695217740053fbf13879825fc25f8a68a', icon: "fa-chevron-right" })))), this.dotsPosition === 'inside' && this.renderDots()), this.dotsPosition === 'outside' && (h("div", { key: '37854071cc07c7b649af836b6ee4d23009aa3ccc', class: "spw-slider__dots-container" }, this.renderDots())), this.showAutoplayToggle && (h("div", { key: 'b156e6623b0a19012574d538ba41bd2a87d97fd0', class: "spw-slider__autoplay-toggle" }, h("spw-checkbox", { key: '0613184d17c2426e8ef6a9c967af13b462b99e9e', variant: "toggle", checked: this.isAutoplayActive, onSpwChange: this.handleAutoplayToggle }, this.autoplayText)))));
+        return (h(Host, { key: 'ae5082afcb30a7aee9b544558d8a519df2fe47a9' }, h("div", { key: '49378e5933cd866c97239485253607b163a4bae0', class: this.elementClass, style: { height: `${this.currentHeight}px` }, tabindex: "0", role: "region", "aria-label": this.accAriaLabel }, h("div", { key: 'aec193435d2f33d4e68fc60117fdf3ce7db84bfd', class: "spw-slider__track" }, h("slot", { key: '45c4c1de3286e6968066a67dfebfd44820a91ef3' })), this.showArrows && (h("div", { key: 'bcef73784f11d15273724e5001500773a18366f8', class: "spw-slider__navigation" }, h("button", { key: '37f94507bdec42684656fd1352f86b3c5f8df76e', class: "spw-slider__arrow spw-slider__arrow--prev", onClick: this.handlePrevious, disabled: this.activeIndex === 0, "aria-label": this.previousSlideText }, h("spw-icon", { key: 'c31df89017385a179b2bbfccce4c889618c7210e', icon: "fa-chevron-left" })), h("button", { key: '0eb8743d02555ebea7abb194832ab0062e16c2b9', class: "spw-slider__arrow spw-slider__arrow--next", onClick: this.handleNext, disabled: this.activeIndex === this.totalSlides - 1, "aria-label": this.nextSlideText }, h("spw-icon", { key: '1873dccaca3fbdfc3dfb8c75b738ce54574e5d0a', icon: "fa-chevron-right" })))), this.dotsPosition === 'inside' && this.renderDots()), this.dotsPosition === 'outside' && (h("div", { key: '471ebb62250e4fbf73d106b78e2604e669ac1279', class: "spw-slider__dots-container" }, this.renderDots())), this.showAutoplayToggle && (h("div", { key: '51e8a4461b6d2234cddbd1c3751b6ffc63f810f7', class: "spw-slider__autoplay-toggle" }, h("spw-checkbox", { key: '1ec3848e90e851fb5e7272c431c28dbe41bfa256', variant: "toggle", checked: this.isAutoplayActive, onSpwChange: this.handleAutoplayToggle }, this.autoplayText)))));
     }
     static get is() { return "spw-slider"; }
     static get encapsulation() { return "shadow"; }

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

@@ -5,7 +5,7 @@ export class SpwSocials {
         this.mainTitle = 'Restez connecté';
     }
     render() {
-        return (h(Host, { key: '37ed3a03b7350050ba217872a8a8ee9fcdb747b2' }, h("div", { key: '887f4e81d701a19b99317dead5eacc7f11f64ac3', class: "spw-socials" }, h("div", { key: '037ab94e4f7c748854fbc6375d282bcef10603f2', class: "spw-ds-container" }, h("h2", { key: '4722c336fefac98c035b261e9e03823e6f548975', class: "spw-socials__title" }, this.mainTitle), h("div", { key: 'd3eb5112d91db92e9fff52e51339c31d6085fa9b', class: "spw-socials__content" }, h("slot", { key: '535992ccec35ea2249f67c62491dda3defd40299' }))))));
+        return (h(Host, { key: '5863e3f5b584dddbb2e511830309ef0b3a09eef7' }, h("div", { key: '3e56be147344c6a4abe62eb3a6fb0d6f7d3cd7c4', class: "spw-socials" }, h("div", { key: 'd8dcb1313023f6716c3dd551eefe3776afdb3b53', class: "spw-ds-container" }, h("h2", { key: '3407864823f84a277aae4bb7b58462bcf26c0d6f', class: "spw-socials__title" }, this.mainTitle), h("div", { key: '589963b8aea59d72bc0d41ceee67bb90b24e174b', class: "spw-socials__content" }, h("slot", { key: 'bc9969f1672095f66d841716839f1e82fb0df51d' }))))));
     }
     static get is() { return "spw-socials"; }
     static get originalStyleUrls() {

package/dist/collection/components/spw-table/spw-table-body/spw-table-body.js

@@ -33,7 +33,7 @@ export class SpwTableBody {
         });
     }
     render() {
-        return (h("tbody", { key: 'a9e204e735c6df8af028d0973e6e9d093b724d1f', part: "tbody" }, h("slot", { key: 'd4ef5fb72710dba922b4ee232b83dc34c4c85fce' })));
+        return (h("tbody", { key: 'd7409dde824328c605547e841dcf6184e84cd3c2', part: "tbody" }, h("slot", { key: '079ac932992a705e09c1b6b0475d66d8e75aaf31' })));
     }
     static get is() { return "spw-table-body"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-table/spw-table-cell/spw-table-cell.js

@@ -87,7 +87,7 @@ export class SpwTableCell {
             }
             attrs.style = stickyStyles;
         }
-        return (h("td", Object.assign({ key: 'dd15e98018e126db78124d0a36ecc3ada952cd7d' }, attrs), h("slot", { key: '34b37091089de46915e0947ed69800d81a45ba69' })));
+        return (h("td", Object.assign({ key: '54d4b03148e699696ed46b3487254df0df7a0f33' }, attrs), h("slot", { key: 'ab32cba26290fac5796df0d9d8fb34f057212def' })));
     }
     static get is() { return "spw-table-cell"; }
     static get encapsulation() { return "shadow"; }

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

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class SpwTableContainer {
     render() {
-        return (h(Host, { key: 'ba32d8351f460f3eb7a5243f8b7a838afa85fe71' }, h("div", { key: '515717d2400c7aefb573e0e5f3b1f69be364c020', class: "spw-table-container" }, h("slot", { key: '8d168442cd75f0556cb369e382fde91d7ecb223d' }))));
+        return (h(Host, { key: '5edd5889a7ce84f37ff2a98d00a17e4285753e16' }, h("div", { key: '8f098d27881912ccf26e622de578f5e8ca35a199', class: "spw-table-container" }, h("slot", { key: 'd1d754c6a175029aa701a0f3ffb74f99ee2fa58b' }))));
     }
     static get is() { return "spw-table-container"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-table/spw-table-footer/spw-table-footer.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class SpwTableFooter {
     render() {
-        return (h("div", { key: '12ca1ccd23f29a2ff5ce4f83d5c95c144e3ed05b', class: "spw-table-footer" }, h("slot", { key: '1f0c922c3ebffeb4e03cc038ad9283531986ba7a', name: "left" }), h("slot", { key: 'b35dc377529b095c7aeb421d94b38386f7533567', name: "center" }), h("slot", { key: '668cab6205dcc48004e0e9a2ec2b1605ccfe26a2', name: "right" })));
+        return (h("div", { key: '3274802fb02297ad3766a25a0849bfc52dc46a5c', class: "spw-table-footer" }, h("slot", { key: '7a3ba8f4a8ee2af04dd76f7c7a2dc70d44f2df09', name: "left" }), h("slot", { key: '1cb9ef1b1a7e2a254ebd554a99a46a4bde2b56cc', name: "center" }), h("slot", { key: '6324073526a1541828b573390969b37a8c8cd453', name: "right" })));
     }
     static get is() { return "spw-table-footer"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-table/spw-table-head/spw-table-head.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class SpwTableHead {
     render() {
-        return (h("thead", { key: 'd957840628bb81aefe0d028e2b87bcdcb70dbefb', part: "thead" }, h("slot", { key: '3d0d79e4b275b2ee7241e7d7f39d2fbb81041dd3' })));
+        return (h("thead", { key: '9ec8ad801e891674cb91fa2115daa6313a7050f1', part: "thead" }, h("slot", { key: 'ef1ff2951d7988c3d77ac804fd6f079f0795067d' })));
     }
     static get is() { return "spw-table-head"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-table/spw-table-header/spw-table-header.js

@@ -65,10 +65,10 @@ export class SpwTableHeader {
             }
             attrs.style = stickyStyles;
         }
-        return (h("th", Object.assign({ key: '49901ac1ee181ba20ed0a3034df8e66806ae1e54' }, attrs), h("div", { key: '340392945a5dd4d4c60ec8f0dd3b1e11190e106a', class: {
+        return (h("th", Object.assign({ key: 'c96b8e0732bbe18ba3eedfa06bfb4ae3a73de540' }, attrs), h("div", { key: '34ae0d5a2fbd7e93aa305b332fcb58c40f20e716', class: {
                 'spw-table-header__content': true,
                 'spw-table-header__content--is-sorted': this.isSorted,
-            } }, h("slot", { key: '3cdadf97c4a97d6f7f1fe8778ef3509c761a15d2' }), h("div", { key: 'aad3d5b6d8465ca5cbec4fb056e70fbb99cbec9d', class: "spw-table-header__icons" }, h("slot", { key: '3775fb68e7a129db0c1bb6f021ca6ee475a0b8fb', name: "filters" }), (this.tooltipTitle || this.tooltipText) && (h("spw-tooltip", { key: '04a1b70d162ec187ead78f6ea90f4773dc605124', "tooltip-title": this.tooltipTitle, "tooltip-text": this.tooltipText }, h("spw-icon", { key: '724d62b0d6c8532bd50e486778ab5cc43c45ed19', variant: "fa-regular", icon: "fa-circle-question" }))), this.sortable && (h("spw-icon", { key: 'ff9ea419a7fe8f8fe10e8bafb67c20278fbf6c94', class: "spw-table-header__sort-icon", icon: this.isSorted ? (this.sortDirection === 'asc' ? 'fa-arrow-up-short-wide' : 'fa-arrow-down-wide-short') : 'fa-arrow-up-arrow-down' }))))));
+            } }, h("slot", { key: 'f844a5f239ed5255492dffd6e064dea78d466a78' }), h("div", { key: '711f86026809f0d858b17ac138d0d69cb05584e5', class: "spw-table-header__icons" }, h("slot", { key: 'd6402e00b5c8ba5053af927215682a13e636cea7', name: "filters" }), (this.tooltipTitle || this.tooltipText) && (h("spw-tooltip", { key: '3080be068c69098c9682dc6d1ad34b936c32517d', "tooltip-title": this.tooltipTitle, "tooltip-text": this.tooltipText }, h("spw-icon", { key: 'b73522b0f1ae52b1f55e8ac90aa4f256860e3ca3', variant: "fa-regular", icon: "fa-circle-question" }))), this.sortable && (h("spw-icon", { key: '92f6b44fceffa12cdec3f692283700c710975e2a', class: "spw-table-header__sort-icon", icon: this.isSorted ? (this.sortDirection === 'asc' ? 'fa-arrow-up-short-wide' : 'fa-arrow-down-wide-short') : 'fa-arrow-up-arrow-down' }))))));
     }
     static get is() { return "spw-table-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-table/spw-table-row/spw-table-row.js

@@ -49,7 +49,7 @@ export class SpwTableRow {
         };
     }
     render() {
-        return (h(Host, { key: '2e5b39c7bd307e27d424b9b7607fb42935e4498c', part: "row" }, h("tr", { key: '43ce9efb0946dc89c6bf783da7073406a6fd6b76', class: this.elementClass, part: "row" }, h("slot", { key: '16c69e9d52c86d0286ae3fc42d9c0abc5c339121' }))));
+        return (h(Host, { key: 'ef85e30b6faee845cbf6db79117c53e098e99a5a', part: "row" }, h("tr", { key: '0e76eada2017642d143d438c86f29a9e604c8afe', class: this.elementClass, part: "row" }, h("slot", { key: 'b93e4e25e54448fb460719423ba2f4d0e607aea6' }))));
     }
     static get is() { return "spw-table-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-table/spw-table-sidebar/spw-table-sidebar.js

@@ -123,7 +123,7 @@ export class SpwTableSidebar {
     }
     render() {
         const style = Object.assign(Object.assign({}, (this.observedHeight !== undefined && { height: `${this.observedHeight}px` })), { '--spw-table-sidebar-width': `${this.sidebarWidth}px` });
-        return (h(Host, { key: 'fb4374fe40ceeefaaf11ae09e93de670caded7c6', style: style, class: this.hostClass }, h("nav", { key: '11f9cf9fab69bd57a4d7580d4f3cdeb5c14a79c0', class: this.elementClass }, h("span", { key: '47b5f9bdf217683e357e04851bd5a01f7f600b32', class: "spw-table-sidebar__toggle", onClick: this.toggleSidebar, "aria-expanded": this.expanded.toString() }, h("spw-icon", { key: '3b837e3d4d2292218a4d5ea91f7ff2c3dc7c8552', icon: "fa-chevron-left" })), h("div", { key: 'd9a7679ed519a5734c89ee529b798b44a897badf', class: "spw-table-sidebar__mini", onClick: this.toggleSidebar }, h("spw-icon", { key: '6d21fbc9dcbd8aadbbaf44307b0fb6f1b7818410', icon: this.sidebarIcon, variant: "fa-regular" })), h("div", { key: '07eb451fd29dedf0c39bd9c5bb132968a184ced6', class: "spw-table-sidebar__content" }, h("div", { key: '43fd77c40dabedb907fd8cc936e97776f582164b', class: "spw-table-sidebar__header" }, h("span", { key: '0142aaa659a39687f7b3c6da39f01285c602b59d', class: "spw-table-sidebar__header-title" }, h("spw-icon", { key: '25b7139651b3832fab1543d43fe9252b1b316010', icon: this.sidebarIcon, variant: "fa-regular" }), " ", this.sidebarTitle), this.hasReset && (h("spw-button", { key: 'c03787c7c5faa815479b641715ce560db0fe3418', class: "spw-table-sidebar__header-reset", onClick: this.handleReset, type: "button", variant: "secondary", size: "small", isIconOnly: true, icon: this.resetIcon }))), h("div", { key: '66e976bf79f4cf19678b3f48c325ec6ca04d7ba2', class: "spw-table-sidebar__scrollable-content" }, h("slot", { key: '8eb07f0a9b371f6ee63663a30cff72be20967f1c' })), h("div", { key: '3c085ce9a9acef989a0b3d86759a0fa89c49469a', class: "spw-table-sidebar__footer" }, h("slot", { key: 'c7ad275117018bec8f1e42325d0335bf6d56b5d8', name: "sidebar-footer" }))))));
+        return (h(Host, { key: '0e0e7237879e061033c214e6ba44ec20ce0cfaa0', style: style, class: this.hostClass }, h("nav", { key: 'd8bce9a96e6e7dd985879c259b5d16f290d3de7e', class: this.elementClass }, h("span", { key: '4f07b91f8c5d93d9eef7c7c68bba09ddfad4417d', class: "spw-table-sidebar__toggle", onClick: this.toggleSidebar, "aria-expanded": this.expanded.toString() }, h("spw-icon", { key: 'b3a0feebb78062a2d185ea55c2a1ae986bfe665d', icon: "fa-chevron-left" })), h("div", { key: 'd14f2ebd001188ef6edc200ad2817e1ec55a0e4e', class: "spw-table-sidebar__mini", onClick: this.toggleSidebar }, h("spw-icon", { key: '718aa5704a6a7e5bcd85492abe40f31f1ce00842', icon: this.sidebarIcon, variant: "fa-regular" })), h("div", { key: '138a2aabbe55682ae3b411242591a40d1c2fc162', class: "spw-table-sidebar__content" }, h("div", { key: 'c84392125d283e0d330875c4fa1026597336d28d', class: "spw-table-sidebar__header" }, h("span", { key: '820d3b63f481bebbccb6a611b48dc3be3fcb7be0', class: "spw-table-sidebar__header-title" }, h("spw-icon", { key: 'ed32ded914de3d9199909e8d85d4184c7af87923', icon: this.sidebarIcon, variant: "fa-regular" }), " ", this.sidebarTitle), this.hasReset && (h("spw-button", { key: '5b7fa07306c572ded7a28cd5ead4d27245516847', class: "spw-table-sidebar__header-reset", onClick: this.handleReset, type: "button", variant: "secondary", size: "small", isIconOnly: true, icon: this.resetIcon }))), h("div", { key: 'dc6b37b9a1a6921ddb3462cfe055851f1a25e9ae', class: "spw-table-sidebar__scrollable-content" }, h("slot", { key: 'fec62db7642e1a7998feef12917f6f6fa40c81e2' })), h("div", { key: 'f012224dd279b2c5f92227abf0cfb70ba98ac2b0', class: "spw-table-sidebar__footer" }, h("slot", { key: '8ef26eec47a4bbe7739d7bf75c3aa54358b1be32', name: "sidebar-footer" }))))));
     }
     static get is() { return "spw-table-sidebar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-tabs/spw-tabs-navigation/spw-tabs-navigation.js

@@ -102,7 +102,7 @@ export class SpwTabsNavigation {
             'spw-tabs-navigation__list--vertical-on-mobile': this.isVerticalOnMobile,
             'spw-tabs-navigation__list--centered': this.isCentered && !this.hasOverflow,
         };
-        return (h("div", { key: '2b227b9d3edc52fe3cd7358e8e1b0269863c07d5', class: containerClass }, this.showLeftArrow && (h("button", { key: '6ffc6f975492936714466215e27519ff3137261b', class: "spw-tabs-navigation__arrow spw-tabs-navigation__arrow--left", onClick: this.scrollLeft, "aria-label": "Faire d\u00E9filer vers la gauche" }, h("spw-icon", { key: 'c3609240c389f9f480c79d956b894f433e66a0bd', icon: "fa-chevron-left" }))), h("nav", { key: '85918963ae8cffb79eb21467e54bcda93afb27cb', class: navClass, "aria-label": this.accAriaLabel || 'Navigation' }, h("ul", { key: '36f65c10bcbc0c52095c8491a37fd6bcd6199492', class: listClass, role: "tablist", ref: el => (this.ulElement = el), onScroll: this.handleScroll }, h("slot", { key: '9c0ad17537706fbee2a6158e014593cc6f26b17e' }))), this.showRightArrow && (h("button", { key: '95a250291a6d6586331bc8fd90f6bd011b05f949', class: "spw-tabs-navigation__arrow spw-tabs-navigation__arrow--right", onClick: this.scrollRight, "aria-label": "Faire d\u00E9filer vers la droite" }, h("spw-icon", { key: '6d8646a6d37e816fdfd8a278b5794de3da5f5068', icon: "fa-chevron-right" })))));
+        return (h("div", { key: '0adb38f7e049a4193dd9ccf9339c264182e35102', class: containerClass }, this.showLeftArrow && (h("button", { key: '3216c361c65b16d20b1e802f088d6682c430f5f7', class: "spw-tabs-navigation__arrow spw-tabs-navigation__arrow--left", onClick: this.scrollLeft, "aria-label": "Faire d\u00E9filer vers la gauche" }, h("spw-icon", { key: '10ad5f02999ae842182a00d577f82e3ea07ef846', icon: "fa-chevron-left" }))), h("nav", { key: '6b9c5b61686efcb08d3bdb7c00948f829bbb8e11', class: navClass, "aria-label": this.accAriaLabel || 'Navigation' }, h("ul", { key: '9b12145c2c1e83ef30f410355d6e63df48b5dce8', class: listClass, role: "tablist", ref: el => (this.ulElement = el), onScroll: this.handleScroll }, h("slot", { key: '5b1b3c24cbb788037f59b43822b9e9d526667c28' }))), this.showRightArrow && (h("button", { key: '61715a66a54fa8d7d9b92ab98b618336ac9fd385', class: "spw-tabs-navigation__arrow spw-tabs-navigation__arrow--right", onClick: this.scrollRight, "aria-label": "Faire d\u00E9filer vers la droite" }, h("spw-icon", { key: '33c810bf8e4fad017313973f3833cc7fb4dc5d52', icon: "fa-chevron-right" })))));
     }
     static get is() { return "spw-tabs-navigation"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-tabs/spw-tabs-navigation-item/spw-tabs-navigation-item.js

@@ -63,7 +63,7 @@ export class SpwTabsNavigationItem {
         const iconClass = `spw-icon--${iconPosition}`;
         const iconElement = this.icon ? h("spw-icon", { class: iconClass, icon: this.icon }) : null;
         const tagElement = this.tagText ? (h("spw-tag", { size: "small", "has-icon": this.tagIcon ? 'true' : 'false', variant: this.tagVariant }, this.tagText)) : null;
-        return (h(Host, { key: '3a8f8534ca1682b8e171f8c19e4db53ce29bd0c4', class: this.active ? '--active' : '' }, h("li", { key: '2e12362ae8375e351c93d53c0f3c37e32e96bf11', id: `tab-${this.tabId}`, role: "tab", "aria-selected": this.active ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.accAriaLabel || this.slotText, onKeyDown: this.handleKeyDown, tabIndex: this.disabled ? -1 : 0, class: this.elementClass, onClick: this.handleClick }, this.hasEllipsis && (h("spw-tooltip", { key: 'c212ddbc7e42daee44b30b4b4859c474cfb9938f', cursor: this.disabled ? 'disabled' : 'pointer', class: "spw-tooltip--has-ellipsis", tooltipText: this.slotText }, iconPosition === 'left' && iconElement, h("slot", { key: 'c28046baad6d3160d1bc9dc8fb9258c76432562c' }), iconPosition === 'right' && iconElement, tagElement)), !this.hasEllipsis && (h(Fragment, { key: '8ad13772538c74b690e78da8aa114c179be1d05c' }, iconPosition === 'left' && iconElement, h("slot", { key: 'ea83c3dbb8587ecdebad8f1fa81894a535491c2d' }), iconPosition === 'right' && iconElement, tagElement)), ' ', this.bubble && h("span", { key: '28d465f9942b8207263057e53f9ed0f277a9ab99', class: "bubble" }))));
+        return (h(Host, { key: '4b62700a4d2e49968423ab063c0c0aeb7c244d48', class: this.active ? '--active' : '' }, h("li", { key: '0f536a2f72074420a65ef5bd8e0557590d784527', id: `tab-${this.tabId}`, role: "tab", "aria-selected": this.active ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.accAriaLabel || this.slotText, onKeyDown: this.handleKeyDown, tabIndex: this.disabled ? -1 : 0, class: this.elementClass, onClick: this.handleClick }, this.hasEllipsis && (h("spw-tooltip", { key: '2cb56424e3de368f48ba4730e380f2d920ccd79a', cursor: this.disabled ? 'disabled' : 'pointer', class: "spw-tooltip--has-ellipsis", tooltipText: this.slotText }, iconPosition === 'left' && iconElement, h("slot", { key: '59b23a03f00ecc47e49e03977c9c39f8aa39fea4' }), iconPosition === 'right' && iconElement, tagElement)), !this.hasEllipsis && (h(Fragment, { key: '6c5905313497084503d4b206c49debccad662868' }, iconPosition === 'left' && iconElement, h("slot", { key: '75ee1db82675348e3710c68ba2f279833db6f954' }), iconPosition === 'right' && iconElement, tagElement)), ' ', this.bubble && h("span", { key: '39cf06bdd61e7f10e7b6c2a06ece9dc778c17f89', class: "bubble" }))));
     }
     static get is() { return "spw-tabs-navigation-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -167,7 +167,7 @@ export class SpwTabs {
         };
     }
     render() {
-        return (h("div", { key: '3bfb6a6bea5d4ebc4bc2cec369756414c4d94056', class: this.elementClass }, h("slot", { key: '1b73931774867138ceb9bebb0fb5e56b0a0483c6', name: "navigation" }), h("slot", { key: '229876d6e286f1bf7de291dfd41122ca067de57e', name: "content" })));
+        return (h("div", { key: 'b6310eb87661de2bf83768ff6cc7d3fc9d6a9669', class: this.elementClass }, h("slot", { key: '57a152f6a6cb53cacd6ef72b374c3428fdd1a69b', name: "navigation" }), h("slot", { key: 'dab20dbc1ba59308580a499bd562890d06315a60', name: "content" })));
     }
     static get is() { return "spw-tabs"; }
     static get encapsulation() { return "shadow"; }

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

@@ -49,7 +49,7 @@ export class SpwTag {
             };
         const iconToDisplay = this.icon || this.getIcon(this.variant);
         const iconElement = this.hasIcon ? h("spw-icon", { variant: this.iconVariant, icon: iconToDisplay }) : null;
-        return (h(Host, { key: '4a6158008a587e4a6c534634df08be0c63b98e4b' }, h(TagType, Object.assign({ key: 'bd12d6475acbac06d2f5dfdd87aeb2a15b540ff1' }, attrs, { class: this.elementClass }), this.iconPosition === 'left' && iconElement, h("slot", { key: '195ff4cda1e6e74eab0a3a46d4a04bdbf101da96' }), this.iconPosition === 'right' && iconElement)));
+        return (h(Host, { key: '5bbea711fe7b238e190819b7fc90c4751ca21a13' }, h(TagType, Object.assign({ key: '1122317d82979d80fd995ac4861869f685ec93ce' }, attrs, { class: this.elementClass }), this.iconPosition === 'left' && iconElement, h("slot", { key: '3617ec897e76d86a58e970711b0861329124c36f' }), this.iconPosition === 'right' && iconElement)));
     }
     static get is() { return "spw-tag"; }
     static get encapsulation() { return "shadow"; }

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

@@ -247,25 +247,22 @@ export class SpwTextField {
         }
         return result;
     }
-    renderErrorMessage() {
-        if (this.error) {
-            return (h("spw-field-message", { variant: "error", showIcon: this.showErrorIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.error, h("slot", { name: "details", slot: "details" })));
-        }
-    }
-    renderHintMessage() {
-        if (this.hint) {
-            return (h("spw-field-message", { variant: "hint", showIcon: this.showHintIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.hint, h("slot", { name: "details", slot: "details" })));
-        }
-    }
-    renderSuccessMessage() {
-        if (this.success) {
-            return (h("spw-field-message", { variant: "success", showIcon: this.showSuccessIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.success, h("slot", { name: "details", slot: "details" })));
-        }
-    }
-    renderWarningMessage() {
-        if (this.warning) {
-            return (h("spw-field-message", { variant: "warning", showIcon: this.showWarningIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.warning, h("slot", { name: "details", slot: "details" })));
-        }
+    // isExpandable (details slot) est rendu uniquement sur le dernier message
+    // affiché — sinon on aurait un bouton "Plus d'informations" par message.
+    renderMessages() {
+        const messages = [];
+        if (this.error)
+            messages.push({ variant: 'error', text: this.error, showIcon: this.showErrorIcon });
+        if (this.hint)
+            messages.push({ variant: 'hint', text: this.hint, showIcon: this.showHintIcon });
+        if (this.success)
+            messages.push({ variant: 'success', text: this.success, showIcon: this.showSuccessIcon });
+        if (this.warning)
+            messages.push({ variant: 'warning', text: this.warning, showIcon: this.showWarningIcon });
+        return messages.map((m, i) => {
+            const isLast = i === messages.length - 1;
+            return (h("spw-field-message", { variant: m.variant, showIcon: m.showIcon, isExpandable: isLast && this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, m.text, isLast && h("slot", { name: "details", slot: "details" })));
+        });
     }
     get elementClass() {
         const isNumber = this.type === 'number';
@@ -282,7 +279,7 @@ export class SpwTextField {
         };
     }
     render() {
-        return (h("div", { key: 'e4bd9a7658360bb809fea011c1be848d410fd4ac', class: this.elementClass }, this.label && (h("spw-field-label", { key: '966ebc8ec9fc846bb3bbddd5872ea9dadf57f559', label: this.label, name: this.name, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (h("spw-field-message", { key: '89cda5a205c9e6ebbc559e244df8b2f09af824a6', class: "spw-text-field__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'b9117308948f17fef393c1342e02b838cbb8d1f3', class: "spw-text-field__container" }, this.type === 'number' && this.hasControls && (h("button", { key: '3e9e5115840166cf7d725f6be9353d820ab49752', type: "button", class: "spw-text-field__number-btn spw-text-field__number-btn--decrement", onClick: () => this.decrement(), disabled: this.disabled || (this.min != null && Number(this.value) <= this.min), "aria-label": this.accAriaLabelDecrement }, h("spw-icon", { key: 'cccf7aa4bce081ed985bd29a90d9d9f0fcd7df87', icon: "fa-minus" }))), h("div", { key: 'ce2962bd886e188465abfb7e882ca1e6bebc1844', class: "spw-text-field__input-container" }, h("input", { key: '9266a73c59ff0625e9bb444af04f1966ae3295bf', class: "spw-text-field__input", ref: el => (this.inputElement = el), type: this.type === 'number' && (this.decimalPrecision != null || this.mask != null) ? 'text' : this.type, inputMode: this.type === 'number' && (this.decimalPrecision != null || this.mask != null) ? 'decimal' : undefined, min: this.type === 'number' && this.decimalPrecision == null && this.mask == null ? this.min : undefined, max: this.type === 'number' && this.decimalPrecision == null && this.mask == null ? this.max : undefined, step: this.type === 'number' && this.decimalPrecision == null && this.mask == null ? this.step : undefined, placeholder: this.placeholder, "aria-label": this.accAriaLabel || this.name, disabled: this.disabled, name: this.name, id: this.name, minLength: this.minLength, maxLength: this.maxLength, required: this.required, onInput: event => this.handleInput(event), onKeyDown: event => this.handleKeyDown(event) }), (this.isSearch || this.isClearIconVisible) && (h("div", { key: '2e0e41f825ef7b54057e9f8eac56dbbd1692b0eb', class: "spw-text-field__icons" }, this.isClearIconVisible && (h("span", { key: '8c289f6d07ab2a494b8379bb4dd96b7913b636dc', class: "spw-text-field__clear", onClick: () => this.handleClear() }, h("spw-icon", { key: '45cee755cd23114506a58e6ed8f84547e6531a47', class: "spw-text-field__icon spw-text-field__icon--clear", icon: "fa-xmark" }))), this.isSearch && !this.hasSubmitButton && h("spw-icon", { key: '6e50f234680a9b77143dbd8d247afab10b262976', class: "spw-text-field__icon spw-text-field__icon--search", icon: "fa-magnifying-glass" }), this.hasSubmitButton && (h("button", { key: '4fbcdab588dce86c0498badad56cd378cf1bede5', type: "button", class: "spw-text-field__submit", onClick: () => this.handleSubmit(), "aria-label": "Rechercher" }, h("spw-icon", { key: '9d0df46e6f24a1c321ccdd9dd883e18907241017', icon: "fa-magnifying-glass" })))))), this.type === 'number' && this.hasControls && (h("button", { key: '415467e32e7940ccdb3c79b6eac874e1a249c977', type: "button", class: "spw-text-field__number-btn spw-text-field__number-btn--increment", onClick: () => this.increment(), disabled: this.disabled || (this.max != null && Number(this.value) >= this.max), "aria-label": this.accAriaLabelIncrement }, h("spw-icon", { key: 'f854ab9b9b580b0e995991d5ae8dfaa4e1258caa', icon: "fa-plus" }))), this.indicator && h("div", { key: '23924b26b55b036341038b3a6dd18df9fd3d650e', class: "spw-text-field__indicator" }, this.indicator)), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+        return (h("div", { key: 'eac95d9044c5233a1eb4db8f93c85593521160df', class: this.elementClass }, this.label && (h("spw-field-label", { key: '605e3ca1d5e46ef44e36e4386905e8aefd02bb9f', label: this.label, name: this.name, required: this.required, tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, tooltipMaxWidth: this.tooltipMaxWidth, tooltipDirection: this.tooltipDirection, tooltipCursor: this.tooltipCursor })), this.assistiveText && (h("spw-field-message", { key: 'd0226be53d3efb860c7270af3f175e472b853831', class: "spw-text-field__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'deb7a861a993fa17ce7414f6f8ff4e45599fcbfa', class: "spw-text-field__container" }, this.type === 'number' && this.hasControls && (h("button", { key: 'a086085956f44ee9f947b09f0fdc741d214941be', type: "button", class: "spw-text-field__number-btn spw-text-field__number-btn--decrement", onClick: () => this.decrement(), disabled: this.disabled || (this.min != null && Number(this.value) <= this.min), "aria-label": this.accAriaLabelDecrement }, h("spw-icon", { key: '25bf35e3b7163e1a026788a78bd61378800c7315', icon: "fa-minus" }))), h("div", { key: 'b44136077e9857835fd6c77f232af93fd94c7755', class: "spw-text-field__input-container" }, h("input", { key: '37310e16d288b6e5557d4d0b0c6003764371527f', class: "spw-text-field__input", ref: el => (this.inputElement = el), type: this.type === 'number' && (this.decimalPrecision != null || this.mask != null) ? 'text' : this.type, inputMode: this.type === 'number' && (this.decimalPrecision != null || this.mask != null) ? 'decimal' : undefined, min: this.type === 'number' && this.decimalPrecision == null && this.mask == null ? this.min : undefined, max: this.type === 'number' && this.decimalPrecision == null && this.mask == null ? this.max : undefined, step: this.type === 'number' && this.decimalPrecision == null && this.mask == null ? this.step : undefined, placeholder: this.placeholder, "aria-label": this.accAriaLabel || this.name, disabled: this.disabled, name: this.name, id: this.name, minLength: this.minLength, maxLength: this.maxLength, required: this.required, onInput: event => this.handleInput(event), onKeyDown: event => this.handleKeyDown(event) }), (this.isSearch || this.isClearIconVisible) && (h("div", { key: 'c79b5880f91b6f0c1e56fe892e4a050608d44882', class: "spw-text-field__icons" }, this.isClearIconVisible && (h("span", { key: '669dc7c54ff811af1d967b078d20feedb0c5bd5a', class: "spw-text-field__clear", onClick: () => this.handleClear() }, h("spw-icon", { key: '16bfdfb005fcae12024c69d4104b1b7ed8416fcd', class: "spw-text-field__icon spw-text-field__icon--clear", icon: "fa-xmark" }))), this.isSearch && !this.hasSubmitButton && h("spw-icon", { key: '68491038bc146623f90aebc29dd1435d9684d7b2', class: "spw-text-field__icon spw-text-field__icon--search", icon: "fa-magnifying-glass" }), this.hasSubmitButton && (h("button", { key: 'cbd2ea1a3df8cceab6e214ef961eddbfa216fa55', type: "button", class: "spw-text-field__submit", onClick: () => this.handleSubmit(), "aria-label": "Rechercher" }, h("spw-icon", { key: '90b903d8a4a620d0b45270a4730facc602e63c94', icon: "fa-magnifying-glass" })))))), this.type === 'number' && this.hasControls && (h("button", { key: '71cc50996b225e21090e510a466bc5a7accdcd61', type: "button", class: "spw-text-field__number-btn spw-text-field__number-btn--increment", onClick: () => this.increment(), disabled: this.disabled || (this.max != null && Number(this.value) >= this.max), "aria-label": this.accAriaLabelIncrement }, h("spw-icon", { key: 'c34cb66bdac07bf3517a9413d077bb46831e303d', icon: "fa-plus" }))), this.indicator && h("div", { key: 'c666a77985ef4b825e50c65db3c4e2fff55ee942', class: "spw-text-field__indicator" }, this.indicator)), this.renderMessages()));
     }
     static get is() { return "spw-text-field"; }
     static get encapsulation() { return "shadow"; }