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

package/dist/collection/components/spw-cookies/spw-cookies.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-custom-select/spw-custom-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-custom-select/spw-custom-select.js

@@ -44,6 +44,8 @@ export class SpwCustomSelect {
         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 */
@@ -364,16 +366,11 @@ export class SpwCustomSelect {
         this.focusedOptionIndex = null;
         this.searchText = '';
     }
-    slugify(str) {
-        return this.normalizeString(str)
-            .replace(/\s+/g, '-')
-            .replace(/[^a-z0-9-]/g, '');
-    }
     addCreatedOption(label) {
         const trimmed = label.trim();
         if (!trimmed)
             return;
-        const value = this.slugify(trimmed);
+        const value = trimmed;
         const newOption = { label: trimmed, value, created: true };
         this.parsedOptions = [...this.parsedOptions, newOption];
         this.optionCreated.emit(newOption);
@@ -488,22 +485,22 @@ export class SpwCustomSelect {
     }
     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" })));
         }
     }
     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" })));
         }
     }
     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" })));
         }
     }
     get elementClass() {
@@ -583,19 +580,19 @@ export class SpwCustomSelect {
         const filteredOptions = this.getFilteredOptions();
         const showPlaceholder = this.showPlaceholder();
         const showCreate = this.showCreateButton();
-        return (h("div", { key: '4bb22979651b6946dd66fc9844f205e59d0a5411', class: this.elementClass, ref: el => (this.host = el) }, this.label && (h("spw-field-label", { key: '4d9c26597da16ec05bc8aee0c2a03413ea17ff50', 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: '85594d2693007a09d2d1b70b9f5bc61056548ee2', class: "spw-custom-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '53fe8200e2e8ec025c9148bb76a4bd7418068513', class: "spw-custom-select__wrapper" }, h("div", { key: '79b757cffef9f53eb738d2e11aee592e63211841', class: "spw-custom-select__container", id: this.name, ref: el => (this.selectContainer = el), onClick: event => this.toggleDropdown(event), onKeyDown: event => this.handleKeyDown(event), tabindex: this.disabled ? -1 : 0 }, h("div", { key: 'c502d3c270203b548990cfab7d45394557314334', class: "spw-custom-select__selected" }, this.isSearchVisible() && (h("div", { key: '9134c7f87988d3f0efb6c8095646bb6a1ca8ebd0', class: "spw-custom-select__search" }, h("input", { key: '0a5b873ac75d71f480e1209184fa0e63552632b9', class: "spw-custom-select__search-input", placeholder: this.searchPlaceholder, onInput: event => this.handleSearchInput(event), value: this.searchText }), showCreate && this.isOpen && this.hasSelectedValue && (h("button", { key: '7ecf48c56ddb8a7918a38b37b0dbfb47994fc0af', class: "spw-custom-select__create-btn spw-custom-select__create-btn--big", type: "button", onMouseDown: (event) => {
+        return (h("div", { key: '075816be82b83e4ff87e3b8acb699331e1b93873', class: this.elementClass, ref: el => (this.host = el) }, this.label && (h("spw-field-label", { key: '9243de1d006313839fd75cdfd960135608e19802', 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: 'b9187b59eae8c1cb618ef72fbf2057a80890717d', class: "spw-custom-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'eb3d52c7e08d22a6824b861a423e41473add308c', class: "spw-custom-select__wrapper" }, h("div", { key: '3ea2df7f2171d795fc681e1e54f4a15abe5ce6a3', class: "spw-custom-select__container", id: this.name, ref: el => (this.selectContainer = el), onClick: event => this.toggleDropdown(event), onKeyDown: event => this.handleKeyDown(event), tabindex: this.disabled ? -1 : 0 }, h("div", { key: '02a97e4e274bdfb8edc3018efc3f69277e16e6a2', class: "spw-custom-select__selected" }, this.isSearchVisible() && (h("div", { key: '93275dd4f05996654df1a4cdce1aa0b0c35ede52', class: "spw-custom-select__search" }, h("input", { key: '495ebc87298b60ce23adafa5970dd7068d1ba51a', class: "spw-custom-select__search-input", placeholder: this.searchPlaceholder, onInput: event => this.handleSearchInput(event), value: this.searchText }), showCreate && this.isOpen && this.hasSelectedValue && (h("button", { key: '19e031a37c9416f08dc8f86d82e5126b678e4915', class: "spw-custom-select__create-btn spw-custom-select__create-btn--big", type: "button", onMouseDown: (event) => {
                 event.preventDefault();
                 event.stopPropagation();
                 this.addCreatedOption(this.searchText);
-            } }, h("spw-icon", { key: '078c09832bcce6f476a83be55bc54e4cd19223bc', icon: "fa-plus" }))))), showPlaceholder && h("span", { key: '29e59d519f39c3dcafe60a169b2a01adee8904f7' }, this.placeholder), this.multiple && this.internalValue.length > 0 && (h("div", { key: '205e9ebc3bf531b76fc0abdbb760c214a08b6623', class: "spw-custom-select__selected-items" }, this.internalValue.map(val => {
+            } }, h("spw-icon", { key: '23bb75e44c6a1f74274c87be82ca5ef55ce1272c', icon: "fa-plus" }))))), showPlaceholder && h("span", { key: 'a80921899ec9687857323eee0296ad44b6c775e0' }, this.placeholder), this.multiple && this.internalValue.length > 0 && (h("div", { key: '1bfa5decab9a3051d6c3641b0cc01e5d93c863a9', class: "spw-custom-select__selected-items" }, this.internalValue.map(val => {
             var _a;
             return (h("span", { class: "spw-custom-select__selected-item" }, (_a = this.parsedOptions.find(option => String(option.value) === String(val))) === null || _a === void 0 ? void 0 :
                 _a.label, h("spw-icon", { icon: "fa-times", class: "spw-custom-select__deselect-icon", onClick: event => this.selectOption(val, event) })));
-        }))), !this.multiple && h("span", { key: '67eb1e59a69443c63cfe030421a45dd9ed98d626' }, this.getSelectedLabels()))), h("div", { key: 'd36ae8e7dbcbdf5d3895482bf94ce352ccb2deb2', class: "spw-custom-select__icons" }, showCreate && !(this.isOpen && this.hasSelectedValue) && (h("button", { key: 'd5ab27383e5915b3a6a23e2a4c233e37b56bdcda', class: "spw-custom-select__create-btn", type: "button", onMouseDown: (event) => {
+        }))), !this.multiple && h("span", { key: '0a386c27e0eba81c3580d49618d61f218b27133a' }, this.getSelectedLabels()))), h("div", { key: 'deb6c2cd37ce5db9586c7f3d0b5a51f7871d1b15', class: "spw-custom-select__icons" }, showCreate && !(this.isOpen && this.hasSelectedValue) && (h("button", { key: 'eb087835e04d9010419c7bade6655ebb54fdd166', class: "spw-custom-select__create-btn", type: "button", onMouseDown: (event) => {
                 event.preventDefault();
                 event.stopPropagation();
                 this.addCreatedOption(this.searchText);
-            } }, h("spw-icon", { key: '00e486f257d3576fe5a481320685c0f73ac76b43', icon: "fa-plus" }))), this.isClear && (this.hasSelectedValue || !!this.searchText) && (h("span", { key: '522cc58133eebfc86d8f64ab549905f4d7dc85ea', class: "spw-custom-select__clear", onClick: event => this.handleClear(event) }, h("spw-icon", { key: '4afc256de08bae62efde4d0903a2fa2de4438d89', icon: "fa-xmark" }))), h("div", { key: 'ae0fb99288bad447c52288df66afdcf042c139d8', class: "spw-custom-select__arrow" }, h("spw-icon", { key: '2166910463c05b09b845eab799fbb13b63bcc06f', icon: this.isOpen ? 'fa-chevron-up' : 'fa-chevron-down' }))), this.isOpen && (h("div", { key: '2331976d5867174852a1394987bf6bdf8545a3f2', class: {
+            } }, h("spw-icon", { key: '51245fd24e580561380ad325f7d712e5c2e4c6c5', icon: "fa-plus" }))), this.isClear && (this.hasSelectedValue || !!this.searchText) && (h("span", { key: 'b3c328e3303be083386a573e2f0531bcf3b3fd8c', class: "spw-custom-select__clear", onClick: event => this.handleClear(event) }, h("spw-icon", { key: '901f42f0b454d290e3e5083de84f930493795dce', icon: "fa-xmark" }))), h("div", { key: 'ae1a3dc6f013d68f359a5030e2515e6e82130d92', class: "spw-custom-select__arrow" }, h("spw-icon", { key: 'cf6e35d678d4e89d5d4c41f3729a440e257d1bde', icon: this.isOpen ? 'fa-chevron-up' : 'fa-chevron-down' }))), this.isOpen && (h("div", { key: '2756a3d722f0ea5b999a982e2dca80bfb5a31f0f', class: {
                 'spw-custom-select__options': true,
                 [`spw-custom-select__options--${this.dropdownDirection}`]: true,
                 'spw-custom-select__options--fixed': this.fixedDropdown,
@@ -606,7 +603,7 @@ export class SpwCustomSelect {
                     left: `${this.dropdownPosition.left}px`,
                     width: `${this.dropdownPosition.width}px`,
                 }
-                : {} }, h("div", { key: '43dd9a1b026ff6aac3a4d309e4f4e950156566ef', class: "spw-custom-select__options-list" }, !!filteredOptions.length && (h("ul", { key: 'dc42399871b8b4286a440a9c5da7c618301ca330' }, filteredOptions.map((option, index) => (h("li", { class: {
+                : {} }, h("div", { key: '068f62410b9cd62d382e3158eec764a046b57a72', class: "spw-custom-select__options-list" }, !!filteredOptions.length && (h("ul", { key: 'f6cf9b974716fa92042ab6b07c5e5d4337d8b1e1' }, filteredOptions.map((option, index) => (h("li", { class: {
                 'spw-custom-select__option': true,
                 'spw-custom-select__option--selected': this.multiple
                     ? this.internalValue.some(val => String(val) === String(option.value))
@@ -614,7 +611,7 @@ export class SpwCustomSelect {
                 'spw-custom-select__option--focused': index === this.focusedOptionIndex,
                 'spw-custom-select__option--disabled': option.disabled,
                 'spw-custom-select__option--created': !!option.created,
-            }, onClick: () => this.selectOption(option.value) }, this.multiple && (h("spw-checkbox", { onKeyDown: event => this.handleOptionKeyDown(event, option.value), class: "spw-custom-select__checkbox", checked: this.internalValue.some(val => String(val) === String(option.value)), disabled: option.disabled })), option.label, option.created && (h("spw-icon", { class: "spw-custom-select__option-remove", icon: "fa-trash", onClick: (event) => this.removeCreatedOption(option, event) }))))))), !filteredOptions.length && h("p", { key: '16b8fc9d36f71937588d8f57ddf593380766a5a8', class: "spw-custom-select__no-results" }, this.noResultsText)), this.hasSlottedFooter && (h("div", { key: 'c273c08ab20c4d80b26045fba0bc8abca5564851', class: "spw-custom-select__options-footer" }, h("slot", { key: 'f54f6b94a36cc064f8820a6892cfb02b05e039b1', name: "footer" })))))), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+            }, onClick: () => this.selectOption(option.value) }, this.multiple && (h("spw-checkbox", { onKeyDown: event => this.handleOptionKeyDown(event, option.value), class: "spw-custom-select__checkbox", checked: this.internalValue.some(val => String(val) === String(option.value)), disabled: option.disabled })), option.label, option.created && (h("spw-icon", { class: "spw-custom-select__option-remove", icon: "fa-trash", onClick: (event) => this.removeCreatedOption(option, event) }))))))), !filteredOptions.length && h("p", { key: 'f20a6196114b89a9e69cdce4f50e7107078c5ee1', class: "spw-custom-select__no-results" }, this.noResultsText)), this.hasSlottedFooter && (h("div", { key: 'fd36a7e651b572c32aa0340d3edff0e1d5b0e31b', class: "spw-custom-select__options-footer" }, h("slot", { key: '6601ff4fcfb2c51fa1b8fddcd9ff6f9f5fdcebec', name: "footer" })))))), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
     }
     static get is() { return "spw-custom-select"; }
     static get encapsulation() { return "shadow"; }
