@spw-ds/spw-stencil-library 1.10.2 → 1.11.0

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

@@ -35,7 +35,7 @@ export class SpwBreadcrumbItem {
         this.el.classList.add(`spw-breadcrumb-item--${this.surface}`);
     }
     render() {
-        return (h(Host, { key: 'a07d5ca9937a66747f3a57b1aaec669cb8739852' }, h("div", { key: '59635c4d896f644da3fbac9e15f9318f667d1bde', role: "listitem", class: `spw-breadcrumb-item spw-breadcrumb-item--${this.surface}` }, this.href ? (h("spw-link", { href: this.href, surface: this.surface }, h("slot", null))) : (h("span", { class: "spw-breadcrumb-item__text", "aria-current": "page" }, h("slot", null))))));
+        return (h(Host, { key: '68661d36076f8e2ded2e0d3d438157e4bf5eeba7' }, h("div", { key: '9bbabf1f3d7a3d5655b08670e4f021adc48c50c3', role: "listitem", class: `spw-breadcrumb-item spw-breadcrumb-item--${this.surface}` }, this.href ? (h("spw-link", { href: this.href, surface: this.surface }, h("slot", null))) : (h("span", { class: "spw-breadcrumb-item__text", "aria-current": "page" }, h("slot", null))))));
     }
     static get is() { return "spw-breadcrumb-item"; }
     static get encapsulation() { return "shadow"; }

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

@@ -43,7 +43,7 @@ export class SpwBreadcrumb {
             [`spw-breadcrumb--font-size-${this.fontSize}`]: true,
             [`spw-breadcrumb--${this.variant}`]: true,
         };
-        return (h(Host, { key: '74660bd9340877c273c3c9c8753a8472da5ce1f3' }, h("nav", { key: '2d224aa0a9a5bba745ebd677397436e49ddae4a5', "aria-label": this.accAriaLabel, class: elementClass }, h("div", { key: '147da2b5f6255a234bf4a6497cae2d468b5396c1', role: "list", class: "spw-breadcrumb__list" }, h("slot", { key: '2aa870373a7a87824fcff249a5de6d18f1675ed9' })))));
+        return (h(Host, { key: '72cd3232357b54b5fa081df2c605ea039b791fd7' }, h("nav", { key: '214606d2a4d13a2d629d9d88aa8a5182be5006c3', "aria-label": this.accAriaLabel, class: elementClass }, h("div", { key: '4ea1cedcd9fcd650e8198c1d613959bbee9f155e', role: "list", class: "spw-breadcrumb__list" }, h("slot", { key: '8cc4da01764ace42c2de886f453e3c322c2f0483' })))));
     }
     static get is() { return "spw-breadcrumb"; }
     static get encapsulation() { return "shadow"; }

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

@@ -401,13 +401,13 @@ template {
   --spw-button-text-decoration: none;
 }
 
