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

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

@@ -172,13 +172,13 @@ export class SpwModal {
         };
     }
     render() {
-        return (h(Host, { key: '4eb87501a9a4cc098250700f58c027e3f3fc13c6' }, h("div", { key: '100bc778f67fca4ebc8ca8e1933033a362f94c24', ref: el => (this.modalContainer = el), class: this.elementClass }, h("div", { key: '56918adc60d5b97ffd43e66323a4fc28f72c6297', class: "spw-modal__overlay", onClick: () => this.handleOverlayClick() }), h("div", { key: '65612030c666acfaa5bafccff02b265e2df49408', class: `spw-modal__content-container spw-modal__content-container--${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, h("div", { key: '51ce6d5e32a972e6c7c7ff95844c6aab0793a979', class: "spw-modal__content", ref: el => (this.modalContent = el), onScroll: this.handleContentScroll }, h("div", { key: '92deb26800d917a018012ae8dab17491fdfade57', class: "spw-modal__header" }, h("div", { key: 'a96de8538e42a2ef89c2669459a4921bb818ad03', class: "spw-modal__title-container" }, this.alertIcon && h("spw-icon", { key: '4328a281475bb9fb969234010872d83ad7c7db72', class: "spw-modal__alert-icon", icon: this.alertIcon }), h("h2", { key: '7c16016aaaced617feb2cbdddb225c0de07c9294', class: "spw-modal__caption" }, this.caption)), this.showCloseButton && (h("div", { key: '3cfd868ed08d69d6eacbc2e2908da0f1ae68236e', class: {
+        return (h(Host, { key: '4d8b2a852d14fadd49059e1687d3d89e6fbed545' }, h("div", { key: 'f45893b6cfc0420c97e5f0edf52e7a102582523c', ref: el => (this.modalContainer = el), class: this.elementClass }, h("div", { key: '71122b0a2a0e6f7b9cfcde9f60031c27a91527d0', class: "spw-modal__overlay", onClick: () => this.handleOverlayClick() }), h("div", { key: '1ef1a1c737fbdc74829bab4569a1576ea9f36861', class: `spw-modal__content-container spw-modal__content-container--${this.size}`, role: "dialog", "aria-modal": "true", "aria-label": this.caption }, h("div", { key: '544c297e94fa0f774ac70287b3da2caf3198ecef', class: "spw-modal__content", ref: el => (this.modalContent = el), onScroll: this.handleContentScroll }, h("div", { key: '97b268574a722a7c40ed6fbae5861d40240a9e81', class: "spw-modal__header" }, h("div", { key: 'c0b71b4a9f1cb2b6261832bf2c7fbefa4596bb97', class: "spw-modal__title-container" }, this.alertIcon && h("spw-icon", { key: 'ae93da613c0bb8127467ff7a46224e8901621e1d', class: "spw-modal__alert-icon", icon: this.alertIcon }), h("h2", { key: '71aa181645c3fd5b5a6a05461753706488a68eb9', class: "spw-modal__caption" }, this.caption)), this.showCloseButton && (h("div", { key: 'e27523243deb94c5231fa9b562ca551fcbc97b96', class: {
                 'spw-modal__close-button': true,
                 'spw-modal__close-button--sticky': this.isCloseButtonSticky,
-            }, ref: el => (this.closeButton = el), onClick: () => this.doBeforeClose('CLOSE_BUTTON') }, h("spw-link", { key: '36577f9858f3eaa116b41af3e2654b6a0d803fe5', "icon-position": "right", icon: "fa-xmark" }, this.closeButtonText)))), h("div", { key: 'f1fae039840a285805410fee667a4e5c53d441ea', class: "spw-modal__body" }, h("slot", { key: '199cc1dfa3507fee34d5a86f90c35948ad656549', name: "content" })), h("div", { key: '83bfe6dfccb359f373c3e0b7080893a716eb6812', class: { 'spw-modal__buttons': true, 'spw-modal__footer--buttons-present': this.slotButtonsPresent } }, h("slot", { key: '7bc4e5745527068f0cc6eb2bfedc7440e99a0199', name: "buttons", onSlotchange: (e) => {
+            }, ref: el => (this.closeButton = el), onClick: () => this.doBeforeClose('CLOSE_BUTTON') }, h("spw-link", { key: 'a29e03373ed1ff5cb3189892b6376bbc544ccfdf', "icon-position": "right", icon: "fa-xmark" }, this.closeButtonText)))), h("div", { key: 'c5dc79129a19705c253335df8da4ebaa09b4d4fc', class: "spw-modal__body" }, h("slot", { key: 'fa86aff282530c89ff2d15535a74d96ba96c3b41', name: "content" })), h("div", { key: 'bbba5a819fb00ef23a1ff041821293a07a7650bf', class: { 'spw-modal__buttons': true, 'spw-modal__footer--buttons-present': this.slotButtonsPresent } }, h("slot", { key: 'dc7a8b982b73c92ca3d37e51f02dc76019f22b60', name: "buttons", onSlotchange: (e) => {
                 const slot = e.target;
                 this.slotButtonsPresent = slot.assignedNodes({ flatten: true }).length > 0;
-            } })))), h("div", { key: '57d4de3c3d2d5769b14388d16c30471091007af0', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
+            } })))), h("div", { key: '3cf2bcab0da6003c7b5f11db93e359607e934f04', "data-focus-trap-edge": true, onFocus: this.handleBottomFocus, tabindex: "0" }))));
     }
     static get is() { return "spw-modal"; }
     static get encapsulation() { return "shadow"; }

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: '82c0e3a358daf0c96c0c4799fdf208e6e22e0e88' }, h("slot", { key: '5e094652b85b1fa2eddcf611b9e4fd74159fcbb3' })));
+        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: 'a2878c9196d2cb6eb75ac2b406a951c2eafb8f17' }, h("div", { key: 'b57c237e408c7b6c8d1759886d695bee866f19e1', class: this.elementClass }, h("slot", { key: '4bcadc41dd9e4d4319f284f627e803dae17b62ab' }))));
+        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: 'dcd1498e29ee3fb0a7aacfcf837cf779941390c0', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: 'b15634e85c1082de7220d634d703583cfe000cc0', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: 'e15c7fd09d198cced97501c8eeac814e6c72e45e', icon: "fa-chevron-left" }), " ", h("span", { key: '417047243b0821163a0e107fb5f810c60758a899', class: "spw-pagination__item-arrow-text" }, this.previousButtonText))));
-        const nextArrow = showNextArrow && (h("li", { key: 'dfad6e553a19c22f6f7ecca0a0c0b41a190370a9', class: "spw-pagination__item spw-pagination__item--desktop spw-pagination__item--arrow" }, h("button", { key: '278d707a4394e2225cf6c9bf50ae1146b54914fd', onClick: () => this.goToPage(this.currentPage + 1) }, h("span", { key: '47b58d5f383d2aee5335ce3e3520593ae6b8fdc1', class: "spw-pagination__item-arrow-text" }, this.nextButtonText), " ", h("spw-icon", { key: 'aaeb333a63ce999845ff481283d65d359b498626', icon: "fa-chevron-right" }))));
-        const prevArrowMobile = this.currentPage > 1 && (h("li", { key: '67d470dd7ec978d778bf9501f7ff4f0d53e8fd74', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '1ef874caef38ad58bfef892f7ff3d3c6a92f1e13', onClick: () => this.goToPage(this.currentPage - 1) }, h("spw-icon", { key: '615092ac9a6fd45d24fba1625ff16f5ab83bcd08', icon: "fa-chevron-left" }), " ", h("span", { key: '68890a0dc95b5356e08002ecd2e8917f024ea2dd' }, this.previousButtonText))));
-        const nextArrowMobile = this.currentPage < this.totalPages && (h("li", { key: 'b3ec5c4edbbf33b3c3597e2e8269d390cdf13f3d', class: "spw-pagination__item spw-pagination__item--arrow" }, h("button", { key: '183cf1b1d5d6a92f7738674e3d2e9cb7f060af57', onClick: () => this.goToPage(this.currentPage + 1), disabled: this.currentPage >= this.totalPages }, h("span", { key: '7dfbc497fa94d90984af376e5e20a46621ef4402' }, this.nextButtonText), " ", h("spw-icon", { key: '0aa1fef8996bf23df1eda494cb8f1d9ef6a857b9', icon: "fa-chevron-right" }))));
-        const mobileArrows = (h("ul", { key: 'bb0d46915afe5a30ed9751d858a7046a026d0ff4', class: "spw-pagination__mobile-arrows" }, prevArrowMobile, nextArrowMobile));
-        return (h(Host, { key: '044cde627233453d74e4a55bfea69d8199513b72' }, h("div", { key: '7e49988f7e2331a3b986cb9644fb51b5e3e25997', class: this.getPaginationClass() }, this.variant === 'input' && (h(Fragment, { key: '721f2508e7980a7d017d57bd35571bea3d7e7478' }, h("ul", { key: 'ed8562aa281db341405e2d7a7374e1890e63ae16' }, prevArrow, h("li", { key: '0f0a0a41bc898e82c1293d59892a2278de1f3e2a', class: "spw-pagination__input" }, h("spw-text-field", { key: '09eb4b0c43e1bc8b0d598d5144bf8defcf772f4b', value: this.inputPageValue, type: "text", name: "pagination-input", onInput: event => this.handleInputChange(event), onKeyDown: event => this.handleKeyDown(event), disabled: this.isDisabled })), h("li", { key: '638c548a6d33678719f9c9543eb3b99a9b52a7d9', class: "spw-pagination__total-pages" }, "sur ", this.totalPages, " ", this.totalPages === 1 ? 'page' : 'pages'), nextArrow), mobileArrows)), this.variant === 'numbers' && (h(Fragment, { key: 'a88d47012d933c68cb648223cf0e2de3e0b4b1e5' }, h("ul", { key: '88d35c75e74693c3cefc806a9592bbf96103add8' }, 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: 'a781adf38f9770b007e32e827af954e56a30c7f2', class: "spw-radio" }, h("input", { key: '8a69300ce3b900c0ee7ea36253cf7ec816f70398', 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: '8c06d8b2581204f2ddbdbd1440694052039498a0', class: `spw-radio__label ${this.disabled ? 'spw-radio__label--disabled' : ''}`, onClick: e => this.handleRadio(e) }, h("slot", { key: '9434b6826bc54470f91e5529acf6150348b8b437' }))), h("div", { key: '34ce75e3e5ef4bfbc3893d77fa585ad952770275', 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: '16d4f2247dd961d5d9f5c9dfccc600dab309548d', 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: 'a9133326637d4aa8f58f2970407dbd59ea168791', class: this.hostClass }, h("spw-button", { key: '13f119dd0ae45ac9f50ec52020b4555405931fa4', "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: 'd74452bbc8830cf494100c3f6510988104a5b754', 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: '968a8719643921e9d8453b0d2fcdd87ea2c1e933', class: this.classes }, h("div", { key: '2ac5caa680ebd83fdc07f653d7fceb8b2a4a0d27', class: "spw-sidebar-navigation-dropdown__content", style: { display: this.open ? 'block' : 'none' } }, h("slot", { key: 'ee24630234c1e6af964b327951108bd2528e9033' }))));
+        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: '4700c5778d91fb367ffcf90c55b31d1eb78282e7', variant: this.iconVariant, icon: this.icon });
-        const iconDiv = (h("div", { key: '2406404742b25ff81bebd21d17e397b631ab950c', class: "spw-sidebar-navigation-item__icon" }, this.bubble && h("span", { key: '1cffd6dae86d4f0c2e0443a8b0dbd174ca657999', 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: 'ccb7079d463215f671582dfe3f4d41acb2a53c84', 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: '557a4716bddf11ddad7a738feeac2d2bbffad344', class: "spw-sidebar-navigation-item__content" }, h("div", { key: 'a7052155045a1d884b68bf8a83ab6387eef18c9d', class: "spw-sidebar-navigation-item__content-label" }, h("slot", { key: '51bb492ca65770f8ddb4232fdf640a0b813dee4b' })), this.hasDropdown && (h("div", { key: '519714001a45ccfdd55b074f34fb2540b214b358', class: toggleClasses, onClick: this.handleDropdownToggle, tabIndex: this.disabled ? -1 : 0 }, h("spw-icon", { key: 'fec943dfcfcb4ec8047df513aae3e34a2b66db7e', icon: "fa-chevron-down" }))), h("slot", { key: '7f241804786a5a00dee11516dbee994779b05c4b', 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() {