@@ -1051,6 +1048,64 @@ export class SpwCustomSelect {
                 "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"
+            },
             "tooltipTitle": {
                 "type": "string",
                 "mutable": false,

package/dist/collection/components/spw-date-picker/spw-date-picker.css

@@ -42,6 +42,7 @@ ul {
 :host *::after {
   box-sizing: inherit;
   font-family: var(--spw-ds-font-main);
+  letter-spacing: -0.18px;
 }
 
 /* Sections
@@ -328,7 +329,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;
@@ -341,7 +342,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);
   }
@@ -356,7 +357,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-date-picker/spw-date-picker.js

@@ -32,6 +32,8 @@ export class SpwDatePicker {
         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;
         /** Indique si le champ peut être effacé avec un bouton */
         this.isClear = false;
         /** Positionnement du tooltip */
@@ -908,7 +910,7 @@ export class SpwDatePicker {
             'spw-date-picker--is-clear': this.isClearIconVisible,
         };
         const errorMessage = this.error || this.internalError;
-        return (h(Host, { key: '532d487da5196336bc86cfa98eb2b0cf4812fdfa' }, h("div", { key: 'bd0182c0dc06cf9a5ea846513bee1960c4a6b567', class: containerClass }, this.label && (h("spw-field-label", { key: 'aa8311ff9e5d1214a8b83613b01dd0fe75981542', label: this.label, 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: 'ddf1fee6b4ac1e18c8bc6ddf433dcb58d07bfb87', class: "spw-date-picker__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '8445c6f924ce87b0a630b55d15bcf439f7ae208b', class: "spw-date-picker__input-container" }, h("input", { key: '2dccede48303f05eba9fa4f37cb179f6dd8eda65', ref: el => (this.inputElement = el), id: this.uniqueId, type: "text", class: inputClass, value: this.internalValue, placeholder: this.placeholder, disabled: this.disabled, required: this.required, onFocus: this.handleInputFocus, onInput: this.handleInputChange, onKeyDown: this.handleKeyDown, "aria-label": this.accAriaLabel || this.label || this.name, "aria-describedby": this.assistiveText || errorMessage ? `${this.uniqueId}-help ${this.uniqueId}-error` : undefined, "aria-invalid": this.hasError }), h("div", { key: '0d2a94739a90dce420005bab0639cadb29444939', class: "spw-date-picker__icons" }, this.isClearIconVisible && (h("span", { key: '37b50fb2c43d2ca1be2a39b7ce9dc65e84b1b69c', class: "spw-date-picker__clear", onClick: this.handleClear }, h("spw-icon", { key: '4668571785391971ff209c46bf74f71306487f28', class: "spw-date-picker__icon spw-date-picker__icon--clear", icon: "fa-xmark" }))), h("span", { key: '14714c220f11d9b223a69354725bddbe36eed30a', class: "spw-date-picker__calendar-trigger", onMouseDown: this.handleCalendarIconMouseDown, onClick: this.handleCalendarIconClick }, h("spw-icon", { key: '67ccce624a7aed6324d48be9d3ed7c0adbf2cedf', icon: "fa-calendar", variant: "fa-regular", class: "spw-date-picker__icon spw-date-picker__icon--calendar" })))), this.error && (h("spw-field-message", { key: '7d138427f2e0a4c9863a3f041006cb0113caf038', variant: "error", showIcon: this.showErrorIcon }, this.error)), this.hint && (h("spw-field-message", { key: 'fd3265202be2901f1ad32e8343cfd2193366d201', variant: "hint", showIcon: this.showHintIcon }, this.hint)), this.success && (h("spw-field-message", { key: '085721c834bf6adfbd45ff15d3bdaaf1b4af72fb', variant: "success", showIcon: this.showSuccessIcon }, this.success)), this.warning && (h("spw-field-message", { key: '4222fb895d724619a4be4faad50d884ef571e1c9', variant: "warning", showIcon: this.showWarningIcon }, this.warning)))));
+        return (h(Host, { key: '24bb23078497d43361b87764cee792d7ae296828' }, h("div", { key: '6e3b9f7e1a65fa69b3bd3c9ba4e63fbeb76dc49a', class: containerClass }, this.label && (h("spw-field-label", { key: '6aedb3a5a4f43697adc29ce5de2abcdd14c370d6', label: this.label, 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: 'dbf9f864e7e1789496cc518c674fc3c824881de0', class: "spw-date-picker__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: 'be9a9f496f780a27454ee0b43cef2f4fe20e56c9', class: "spw-date-picker__input-container" }, h("input", { key: 'cde538eb71eedfec1c93f27a0ff61273e5a02422', ref: el => (this.inputElement = el), id: this.uniqueId, type: "text", class: inputClass, value: this.internalValue, placeholder: this.placeholder, disabled: this.disabled, required: this.required, onFocus: this.handleInputFocus, onInput: this.handleInputChange, onKeyDown: this.handleKeyDown, "aria-label": this.accAriaLabel || this.label || this.name, "aria-describedby": this.assistiveText || errorMessage ? `${this.uniqueId}-help ${this.uniqueId}-error` : undefined, "aria-invalid": this.hasError }), h("div", { key: 'ac6dfdb23da486fcd7e79ba83633c333b9eadde6', class: "spw-date-picker__icons" }, this.isClearIconVisible && (h("span", { key: '450b1fa90fccf00f73d75fe32501d84b8b750c56', class: "spw-date-picker__clear", onClick: this.handleClear }, h("spw-icon", { key: '05b500767a17e9d055cdc2be6d0ecc2fa7855a5c', class: "spw-date-picker__icon spw-date-picker__icon--clear", icon: "fa-xmark" }))), h("span", { key: '49d866cd2a5b0ec1e472ca354d9d4a61e9613e4c', class: "spw-date-picker__calendar-trigger", onMouseDown: this.handleCalendarIconMouseDown, onClick: this.handleCalendarIconClick }, h("spw-icon", { key: '1ccf5673e72759309e6b96ef7ea421c1a8fe3ba8', icon: "fa-calendar", variant: "fa-regular", class: "spw-date-picker__icon spw-date-picker__icon--calendar" })))), this.error && (h("spw-field-message", { key: '52ba919f73c1a8286470e952a4b979f06bfca5d5', variant: "error", showIcon: this.showErrorIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.error, h("slot", { key: '3721f74e97ffd53fbf79d58d41d763b2bde7fb35', name: "details", slot: "details" }))), this.hint && (h("spw-field-message", { key: '28c7afec7b1d64b7b405820748227a5c544c5d47', variant: "hint", showIcon: this.showHintIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.hint, h("slot", { key: 'a1d69416b92fafc06b18bd08640560bbe562b8a0', name: "details", slot: "details" }))), this.success && (h("spw-field-message", { key: '871ea576dd625b54f1432522706345511dcb4f32', variant: "success", showIcon: this.showSuccessIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.success, h("slot", { key: 'd45b67bfefb312d19846274554a5e3c303bc5245', name: "details", slot: "details" }))), this.warning && (h("spw-field-message", { key: '26abe8209087133b84b03355cda7b7cca9b0d893', variant: "warning", showIcon: this.showWarningIcon, isExpandable: this.isExpandable, expandLabel: this.expandLabel, collapseLabel: this.collapseLabel }, this.warning, h("slot", { key: '38ae8e6a1cfff7fc7eead69a8bed18e3ab789725', name: "details", slot: "details" }))))));
     }
     static get is() { return "spw-date-picker"; }
     static get encapsulation() { return "shadow"; }
@@ -1339,6 +1341,64 @@ export class SpwDatePicker {
                 "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"
+            },
             "assistiveText": {
                 "type": "string",
                 "mutable": false,