-:host([is-full-width]) {
+:host([is-full-width]:not([is-full-width=false])) {
   display: block;
   width: 100%;
 }
 
 @media (max-width: 767px) {
-  :host([is-full-width-mobile]) {
+  :host([is-full-width-mobile]:not([is-full-width-mobile=false])) {
     display: block;
     width: 100%;
   }

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

@@ -109,7 +109,7 @@ export class SpwButton {
             'aria-label': this.accAriaLabel || this.name || slotText || 'Label',
             'aria-disabled': isDisabled ? 'true' : null,
         };
-        return (h(TagType, Object.assign({ key: '316d05271e86ba2531e425a47dcd1721dc8fcf30' }, attrs, { ref: (el) => (this.nativeEl = el), class: this.elementClass, disabled: isDisabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick }, ariaAttributes), h("div", { key: '52f1bddd0970534a429c1648eb23e46a80f99d55', class: "spw-button__inner" }, h("div", { key: '4dfa05084188c5cb185479485a351f4a7bcdfce7', class: "spw-button__inner-text" }, iconPosition === 'left' && iconElement, !this.isIconOnly && h("slot", { key: 'c75a8b4617fa584a0080060132bd19d1b354c381' }), iconPosition === 'right' && iconElement)), h("spw-loading", { key: 'ee0ca7890a7f0bba52c3a5296d69f9fec2992ed7', text: "" })));
+        return (h(TagType, Object.assign({ key: 'af8ac1a8762a7da373014f322ee004297a8295f5' }, attrs, { ref: (el) => (this.nativeEl = el), class: this.elementClass, disabled: isDisabled, onFocus: this.onFocus, onBlur: this.onBlur, onClick: this.onClick }, ariaAttributes), h("div", { key: 'dc40b975fc312377bcbdc89ee1e0da4707893b13', class: "spw-button__inner" }, h("div", { key: 'c5a397c631fd9984fca6f711b1cc890cf1516f79', class: "spw-button__inner-text" }, iconPosition === 'left' && iconElement, !this.isIconOnly && h("slot", { key: '92e532897aa0f62a2c1927026b15a7e81307256c' }), iconPosition === 'right' && iconElement)), h("spw-loading", { key: 'f7ae144bc041a0fa7d189a532a069cf7ed3e3aa5', text: "" })));
     }
     static get is() { return "spw-button"; }
     static get encapsulation() { return "shadow"; }
@@ -474,7 +474,7 @@ export class SpwButton {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
+                "reflect": true,
                 "attribute": "is-full-width",
                 "defaultValue": "false"
             },

package/dist/collection/components/spw-card/spw-card-content/spw-card-content.js

@@ -2,7 +2,7 @@ import { h } from "@stencil/core";
 import { formatDate } from "../../../utils/utils";
 export class SpwCardContent {
     render() {
-        return (h("div", { key: 'd9d47ad3877b66d9113b05050b68bf462b3ed017', class: "spw-card-content" }, this.tag && h("span", { key: '58af78f953da3fc3a6a5b1ce06563f4168353956', class: "spw-card-content__tag" }, this.tag), this.date && (h("time", { key: 'e34eac772387ff3d45eb52318009d6a79889525c', "date-time": this.date, class: "spw-card-content__date" }, formatDate(this.date))), h("slot", { key: '32b34558aa7762681135a1f978473c0d78529f3e' })));
+        return (h("div", { key: '66ceb610e7cb0b66d4aa8287f75f698840a50819', class: "spw-card-content" }, this.tag && h("span", { key: '51e3aa55120ee1ae99fc37843a8cd1d118418b63', class: "spw-card-content__tag" }, this.tag), this.date && (h("time", { key: 'e507fba4526c323f520378e711da8418c3c4b929', "date-time": this.date, class: "spw-card-content__date" }, formatDate(this.date))), h("slot", { key: '104ffaf30fd8c9a3b1d274141971a7c747894fad' })));
     }
     static get is() { return "spw-card-content"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-card/spw-card-excerpt/spw-card-excerpt.js

@@ -13,7 +13,7 @@ export class SpwCardExcerpt {
         };
     }
     render() {
-        return (h(Host, { key: 'df99c81e5c3fcb16f6cca1ef6ca3bae5252ff582' }, h("div", { key: '88c59ddb64c3f5ff1b6138ef461c6117b1ba9c02', class: this.elementClass }, h("slot", { key: '81de29562bda2fe379e217feb457db94686504f1' }))));
+        return (h(Host, { key: '94f53e8e2d7a9c333ab2320ca3f37d13657fece3' }, h("div", { key: '84c391bea45ccec30809e488c8ff12d2e921edbb', class: this.elementClass }, h("slot", { key: 'd9b85510693fe08e8b9951ab7395dca3ebfaa0d9' }))));
     }
     static get is() { return "spw-card-excerpt"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-card/spw-card-image/spw-card-image.js

@@ -50,7 +50,7 @@ export class SpwCardImage {
         if (this.imageFit) {
             style['--spw-card-image-object-fit'] = this.imageFit;
         }
-        return (h("div", { key: 'e1f2601d8b5dc598c49ea7f5551147425c6580ab', class: this.elementClass, style: style }, this.label && h("span", { key: '194e4631adabd4e0614987cbbbd5299a6969ee5a', class: "spw-card-image__label" }, this.label), h("slot", { key: '7de001872d27c26a234a63ebeff2aaa41df007a9' }), h("div", { key: 'a0ce9899948e03a8b845d41fe9c52a720209a1aa', class: "spw-card-image__icon" }, h("spw-icon", { key: 'b713d4db6e672f081587afc829b2040a5ac5a71e', icon: "fa-plus" }))));
+        return (h("div", { key: '4068c0b001f0e42e24f1310fbc1eac023e544b91', class: this.elementClass, style: style }, this.label && h("span", { key: '7413245a62cae16674a7dd0f5bd201b3011c9356', class: "spw-card-image__label" }, this.label), h("slot", { key: '39c2c73eaa4323575d525fe664203200f90dd8c1' }), h("div", { key: '0bd09043e8f6ed6fecbd3ebe3d8ba9b1bf683a59', class: "spw-card-image__icon" }, h("spw-icon", { key: '15c00a9fc5ece402f8a81297fadf83475dd027cf', icon: "fa-plus" }))));
     }
     static get is() { return "spw-card-image"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-card/spw-card-subtag-item/spw-card-subtag-item.js

@@ -12,7 +12,7 @@ export class SpwCardSubtagItem {
         };
     }
     render() {
-        return (h(Host, { key: '309176a0b6b7137b9e20b206dd6d6adcc9bd0255' }, h("span", { key: 'f4cac2ead07892cd662d0d6b4e7a90f9599da6c3', class: this.elementClass, onClick: () => this.handleClick() }, h("slot", { key: '39e95ca92d83f970698ec818738a7e8063173555' }))));
+        return (h(Host, { key: 'b9cc69c396246f2312c714f9a92064051a2a7593' }, h("span", { key: '18ceda99d47d27ff2a465fde67d426590445d3d8', class: this.elementClass, onClick: () => this.handleClick() }, h("slot", { key: '332ea40deefbe4b854c4dbeb07eabbf0c964d61b' }))));
     }
     static get is() { return "spw-card-subtag-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spw-card/spw-card-subtags/spw-card-subtags.js

@@ -26,7 +26,7 @@ export class SpwCardSubtags {
         };
     }
     render() {
-        return (h(Host, { key: 'c23d50a99ea5e9368ea09cca0751bb5ce549b0b0' }, h("div", { key: '3c17f1cf831107c7ce5811fe468ea53ab10f7ce4', class: this.elementClass }, h("slot", { key: '60ac08dbac2350180fb8e3590e096dc24a641979' }))));
+        return (h(Host, { key: '932526d39865c60a98dc2c5b3a725d08116a8435' }, h("div", { key: '5127d371be9c14528be9afa1badbd1278b1ae40c', class: this.elementClass }, h("slot", { key: '06cb3b41922d0f2a4bcc1dee186a01b515581144' }))));
     }
     static get is() { return "spw-card-subtags"; }
     static get originalStyleUrls() {

package/dist/collection/components/spw-card/spw-card-title/spw-card-title.js

@@ -5,7 +5,7 @@ export class SpwCardTitle {
         this.borderColor = '';
     }
     render() {
-        return (h(Host, { key: '4356c7ad9d0981bded5d7debabb2364ef36e8087', style: { '--spw-card-title-border-color': this.borderColor } }, h("h3", { key: '983eeef1db06a2eb721929a8d944b3e8301ab1f4', class: "spw-card-title" }, h("span", { key: 'f4fe9fa98b1a6800c45d1a9cae5a83ca29e2a49b', class: "spw-card-title__text" }, h("slot", { key: 'bf4b013493f59213aeead1db37aea00fcd186bea' })))));
+        return (h(Host, { key: '334d6835dd28e414809f7de8b2f6ad82708d88e6', style: { '--spw-card-title-border-color': this.borderColor } }, h("h3", { key: 'ff00413ca35178fc4cbf60a605fe350e1239e7b7', class: "spw-card-title" }, h("span", { key: '629c669018ecb697c63c9d938b46010c8706b6ba', class: "spw-card-title__text" }, h("slot", { key: 'dac76a2afd228e94dd389122d060304f165743ed' })))));
     }
     static get is() { return "spw-card-title"; }
     static get encapsulation() { return "shadow"; }

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

@@ -120,7 +120,7 @@ export class SpwCard {
             'aria-label': this === null || this === void 0 ? void 0 : this.accAriaLabel,
             'aria-disabled': this.disabled ? 'true' : null,
         };
-        return (h(Host, { key: '1e65d1bc2a62ed8206c9c7410745ac59f7ec1e64', class: { '--is-full-height': this.fullHeight } }, h("article", { key: 'fc543b93cf3119a054f24efcfb4525f6ef3834b1', class: this.elementClass }, variant === 'event' && (h(TagType, Object.assign({ key: '9c0ad157e2d6f679256b0e041073f1471ad20b9f' }, attrs, { class: "spw-card__dates" }), dateStart && h("div", { key: '7262fcf08eb53b3f99875b02f400a36ffe742875', class: "spw-card__date-item" }, this.formatDate(dateStart)), dateEnd && h("div", { key: '41774d02ebe77b9a47c5ba42e27595f62d2c8fb1', class: "spw-card__date-item" }, this.formatDate(dateEnd)))), h(TagType, Object.assign({ key: '14c0955bc08e9d6843c52b0bd83d8f11311023a1' }, attrs, ariaAttributes, { class: "spw-card__link" }), h("slot", { key: '2304c972c6093712e23cd42c83bc2a539592d7ee' })))));
+        return (h(Host, { key: 'a82c4310865f2cc2ce5b446da38c81bfd2bb9678', class: { '--is-full-height': this.fullHeight } }, h("article", { key: 'fe460202702412232d7879197914999fafbbee50', class: this.elementClass }, variant === 'event' && (h(TagType, Object.assign({ key: '9b462c7cfb15fcbef342e40e707d53125ca0ac34' }, attrs, { class: "spw-card__dates" }), dateStart && h("div", { key: '596cb0847afb8da0b8211715ff5141b11a481ab4', class: "spw-card__date-item" }, this.formatDate(dateStart)), dateEnd && h("div", { key: '72b61e7173a55795a0139c4d73260b8c97af9213', class: "spw-card__date-item" }, this.formatDate(dateEnd)))), h(TagType, Object.assign({ key: '4e86eb1a2540512b44964d01cb53e3bc4aeebdde' }, attrs, ariaAttributes, { class: "spw-card__link" }), h("slot", { key: '4b81b7820f5c4ec19c507976c94c49aa74a53db2' })))));
     }
     static get is() { return "spw-card"; }
     static get encapsulation() { return "shadow"; }

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

@@ -75,7 +75,7 @@ export class SpwCheckbox {
     render() {
         const slot = this.el.innerHTML;
         const hasSlot = Boolean(slot);
-        return (h("div", { key: '3c93d12219bc3702648fa36f23a3312dec0c7ef8', class: "spw-checkbox" }, h("input", { key: '5cc40881c8f867c64f3d9ddffc53da0f4dae1c23', type: "checkbox", ref: el => (this.inputElement = el), checked: this.internalChecked, onChange: this.handleCheckbox.bind(this), name: this.name, disabled: this.disabled, style: { display: 'none' } }), hasSlot && (h("label", { key: '3fa58e8024cf04c9b950635a4225594bf6da22d6', htmlFor: this.name, class: `spw-checkbox__label ${this.disabled ? 'spw-checkbox__label--disabled' : ''}`, onClick: e => this.handleCheckbox(e) }, h("slot", { key: 'fb47f566f0aa3e71acd1e08384a1af3f88a6263d' }))), h("div", { key: '117d66c56c2265875dac8a29ffb2901d1b5c86bc', tabindex: this.disabled ? -1 : 0, onClick: e => this.handleCheckbox(e), onKeyDown: this.handleKeydown.bind(this), role: "checkbox", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.accAriaLabel || this.name || 'Label', class: this.elementClass }, this.internalChecked && h("spw-icon", { key: '606602da39984e48e875800f145180f5db8c9a35', icon: this.icon }))));
+        return (h("div", { key: 'c38a01b2898e391335b55297929b50109d892434', class: "spw-checkbox" }, h("input", { key: '2e696c49a36c92eed15f06e64b4a52722fab8062', type: "checkbox", ref: el => (this.inputElement = el), checked: this.internalChecked, onChange: this.handleCheckbox.bind(this), name: this.name, disabled: this.disabled, style: { display: 'none' } }), hasSlot && (h("label", { key: 'aaa5422e96bd40d32972996be19f389cdb276e70', htmlFor: this.name, class: `spw-checkbox__label ${this.disabled ? 'spw-checkbox__label--disabled' : ''}`, onClick: e => this.handleCheckbox(e) }, h("slot", { key: 'baa3fbdb4b6a17b91dba5c6077bd50a1f8207b61' }))), h("div", { key: '36a552efdb1a0afe004d8e518978175cfb788ccb', tabindex: this.disabled ? -1 : 0, onClick: e => this.handleCheckbox(e), onKeyDown: this.handleKeydown.bind(this), role: "checkbox", "aria-checked": this.internalChecked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.accAriaLabel || this.name || 'Label', class: this.elementClass }, this.internalChecked && h("spw-icon", { key: '95cdfbb6513f76bb570e3707cf34cb8ccf8e1107', icon: this.icon }))));
     }
     static get is() { return "spw-checkbox"; }
     static get encapsulation() { return "shadow"; }

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

@@ -527,6 +527,8 @@ template {
   z-index: 11;
   width: 100%;
   margin-top: 1px;
+  display: flex;
+  align-items: center;
 }
 .spw-custom-select--has-value.spw-custom-select--is-opened .spw-custom-select__search {
   top: 100%;
@@ -546,12 +548,17 @@ template {
   border: none;
   margin: 0;
   width: calc(100% - 30px);
+  background: transparent;
+  text-overflow: ellipsis;
 }
 .spw-custom-select--is-clear .spw-custom-select__search-input {
   width: calc(100% - 58px);
 }
-.spw-custom-select__search-input {
-  text-overflow: ellipsis;
+.spw-custom-select--show-create .spw-custom-select__search-input {
+  width: calc(100% - 66px);
+}
+.spw-custom-select--is-clear.spw-custom-select--show-create .spw-custom-select__search-input {
+  width: calc(100% - 94px);
 }
 .spw-custom-select__search-input:focus {
   outline: none;
@@ -562,9 +569,44 @@ template {
 }
 .spw-custom-select--is-opened.spw-custom-select--has-value .spw-custom-select__search-input {
   border: 1px solid var(--spw-color-themes-grey-grey-800);
-  width: 100%;
+  flex: 1;
+  width: auto;
   border-radius: 3px;
 }
+.spw-custom-select__create-btn {
+  flex-shrink: 0;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  height: 28px;
+  padding: 0;
+  padding-top: 2px;
+  width: 28px;
+  line-height: 28px;
+  border: 1px solid var(--spw-color-themes-grey-grey-800);
+  border-radius: 100px;
+  background: #fff;
+  cursor: pointer;
+  color: var(--spw-color-themes-grey-grey-900);
+  font-size: 14px;
+  pointer-events: auto;
+  transition: background 0.15s ease, border-color 0.15s ease;
+}
+.spw-custom-select__create-btn:hover {
+  background: var(--spw-color-themes-grey-grey-200);
+  border-color: var(--spw-color-themes-grey-grey-900);
+}
+.spw-custom-select__create-btn:focus-visible {
+  outline: 3px solid white;
+  box-shadow: 0 0 0 6px black;
+}
+.spw-custom-select__create-btn--big {
+  width: 38px;
+  height: 38px;
+  border-radius: 4px;
+  margin-left: 4px;
+  padding-top: 0;
+}
 .spw-custom-select__options {
   background-color: #fff;
   border: 1px solid var(--spw-color-themes-grey-grey-800);
@@ -637,6 +679,8 @@ template {
   color: var(--spw-color-themes-grey-grey-600);
 }
 .spw-custom-select__option {
+  display: flex;
+  align-items: center;
   border-bottom: 1px solid var(--spw-color-themes-grey-grey-900);
   padding: 12px;
   cursor: pointer;
@@ -658,6 +702,20 @@ template {
 .spw-custom-select__option--disabled:hover {
   background-color: transparent;
 }
+.spw-custom-select__option--created {
+  justify-content: space-between;
+}
+.spw-custom-select__option-remove {
+  padding-left: 4px;
+  margin-left: auto;
+  flex-shrink: 0;
+  font-size: 14px;
+  color: var(--spw-color-themes-grey-grey-600);
+  transition: color 0.15s ease;
+}
+.spw-custom-select__option-remove:hover {
+  color: var(--spw-color-themes-grey-grey-900);
+}
 .spw-custom-select__error {
   display: block;
   font-size: 12px;

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

@@ -54,6 +54,8 @@ export class SpwCustomSelect {
         this.isClear = false;
         /** Direction d'ouverture du dropdown */
         this.direction = 'auto';
+        /** Permet à l'utilisateur d'ajouter une option si elle n'existe pas dans la liste (nécessite isSearch) */
+        this.allowCreate = false;
         this.handleOtherSelectOpened = (event) => {
             if (event.detail.instance !== this.host && this.isOpen) {
                 this.closeDropdown();
@@ -362,6 +364,43 @@ 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 newOption = { label: trimmed, value, created: true };
+        this.parsedOptions = [...this.parsedOptions, newOption];
+        this.optionCreated.emit(newOption);
+        this.selectOption(value);
+        this.searchText = '';
+    }
+    removeCreatedOption(option, event) {
+        event.stopPropagation();
+        // Désélectionne si l'option était sélectionnée
+        if (this.multiple) {
+            const idx = this.internalValue.findIndex(val => String(val) === String(option.value));
+            if (idx > -1) {
+                this.internalValue = [...this.internalValue.slice(0, idx), ...this.internalValue.slice(idx + 1)];
+                this.value = this.internalValue;
+                this.internals.setFormValue(this.getFormValue());
+                this.valueChanged.emit(this.internalValue);
+            }
+        }
+        else if (String(this.internalValue) === String(option.value)) {
+            this.internalValue = '';
+            this.value = '';
+            this.internals.setFormValue(this.getFormValue());
+            this.valueChanged.emit(this.internalValue);
+        }
+        this.parsedOptions = this.parsedOptions.filter(o => String(o.value) !== String(option.value));
+        this.optionRemoved.emit(option);
+    }
     handleClear(event) {
         event.stopPropagation();
         this.resetSelect();
@@ -468,6 +507,7 @@ export class SpwCustomSelect {
         }
     }
     get elementClass() {
+        const showCreate = this.showCreateButton();
         return {
             'spw-custom-select': true,
             [`spw-custom-select--${this.size}`]: true,
@@ -480,6 +520,7 @@ export class SpwCustomSelect {
             'spw-custom-select--is-searchable': this.isSearch,
             'spw-custom-select--not-searchable': !this.isSearch,
             'spw-custom-select--is-clear': this.isClear && (this.hasSelectedValue || !!this.searchText),
+            'spw-custom-select--show-create': showCreate,
         };
     }
     normalizeString(str) {
@@ -532,14 +573,29 @@ export class SpwCustomSelect {
             return false;
         return true;
     }
+    showCreateButton() {
+        if (!this.allowCreate || !this.isSearch || !this.searchText.trim())
+            return false;
+        const normalized = this.normalizeString(this.searchText.trim());
+        return !this.parsedOptions.some(o => this.normalizeString(o.label) === normalized);
+    }
     render() {
         const filteredOptions = this.getFilteredOptions();
         const showPlaceholder = this.showPlaceholder();
-        return (h("div", { key: '90e9ea2c24e199fd3c88f599154845da1ec2d79b', class: this.elementClass, ref: el => (this.host = el) }, this.label && (h("spw-field-label", { key: 'dac0b1830b366bcc713e15f28ef43981a5d5c946', 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: 'e3436cdb0e98e1f697e23c92170db014ff732b43', class: "spw-custom-select__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '9b42be36b6f9a2955b44da1f4498b842d58d4e34', class: "spw-custom-select__wrapper" }, h("div", { key: 'c5cca55daefb235da7b75c9701857d21ce82000a', 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: 'd1c67ff5e7bc7ec049a4d87e1bffd73e66aec7aa', class: "spw-custom-select__selected" }, this.isSearchVisible() && (h("div", { key: 'd92f3a98a85b593370feaba84b63ab566e23cb5e', class: "spw-custom-select__search" }, h("input", { key: 'ca4ce948648c06cebde704d9e0e248e06bf96ccb', class: "spw-custom-select__search-input", placeholder: this.searchPlaceholder, onInput: event => this.handleSearchInput(event), value: this.searchText }))), showPlaceholder && h("span", { key: '2abe144800c9f6d58f5dfa380568a5fefea5d9a8' }, this.placeholder), this.multiple && this.internalValue.length > 0 && (h("div", { key: 'e21d7ec421c049072b9cc408c10ae9e6a51ac816', class: "spw-custom-select__selected-items" }, this.internalValue.map(val => {
+        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) => {
+                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 => {
             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: '00e929e2885410304cab3b22398c9c373073ca6f' }, this.getSelectedLabels()))), h("div", { key: '7b40dc3276b8497a96690424e8338cdcc734d581', class: "spw-custom-select__icons" }, this.isClear && (this.hasSelectedValue || !!this.searchText) && (h("span", { key: '7983ec19d8152fd891f82591f7b56ded9d8301e8', class: "spw-custom-select__clear", onClick: event => this.handleClear(event) }, h("spw-icon", { key: '6b8693b534b39b43e83cea7e8822feb9b956a768', icon: "fa-xmark" }))), h("div", { key: 'd56d83f20216fbccdc403811637c76039c6b5891', class: "spw-custom-select__arrow" }, h("spw-icon", { key: 'c95a0208ac8b9c53f314ab349074142df85cfaaa', icon: this.isOpen ? 'fa-chevron-up' : 'fa-chevron-down' }))), this.isOpen && (h("div", { key: 'e967118beb739a3601b434fcbb97056426eac0a8', class: {
+        }))), !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) => {
+                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: {
                 'spw-custom-select__options': true,
                 [`spw-custom-select__options--${this.dropdownDirection}`]: true,
                 'spw-custom-select__options--fixed': this.fixedDropdown,
@@ -550,14 +606,15 @@ export class SpwCustomSelect {
                     left: `${this.dropdownPosition.left}px`,
                     width: `${this.dropdownPosition.width}px`,
                 }
-                : {} }, h("div", { key: 'aebe7b9b720af8d5e008e3d611940bcc24a9535d', class: "spw-custom-select__options-list" }, !!filteredOptions.length && (h("ul", { key: '3446e6c6182941c087467113e08484ad69365fed' }, filteredOptions.map((option, index) => (h("li", { class: {
+                : {} }, h("div", { key: '43dd9a1b026ff6aac3a4d309e4f4e950156566ef', class: "spw-custom-select__options-list" }, !!filteredOptions.length && (h("ul", { key: 'dc42399871b8b4286a440a9c5da7c618301ca330' }, 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))
                     : option.value === this.internalValue,
                 'spw-custom-select__option--focused': index === this.focusedOptionIndex,
                 'spw-custom-select__option--disabled': option.disabled,
-            }, 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))))), !filteredOptions.length && h("p", { key: 'cf38b5d9a54ba2db0fddee0c722be0078795623f', class: "spw-custom-select__no-results" }, this.noResultsText)), this.hasSlottedFooter && (h("div", { key: 'dfb7fd80d642d9c0a0409d5fdde5f42717d590f4', class: "spw-custom-select__options-footer" }, h("slot", { key: '7a4c4c58b8703e01503b370df7a34f8b0aa93f46', name: "footer" })))))), this.renderErrorMessage(), this.renderHintMessage(), this.renderSuccessMessage(), this.renderWarningMessage()));
+                '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()));
     }
     static get is() { return "spw-custom-select"; }
     static get encapsulation() { return "shadow"; }
@@ -827,7 +884,7 @@ export class SpwCustomSelect {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Texte d'assistance \u00E0 afficher sous le champ"
+                    "text": "Texte d'assistance \u00E0 afficher sous le label"
                 },
                 "getter": false,
                 "setter": false,
@@ -1169,6 +1226,26 @@ export class SpwCustomSelect {
                 "reflect": false,
                 "attribute": "direction",
                 "defaultValue": "'auto'"
+            },
+            "allowCreate": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Permet \u00E0 l'utilisateur d'ajouter une option si elle n'existe pas dans la liste (n\u00E9cessite isSearch)"
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "allow-create",
+                "defaultValue": "false"
             }
         };
     }
@@ -1201,6 +1278,48 @@ export class SpwCustomSelect {
                     "resolved": "(string | number)[] | number | string",
                     "references": {}
                 }
+            }, {
+                "method": "optionCreated",
+                "name": "optionCreated",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u00C9v\u00E9nement \u00E9mis lorsqu'une nouvelle option est cr\u00E9\u00E9e via le champ de recherche"
+                },
+                "complexType": {
+                    "original": "SelectItem",
+                    "resolved": "SelectItem",
+                    "references": {
+                        "SelectItem": {
+                            "location": "local",
+                            "path": "/Users/pectonite/Desktop/SPW/spw-design-system/packages/spw-stencil-library/src/components/spw-custom-select/spw-custom-select.tsx",
+                            "id": "src/components/spw-custom-select/spw-custom-select.tsx::SelectItem"
+                        }
+                    }
+                }
+            }, {
+                "method": "optionRemoved",
+                "name": "optionRemoved",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "\u00C9v\u00E9nement \u00E9mis lorsqu'une option cr\u00E9\u00E9e est supprim\u00E9e"
+                },
+                "complexType": {
+                    "original": "SelectItem",
+                    "resolved": "SelectItem",
+                    "references": {
+                        "SelectItem": {
+                            "location": "local",
+                            "path": "/Users/pectonite/Desktop/SPW/spw-design-system/packages/spw-stencil-library/src/components/spw-custom-select/spw-custom-select.tsx",
+                            "id": "src/components/spw-custom-select/spw-custom-select.tsx::SelectItem"
+                        }
+                    }
+                }
             }];
     }
     static get methods() {

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

@@ -908,7 +908,7 @@ export class SpwDatePicker {
             'spw-date-picker--is-clear': this.isClearIconVisible,
         };
         const errorMessage = this.error || this.internalError;
-        return (h(Host, { key: '32fda3ad55541f1f01f642767f858d34d6a0024e' }, h("div", { key: 'a0faea1339d67bcb275aeee5376931074ccc2868', class: containerClass }, this.label && (h("spw-field-label", { key: '1863da889dcb1b82a0d49f69be999b667fb5c91e', 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: 'a5aa7018207c305640ee07dc92b251f2cd439565', class: "spw-date-picker__field-message", variant: "hint", showIcon: false }, this.assistiveText)), h("div", { key: '5a23a4432a0a0ed30594fd0845f983f3ec6cbf88', class: "spw-date-picker__input-container" }, h("input", { key: '04a9b370e0ffb263aa798cc6b6d084dcace2b5a2', 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: 'a635b1611eb9183972ee38174e828d08893193eb', class: "spw-date-picker__icons" }, this.isClearIconVisible && (h("span", { key: 'd64c8fb2c387354808a701f8a3872107a87a65ad', class: "spw-date-picker__clear", onClick: this.handleClear }, h("spw-icon", { key: 'ae39233eec8f792eef57cb8fa29b86520d695e78', class: "spw-date-picker__icon spw-date-picker__icon--clear", icon: "fa-xmark" }))), h("span", { key: 'ff01a8db8582dd9ce909609524fc481bfb3be24a', class: "spw-date-picker__calendar-trigger", onMouseDown: this.handleCalendarIconMouseDown, onClick: this.handleCalendarIconClick }, h("spw-icon", { key: 'c8ffae53c5dad546abf185e63ab6210801d7f31f', icon: "fa-calendar", variant: "fa-regular", class: "spw-date-picker__icon spw-date-picker__icon--calendar" })))), this.error && (h("spw-field-message", { key: '0605af92c5d84c8d6feab3a0425f49c3f2945b75', variant: "error", showIcon: this.showErrorIcon }, this.error)), this.hint && (h("spw-field-message", { key: '38acac99be7fc4485a11b5b08f98c8f7fd480b4d', variant: "hint", showIcon: this.showHintIcon }, this.hint)), this.success && (h("spw-field-message", { key: '3b7205d8e7586167766ec97f444f2f8aff8c5aeb', variant: "success", showIcon: this.showSuccessIcon }, this.success)), this.warning && (h("spw-field-message", { key: '5e0c60fc788013422d0f25de6ee178a0d64a77c2', variant: "warning", showIcon: this.showWarningIcon }, this.warning)))));
+        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)))));
     }
     static get is() { return "spw-date-picker"; }
     static get encapsulation() { return "shadow"; }
@@ -1351,7 +1351,7 @@ export class SpwDatePicker {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Texte d'assistance \u00E0 afficher sous le champ de saisie"
+                    "text": "Texte d'assistance \u00E0 afficher sous le label"
                 },
                 "getter": false,
                 "setter": false,

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

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

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

@@ -69,7 +69,7 @@ export class SpwDropdownItem {
             'spw-dropdown-item__toggle': true,
             'spw-dropdown-item__toggle--open': this.subItemsOpen,
         };
-        return (h(Host, { key: '5e2c9770daee538a1f0495d289f4eccdacdbe72c' }, h(Tag, { key: '412276eb62185db2e27421286235cc2970a837c5', class: this.classes, href: this.href, "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.handleItemClick }, this.icon && (h("div", { key: '1ad97be19239600527f1b6149d156091fc01fd92', class: "spw-dropdown-item__icon" }, h("spw-icon", { key: 'aec2cb8b6c404263a99b9e67ad356a63df619428', variant: this.iconVariant, icon: this.icon }))), h("div", { key: '44b396930499798cff1acc822efe7cb790ac5b90', class: "spw-dropdown-item__content" }, h("div", { key: '7f36c99ebb87ee48c0dcc6979a862e30c2bf0bcf', class: "spw-dropdown-item__label" }, h("slot", { key: 'cb64dd00921722adea1cc3806a6a5607d16270bd' })), this.hasSubItems && (h("div", { key: '282fb73f722d57cc48ce45cd1d789a0dc3772175', class: toggleClasses, onClick: this.handleToggleSubItems }, h("spw-icon", { key: '788fc6c235c3471e0fafa52a4a97eb26b08adb50', icon: "fa-chevron-down" }))))), this.hasSubItems && (h("div", { key: 'd9401d49db1fb458b53a7e115c96e5c18ccd6ad5', class: "spw-dropdown-item__sub-items", style: { display: this.subItemsOpen ? 'block' : 'none' } }, h("slot", { key: '2f44d2f20d907c1d3883a1d9fb36d39001f66faf', name: "sub-items" })))));
+        return (h(Host, { key: '64d51205ea8e220d8d3d22c6163ffae1def82892' }, h(Tag, { key: '5cfb7b0bd5d57228f49efb175bfa01c2b1678c8c', class: this.classes, href: this.href, "aria-disabled": this.disabled ? 'true' : undefined, onClick: this.handleItemClick }, this.icon && (h("div", { key: 'b397503e12d41f4b3f339d73aa014942ee94b70e', class: "spw-dropdown-item__icon" }, h("spw-icon", { key: '0545ea4d6f163007279e315bbb0fd80c6f5e22a2', variant: this.iconVariant, icon: this.icon }))), h("div", { key: 'eff42c92481ce24a1807f7eb97ce0df4092b3310', class: "spw-dropdown-item__content" }, h("div", { key: '8735e69e60341295fdb844af88704ce040aa0cd8', class: "spw-dropdown-item__label" }, h("slot", { key: '8f186c331628491298a61ca203e1ef1d9f80825e' })), this.hasSubItems && (h("div", { key: '91c60f4dd34200d5e575a7cec98e6f690c6195ef', class: toggleClasses, onClick: this.handleToggleSubItems }, h("spw-icon", { key: 'c563396ee0b6e27f81be1466f2d9c7b8f03b9c70', icon: "fa-chevron-down" }))))), this.hasSubItems && (h("div", { key: '41325cd7b9755084a80ed15ebb7e505a1d5ca0a0', class: "spw-dropdown-item__sub-items", style: { display: this.subItemsOpen ? 'block' : 'none' } }, h("slot", { key: '927d7b7b3b9206ea64a4b930d3f91d76d49128e1', name: "sub-items" })))));
     }
     static get is() { return "spw-dropdown-item"; }
     static get originalStyleUrls() {

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

@@ -154,7 +154,7 @@ export class SpwDropdown {
         dropdown.style.visibility = 'visible';
     }
     render() {
-        return (h("div", { key: '06cc46ab430b0ac8d83e11822a5e5820056b0cb9', class: "spw-dropdown__trigger", onClick: () => (this.open = !this.open) }, h("slot", { key: '9f134f9f6f0a003314337670053fba654062b6f6' })));
+        return (h("div", { key: 'f14c3090969b4a5a84e343f6aacfeb0616afd36a', class: "spw-dropdown__trigger", onClick: () => (this.open = !this.open) }, h("slot", { key: '0cfd75ddf8a40ebc2090ca1c5959d27851352d00' })));
     }
     static get is() { return "spw-dropdown"; }
     static get encapsulation() { return "shadow"; }

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

@@ -21,7 +21,7 @@ export class SpwFieldLabel {
         return !!(this.tooltipText || this.tooltipTitle);
     }
     render() {
-        return (h(Host, { key: 'fc516da55de8afb4ca293689bb6c1b3aa2f9b70d' }, h("label", { key: '9131274cdb4dc74d55b04354077b25c032fa7e00', class: "spw-field-label", htmlFor: this.name, onClick: this.handleClick }, h("span", { key: '611cb1086ddb380e1f25a353ff2ce49815926325', class: "spw-field-label__text" }, this.label), this.hasTooltip && (h("spw-tooltip", { key: '632de96983eb0d5ad8ffe0de00e09479c55d8793', tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, maxWidth: this.tooltipMaxWidth, direction: this.tooltipDirection, cursor: this.tooltipCursor }, h("spw-icon", { key: '9dc18189642c2af5ec2a4b24a5c5b290ecfee434', variant: "fa-regular", icon: "fa-circle-info", class: "spw-field-label__icon" }))), this.required && h("span", { key: '3711c0074f9a7610918b4241cf0f12cb53b013df', class: "spw-field-label__required" }, "*"))));
+        return (h(Host, { key: 'cb454d092cd78fb71bf1167a4e387ad9fd416d69' }, h("label", { key: '641218aa7a026e9dd5805d51926b88ae94692926', class: "spw-field-label", htmlFor: this.name, onClick: this.handleClick }, h("span", { key: '53de42be7abcc40b2418489bc13bcd449dcb342f', class: "spw-field-label__text" }, this.label), this.hasTooltip && (h("spw-tooltip", { key: 'c1f0fdbb0e3742a3f303846b89078a727d69bc04', tooltipTitle: this.tooltipTitle, tooltipText: this.tooltipText, maxWidth: this.tooltipMaxWidth, direction: this.tooltipDirection, cursor: this.tooltipCursor }, h("spw-icon", { key: '01b65ea5af7cbf012902ee0b9d50bede9451d0aa', variant: "fa-regular", icon: "fa-circle-info", class: "spw-field-label__icon" }))), this.required && h("span", { key: '5eb8fd2d808a54133da51de5eaa7f7277d08c393', class: "spw-field-label__required" }, "*"))));
     }
     static get is() { return "spw-field-label"; }
     static get encapsulation() { return "shadow"; }

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

@@ -25,7 +25,7 @@ export class SpwFieldMessage {
         };
     }
     render() {
-        return (h(Host, { key: 'bc9fe4ec26a539bec0cdcad49829d600806e9fa6' }, h("div", { key: '4f32f686ed280899cffabbcd5ecd0bdae5d4ab5e', class: this.elementClass }, this.showIcon && (h("div", { key: 'c69d9d3bf3f77a2d7ca84e09c9ce6175f62533bc', class: "spw-field-message__icon" }, h("spw-icon", { key: '0d0534dbf2b46472c166f888edc27815f70f84b0', icon: this.variantIcon }))), h("span", { key: '6a49b7f20237bf6e23afe6277dc156176dc00812', class: "spw-field-message__text" }, h("slot", { key: '70137c786dd7e303b1fa4bb2634066aed6d3f333' })))));
+        return (h(Host, { key: 'c37e4fcd1a62f74a582ea34b5ad35405d1fdfe15' }, h("div", { key: 'dec558441b64aaaba6fd7ce8501be8c674ade97d', class: this.elementClass }, this.showIcon && (h("div", { key: '867ccb3a82414bc19f8f0e59857b879d615f2d69', class: "spw-field-message__icon" }, h("spw-icon", { key: '2fde1c1acdcbe924bf3448355a17433540ff6a59', icon: this.variantIcon }))), h("span", { key: '0c9b68f44ec54d00aa6ee52b007a3c34e721ebdc', class: "spw-field-message__text" }, h("slot", { key: 'f2fb8c461e7b9b81d5b8a96a2fbcdf3373e66aea' })))));
     }
     static get is() { return "spw-field-message"; }
     static get encapsulation() { return "shadow"; }

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

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