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

package/dist/collection/components/spw-mosaic/spw-mosaic-item/spw-mosaic-item.css

@@ -40,6 +40,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -326,7 +327,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -339,7 +340,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -354,7 +355,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -45,7 +45,7 @@ export class SpwMosaicItem {
         }
     }
     render() {
-        return (h(Host, { key: '55b1083355f85c70e914971056b34c62227bfac6' }, h("slot", { key: 'ef9b988e3690f3a0a05bac85bdab46fa1308d3a8' })));
+        return (h(Host, { key: '04a1163bf00c9fa4fd26766b0010cfda8d8d2cbb' }, h("slot", { key: '5ab56c1ae0ca4d8473284fb74d318efab007d1cb' })));
     }
     static get is() { return "spw-mosaic-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -136,7 +136,7 @@ export class SpwMosaic {
         };
     }
     render() {
-        return (h(Host, { key: 'f991879356e9610ba95b0290caeebaeca3d14f54' }, h("div", { key: 'cb083ad301ece01030eec5222624076bb7ef0ee1', class: this.elementClass }, h("slot", { key: '1454049e238c902a3d87e766cc6002b5b47f8221' }))));
+        return (h(Host, { key: '334696b89e3164c23996672062beaeb8b278fbec' }, h("div", { key: '0548ef1fd19b768e72e3a28f890ca27f733120a6', class: this.elementClass }, h("slot", { key: '519ead1db49c101efc8c68b735b7e793e497c49c' }))));
     }
     static get is() { return "spw-mosaic"; }
     static get encapsulation() { return "shadow"; }

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

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -167,12 +167,12 @@ export class SpwPagination {
         const pages = this.calculatePageRange();
         const showPrevArrow = this.currentPage > 1;
         const showNextArrow = this.currentPage < this.totalPages;
-        const prevArrow = showPrevArrow && (h("li", { key: '7c080edc2651b2e1132dd892f80fb35cdb51c545', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: 'db86c90829af879f8b9159ff55385ea6113a87c9', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: 'd71519a4f9672e537a9d62bac9278af43c0d49fe', icon: "fa-chevron-left" }), " ", h("span", { key: 'edba6502243e49845c0f319017c5b7d61d2e2437', class: "spw-pagination__item-arrow-text" }, this.previousButtonText))));
-        const nextArrow = showNextArrow && (h("li", { key: 'c8982972fcc18efb18dd6a051e0e33f08a640b5a', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: 'b6d9958f459d5a3405da368453e3d5d4856dc745', onClick: () => this.goToPage(this.currentPage + 1) }, h("span", { key: 'c2b580079bd0ce4379566448e956c794d74700d8', class: "spw-pagination__item-arrow-text" }, this.nextButtonText), " ", h("spw-icon", { key: 'ad82aea1b9a5cd0c40f2328971d1aa614b7faf63', icon: "fa-chevron-right" }))));
-        const prevArrowMobile = this.currentPage > 1 && (h("li", { key: '45f13caaadd25e703ded72ef7035b83754efe1f1', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '352f7888ee3a2c69aa95563e0d70c6636e6cfec5', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: '6eca4cf9264abbcb954cf28f4bff7766accf0df9', icon: "fa-chevron-left" }), " ", h("span", { key: 'edbf625b0c1e2732608b6d93eefdf809daccb24a' }, this.previousButtonText))));
-        const nextArrowMobile = this.currentPage < this.totalPages && (h("li", { key: 'ebfd73bf701c7c5ce58df4371a6c4e587b53d6f9', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: 'cf8af3ea6473b20c0f6222f574d0fce0acc0d68f', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, h("span", { key: '2416f4e8e5ca12cb7b4295f30263f44040ee7389' }, this.nextButtonText), " ", h("spw-icon", { key: 'a17f614b9de4b2ce9b5ee1acac8747b30c9f2a02', icon: "fa-chevron-right" }))));
-        const mobileArrows = (h("ul", { key: '53b411817dc5000fea5a169f12b5db019ce3b5c6', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
-        return (h(Host, { key: 'a36abcd917e0dca742c810ee6e933e187feb2d77' }, h("div", { key: '15a42490c86ff76815e56f73f5194debcc9310ee', class: this.getPaginationClass() }, this.variant === 'input' && (h(Fragment, { key: '829f3acd90f4695aabe00220790fb0a977db8827' }, h("ul", { key: '6afa448b159d362c2892f8f54fd492ce67898351' }, prevArrow, h("li", { key: '23c505dd82dbdbcea7e41defd23485e4c232092d', class: "spw-pagination__input" }, h("spw-text-field", { key: '856aa891aa67729ca0a3f0efe2b877eef363dae8', value: this.inputPageValue, type: "text", name: "pagination-input", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled })), h("li", { key: '396afb3c7d68b35aa205456a244a291e8e024846', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " ", this.totalPages === 1 ? 'page' : 'pages'), nextArrow), mobileArrows)), this.variant === 'numbers' && (h(Fragment, { key: 'faee677eee20adb4bc4798c73db2293d48c7fbde' }, h("ul", { key: 'fcf090ab6ef87c338177d5df8d57231e775d4f4f' }, prevArrow, pages.map(({ page, class: pageClass }) => {
+        const prevArrow = showPrevArrow && (h("li", { key: 'fff8c53f44ed0b24b9f150febab76934a5d0c65b', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: '4683ff7b49848a970c073cdef82351246fdfaeb6', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: '8100d69ffaef074a8b968bcc460609281d530cc3', icon: "fa-chevron-left" }), " ", h("span", { key: '93c2cb2edf692f6044453d6bb2bdf2e1955b1844', class: "spw-pagination__item-arrow-text" }, this.previousButtonText))));
+        const nextArrow = showNextArrow && (h("li", { key: '09438af671c9979f50e42cbc614e489f150f254e', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: 'ced63eed5e977d14495c3743a16d5c880290c47c', onClick: () => this.goToPage(this.currentPage + 1) }, h("span", { key: 'a197e149be556f5bd9b562720a39a96a3ee8595f', class: "spw-pagination__item-arrow-text" }, this.nextButtonText), " ", h("spw-icon", { key: 'e8b3aac239ec2b93727eea30663fbe45a71f5e69', icon: "fa-chevron-right" }))));
+        const prevArrowMobile = this.currentPage > 1 && (h("li", { key: '5fbded02de87b04b7e4ee1db1de8c1d90f8d00e1', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '266cb6243906ff31f7d858ee468ebe1608ff3e79', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: '94b6fc58726c070f08ca5e99eb3db7ecb2efa94d', icon: "fa-chevron-left" }), " ", h("span", { key: '80dba1564815128b5122de187c1b77352c6979df' }, this.previousButtonText))));
+        const nextArrowMobile = this.currentPage < this.totalPages && (h("li", { key: '152fb6a3265903a59328ec821ae39959fe4bf797', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '08bfa90c4f6e7255ac5e8f6c7c04c462d8e82f44', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, h("span", { key: '87adcd5f675849d5a22c972c2d81b40157563bda' }, this.nextButtonText), " ", h("spw-icon", { key: 'e63a7f995b7a2590529fc7508c0236c2c5a6bd31', icon: "fa-chevron-right" }))));
+        const mobileArrows = (h("ul", { key: '1a1aac0686b258504e87bc0c28092a4520f1b06a', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
+        return (h(Host, { key: '38e992e659b2f495f8fb9a7179f6495ea33b65e6' }, h("div", { key: '364998499c41a1bb553a1a0a20a9b5bfb54ab5ab', class: this.getPaginationClass() }, this.variant === 'input' && (h(Fragment, { key: '58f894dad67e1eb955efe7f07d4e6d618d89e425' }, h("ul", { key: 'eb88e1d90b12ee57f6291e22b8e83ebeaa3a7795' }, prevArrow, h("li", { key: '44ba0de1f0667a8a08092d437ea9083b59c9ddb9', class: "spw-pagination__input" }, h("spw-text-field", { key: '3657e851a79cb4125265dfb31c8dc6237b6ceaff', value: this.inputPageValue, type: "text", name: "pagination-input", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled })), h("li", { key: 'ce556cd4687415deb80b5cdaf649f2d3454b38e2', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " ", this.totalPages === 1 ? 'page' : 'pages'), nextArrow), mobileArrows)), this.variant === 'numbers' && (h(Fragment, { key: 'fa0855df49e8875f7372f993c37f5470fba032ea' }, h("ul", { key: 'e344f6c415d7f464b5292c90b3ec3d57eed2687b' }, prevArrow, pages.map(({ page, class: pageClass }) => {
             if (page === '...') {
                 return (h("li", { class: `spw-pagination__item spw-pagination__item--dots ${pageClass}` }, h("spw-icon", { icon: "fa-ellipsis" })));
             }

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

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -21,15 +21,14 @@ export class SpwRadio {
         }
     }
     uncheckOthers() {
-        const form = this.el.closest('form');
-        if (form) {
-            const radios = Array.from(form.querySelectorAll(`spw-radio[name="${this.name}"]`));
-            radios.forEach(radio => {
-                if (radio !== this.el) {
-                    radio.setChecked(false);
-                }
-            });
-        }
+        var _a, _b;
+        const scope = (_b = (_a = this.el.closest('form')) !== null && _a !== void 0 ? _a : this.el.closest('spw-group')) !== null && _b !== void 0 ? _b : document;
+        const radios = Array.from(scope.querySelectorAll(`spw-radio[name="${this.name}"]`));
+        radios.forEach(radio => {
+            if (radio !== this.el) {
+                radio.setChecked(false);
+            }
+        });
     }
     /** Méthode pour changer l'état de la case à cocher. */
     async setChecked(checked) {
@@ -92,7 +91,7 @@ export class SpwRadio {
     render() {
         const slot = this.el.innerHTML;
         const hasSlot = Boolean(slot);
-        return (h("div", { key: '24c8dbdadb1efe0ddc64aba7b888d99008c19abb', class: "spw-radio" }, h("input", { key: '0a09e781b7dc89b55f94b2bb5d3704fd9483afed', type: "radio", ref: el => (this.inputElement = el), checked: this.internalChecked, "aria-checked": this.internalChecked ? 'true' : 'false', onChange: this.handleRadio.bind(this), name: this.name, value: this.value, disabled: this.disabled, style: { display: 'none' } }), hasSlot && (h("label", { key: '0c35d4e3c411671d23640e6cedc475e06222a069', class: `spw-radio__label ${this.disabled ? 'spw-radio__label--disabled' : ''}`, onClick: e => this.handleRadio(e) }, h("slot", { key: 'ea50f94b2c8d3bcd6adf1c592763155571771916' }))), h("div", { key: 'fb9dd0ed9aede5221d4ae9f00f6a19f1744c8ad0', tabIndex: this.disabled ? -1 : 0, onClick: e => this.handleRadio(e), onKeyDown: this.handleKeydown.bind(this), role: "radio", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-disabled": this.disabled, "aria-label": this.accAriaLabel || this.name, class: this.elementClass }, this.internalChecked && h("span", { key: '0dd4595e7719b4f09b3db2c15add60ae602e744d', class: "spw-radio__circle" }))));
+        return (h("div", { key: '4150ce36766b42eedc45ad03899fa25953d44b8d', class: "spw-radio" }, h("input", { key: '0aa81522086b68ee9661f571c24ba6f38057e3bf', type: "radio", ref: el => (this.inputElement = el), checked: this.internalChecked, "aria-checked": this.internalChecked ? 'true' : 'false', onChange: this.handleRadio.bind(this), name: this.name, value: this.value, disabled: this.disabled, style: { display: 'none' } }), hasSlot && (h("label", { key: '8035c81838019557a886a591c178ec957da00c81', class: `spw-radio__label ${this.disabled ? 'spw-radio__label--disabled' : ''}`, onClick: e => this.handleRadio(e) }, h("slot", { key: '5fb0d4c0df296ffdfd177be36fb556b53ae628b7' }))), h("div", { key: '4bda2e047b2d9b199f4f16f73c7c2851cd2cc513', tabIndex: this.disabled ? -1 : 0, onClick: e => this.handleRadio(e), onKeyDown: this.handleKeydown.bind(this), role: "radio", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-disabled": this.disabled, "aria-label": this.accAriaLabel || this.name, class: this.elementClass }, this.internalChecked && h("span", { key: '28c79896755d829dbd63c6402360668c98a8ba21', class: "spw-radio__circle" }))));
     }
     static get is() { return "spw-radio"; }
     static get encapsulation() { return "shadow"; }

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

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -73,7 +73,7 @@ export class SpwScrolltop {
         };
     }
     render() {
-        return (h(Host, { key: '31d0e6b37e5ab82109cc6af85b6b433771e410ac', class: this.hostClass }, h("spw-button", { key: '9d7ae62aba325316f501e68062c5ad78f7eb42f1', "is-icon-only": true, icon: "fa-chevron-up", variant: "primary", size: "medium", "acc-aria-label": this.accAriaLabel, onClick: this.scrollToTop })));
+        return (h(Host, { key: 'dffd5dfb3e0da35b1008571181bbee461179da19', class: this.hostClass }, h("spw-button", { key: '8b4fad34b061667f95de5df1d8d052198a139b1f', "is-icon-only": true, icon: "fa-chevron-up", variant: "primary", size: "medium", "acc-aria-label": this.accAriaLabel, onClick: this.scrollToTop })));
     }
     static get is() { return "spw-scrolltop"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-search-field/spw-search-field.css

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -25,6 +25,8 @@ export class SpwSelect {
         this.showSuccessIcon = true;
         /** Affiche une icône de warning si vrai */
         this.showWarningIcon = true;
+        /** Active le panneau dépliable sur les messages (error, hint, success, warning) */
+        this.isExpandable = false;
         /** Positionnement du tooltip */
         this.tooltipDirection = 'top';
         /** Curseur du tooltip */
@@ -144,22 +146,22 @@ export class SpwSelect {
     }
     renderErrorMessage() {
         if (this.error) {
-            return (h("spw-field-message", { variant: "error", showIcon: this.showErrorIcon }, 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 }, 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 }, 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 }, 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" })));
         }
     }
     handleClear(event) {
@@ -176,7 +178,7 @@ export class SpwSelect {
         };
     }
     render() {
-        return (h(Host, { key: '81b442a4a808d22e864b0ae86e596394ed2e4138' }, h("div", { key: 'ec9981cddfe018e48fd37e891826c2057d6b06b7', class: this.elementClass }, this.label && (h("spw-field-label", { key: 'ed31b2aea9498dd32a89b3bb67759cfa76620201', 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: '0515f6a86938f9df94e35a184501fe1cb1b911ad', class: "spw-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'dcea546070211670b8e1af0b6e97c1564f7e8bd0', class: "spw-select__container" }, h("select", { key: '44a6c19e9b485fb11ca13137f339ddf97e3fcd61', id: this.name, name: this.name, "aria-label": this.accAriaLabel || this.label || this.name, class: "spw-select__trigger", onChange: event => this.handleSelectChange(event), disabled: this.disabled, ref: el => (this.selectElement = el), tabindex: this.disabled ? -1 : 0 }, h("option", { key: '0126406f9e6b9046c86063eadc283278266f36d6', value: "", disabled: true, selected: !this.internalValue }, this.placeholder)), h("div", { key: '9743ab039baf9d35591681f3767bbee018257d56', class: "spw-select__icons" }, this.isClear && !!this.internalValue && (h("span", { key: '3779eea44d77795a42eb030dda1af776c5f02b9c', class: "spw-select__clear", onClick: event => this.handleClear(event) }, h("spw-icon", { key: 'b22e5e2aa2c81eeb1f0c34fbeaadba4f9f8e4827', icon: "fa-xmark" }))), h("spw-icon", { key: 'd9631b9b8f57f3e9184fdca81de6e83fcf5cd343', class: "spw-select__arrow", icon: "fa-chevron-down" }))), !this.items && h("slot", { key: '35913f6a392f1f7ec0d2794c5253054df88ee421' })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+        return (h(Host, { key: 'd3ccd489ec86a0b97bdf7b9381c1e7a3cefbb383' }, h("div", { key: '91e29a92856e4d43017c146361b6df8793c5b500', class: this.elementClass }, this.label && (h("spw-field-label", { key: '49fbc4422c9a03e04fbb3380c621ec7e30fba829', 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: '0d1809e1ba89356957828269ba48e0c2023bb9be', class: "spw-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '8699a924cb0f73d5f71518817a4b5fd1b9a561fb', class: "spw-select__container" }, h("select", { key: 'f46e93c8d2b42d0b128a45ea13e75cb02fcc569e', id: this.name, name: this.name, "aria-label": this.accAriaLabel || this.label || this.name, class: "spw-select__trigger", onChange: event => this.handleSelectChange(event), disabled: this.disabled, ref: el => (this.selectElement = el), tabindex: this.disabled ? -1 : 0 }, h("option", { key: 'b77f86e33c40a4554fbeb7fa41750e9a8f5275f2', value: "", disabled: true, selected: !this.internalValue }, this.placeholder)), h("div", { key: 'b5b1ec5298d28a6d4b3fa140ca0698578a97fa60', class: "spw-select__icons" }, this.isClear && !!this.internalValue && (h("span", { key: 'f4b1eb192835244f4a0c34494c5fbe53c9d69a21', class: "spw-select__clear", onClick: event => this.handleClear(event) }, h("spw-icon", { key: '2f4dce811cd2ff66f948b62ee1571eb2cfb93e4e', icon: "fa-xmark" }))), h("spw-icon", { key: 'f08da6debbdaa04458d02c0edb5e0e76c298a440', class: "spw-select__arrow", icon: "fa-chevron-down" }))), !this.items && h("slot", { key: '36f5f910750f8d9bea47eba8f52d660e60217f6e' })), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
     }
     static get is() { return "spw-select"; }
     static get encapsulation() { return "shadow"; }
@@ -509,6 +511,64 @@ export class SpwSelect {
                 "attribute": "show-warning-icon",
                 "defaultValue": "true"
             },
+            "isExpandable": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Active le panneau d\u00E9pliable sur les messages (error, hint, success, warning)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "is-expandable",
+                "defaultValue": "false"
+            },
+            "expandLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Texte du lien pour d\u00E9plier le message"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "expand-label"
+            },
+            "collapseLabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Texte du lien pour replier le message"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "collapse-label"
+            },
             "items": {
                 "type": "unknown",
                 "mutable": false,

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

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -27,7 +27,7 @@ export class SpwSeparator {
         };
     }
     render() {
-        return h("div", { key: '9c2cf8d46e7bf8611666c22836e0a31eb191ab4c', class: this.elementClass, style: this.style });
+        return h("div", { key: '6ab2aeb17e2f50a0bc917ede54a58a4ebc39c9fb', class: this.elementClass, style: this.style });
     }
     static get is() { return "spw-separator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-sidebar/spw-sidebar-navigation-dropdown/spw-sidebar-navigation-dropdown.css

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -11,7 +11,7 @@ export class SpwSidebarNavigationDropdown {
         };
     }
     render() {
-        return (h(Host, { key: '4cbc4e1327c6d5bd3384e0c1e0633323cb1bb5e3', class: this.classes }, h("div", { key: '9916cc219a96b22b41e98d54e6cf4960889145d6', class: "spw-sidebar-navigation-dropdown__content", style: { display: this.open ? 'block' : 'none' } }, h("slot", { key: '76c9ae274f1fc689d5ae3b350be900460626ce90' }))));
+        return (h(Host, { key: 'b99700684df4095c48b902e418290ab46b799608', class: this.classes }, h("div", { key: '92edb187c4eee6889ef9f48868500fc0548d7379', class: "spw-sidebar-navigation-dropdown__content", style: { display: this.open ? 'block' : 'none' } }, h("slot", { key: 'ab41290c9483ed51976fa9f8175e915f7ac5dcce' }))));
     }
     static get is() { return "spw-sidebar-navigation-dropdown"; }
     static get originalStyleUrls() {

package/dist/collection/components/spw-sidebar/spw-sidebar-navigation-item/spw-sidebar-navigation-item.css

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }

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

@@ -169,14 +169,14 @@ export class SpwSidebarNavigationItem {
     }
     render() {
         const Tag = this.href && !this.disabled && !this.openOnClick ? 'a' : 'div';
-        const iconContent = h("spw-icon", { key: '43b2300705244146b5062f5f366bebe6ed75215d', variant: this.iconVariant, icon: this.icon });
-        const iconDiv = (h("div", { key: 'efea63320a42642f1db50501b4f8b20407b84343', class: "spw-sidebar-navigation-item__icon" }, this.bubble && h("span", { key: '161ed795c3e9b02f872600a015722cd4a96348af', class: "spw-sidebar-navigation-item__bubble" }, this.bubble), iconContent));
+        const iconContent = h("spw-icon", { key: '63ec14de9596159a057c03b410a67c746a4e8ffa', variant: this.iconVariant, icon: this.icon });
+        const iconDiv = (h("div", { key: 'ced35e640b0865360a4f329d81c7ce3093705003', class: "spw-sidebar-navigation-item__icon" }, this.bubble && h("span", { key: '1d8234cddbf7cd86218306f48a2ccb4e74b3ce5f', class: "spw-sidebar-navigation-item__bubble" }, this.bubble), iconContent));
         const iconWithBubble = this.tooltipTitle ? (h("spw-tooltip", { cursor: this.disabled ? 'disabled' : 'pointer', "tooltip-title": this.tooltipTitle, direction: "right", visible: !this.navExpanded }, iconDiv)) : (iconDiv);
         const toggleClasses = {
             'spw-sidebar-navigation-item__dropdown-toggle': true,
             'spw-sidebar-navigation-item__dropdown-toggle--open': this.dropdownOpen,
         };
-        return (h(Tag, { key: '093c7175e86665f0abd9605b285457f781728ed4', class: this.classes, href: this.openOnClick ? undefined : this.href, "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onClick: this.openOnClick ? this.handleItemClick : undefined }, this.icon && iconWithBubble, h("div", { key: '1ebefc0a2c2720a322ea4f17cef9d6ad57fb3b66', class: "spw-sidebar-navigation-item__content" }, h("div", { key: '3ef87e923450741e4de16b9dc0a86389d456d244', class: "spw-sidebar-navigation-item__content-label" }, h("slot", { key: '096cb57b80da603a60e7798c66e007c4519894e8' })), this.hasDropdown && (h("div", { key: 'a033beda58807382cacaa33263cbfa19cf1fdd0a', class: toggleClasses, onClick: this.handleDropdownToggle, tabIndex: this.disabled ? -1 : 0 }, h("spw-icon", { key: '0caaf1e1e4bffef7d4ce33be187e002ff12cd740', icon: "fa-chevron-down" }))), h("slot", { key: '58fd1757d385d65e498e7db49788ad940e829b6f', name: "dropdown" }))));
+        return (h(Tag, { key: '6a47b6fbc8ddcfc7116ba137155a53f0301127b8', class: this.classes, href: this.openOnClick ? undefined : this.href, "aria-disabled": this.disabled ? 'true' : undefined, tabIndex: this.disabled ? -1 : 0, onClick: this.openOnClick ? this.handleItemClick : undefined }, this.icon && iconWithBubble, h("div", { key: '810babe3a6966ddf99f2944ff702b6c55874b770', class: "spw-sidebar-navigation-item__content" }, h("div", { key: '8425351daa767c2529f1c56144551d6193514024', class: "spw-sidebar-navigation-item__content-label" }, h("slot", { key: '9151b15755ab6f89d38d411a3f1f24617b4b0a64' })), this.hasDropdown && (h("div", { key: 'c75983616ee771d2fd77a81d02e1d10b93ac66a0', class: toggleClasses, onClick: this.handleDropdownToggle, tabIndex: this.disabled ? -1 : 0 }, h("spw-icon", { key: '4c35cea803b47563eb84196e4e5f104cccdc4604', icon: "fa-chevron-down" }))), h("slot", { key: 'ab421b69d0f31dbaaeea2e1128b3456da27890da', name: "dropdown" }))));
     }
     static get is() { return "spw-sidebar-navigation-item"; }
     static get originalStyleUrls() {

package/dist/collection/components/spw-sidebar/spw-sidebar-navigation-separator/spw-sidebar-navigation-separator.css

@@ -39,6 +39,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -325,7 +326,7 @@ template {
 }
 
 :root {
-  --spw-ds-container-xl: 1232px;
+  --spw-ds-container-xl: 1200px;
   --spw-ds-container-lg: 1024px;
   --spw-ds-container-md: 768px;
   --spw-ds-container-sm: 640px;
@@ -338,7 +339,7 @@ template {
   margin-left: auto;
   margin-right: auto;
 }
-@media (min-width: 460px) {
+@media (min-width: 360px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-sm);
   }
@@ -353,7 +354,7 @@ template {
     max-width: var(--spw-ds-container-lg);
   }
 }
-@media (min-width: 1350px) {
+@media (min-width: 1200px) {
   .spw-ds-container {
     max-width: var(--spw-ds-container-xl);
   }