@roadtrip/components 3.33.6 → 3.34.0

package/dist/cjs/road-badge_14.cjs.entry.js

@@ -17962,6 +17962,9 @@ const Input = class {
                 this.roadBlur.emit(value);
                 this.roadChange.emit({ value });
             }
+            else {
+                this.roadBlur.emit(value);
+            }
             // Appeler enforceMinMaxValue lors de la perte de focus
             this.enforceMinMaxValue();
         };
@@ -18026,7 +18029,11 @@ const Input = class {
         const hasValueClass = this.value !== '' && this.value !== null ? 'has-value' : '';
         const lessLabelClass = this.label !== '' ? '' : 'less-label';
         const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';
-        return (index.h(index.Host, { key: 'e8296b902967681ad3483560e720236c98dc4f9f', "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}`, value: value, blockdecimal: this.blockdecimal }, index.h("input", { key: '8ad175738f8fca4ca345aff156e3124db00afbdf', class: `form-control ${hasValueClass} ${isInvalidClass} ${lessLabelClass}`, id: this.inputId, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, enterKeyHint: this.enterkeyhint, autoFocus: this.autofocus, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, size: this.size, type: this.type, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.type === 'number' ? (event) => this.handleKeyDown(event) : undefined, "data-cy": 'road-input' }), index.h("label", { key: 'f9e63512f533d2cf89a8bbfd6fffd8824a721211', class: "form-label", id: labelId, htmlFor: this.inputId }, this.label), this.error && this.error !== '' && index.h("p", { key: 'ec34468bc61c42943ee5b275081e02be859e45e2', class: "invalid-feedback" }, index.h("road-icon", { key: '83204d0fecc77eb3d8e8bc9697cd9bfc7ddb3be5', slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), this.error), this.helper && this.helper !== '' && index.h("p", { key: 'b639735e1508e1aac0ba5800edf9649fb1847155', class: "helper" }, this.helper), this.type && this.type == 'password' && index.h("slot", { key: 'c33c73bc53ae22f3b3bd97021a5c4f320cff89f9', name: "checklistPassword" })));
+        return (index.h(index.Host, { key: '1dc5be8cca2464709ea4661a875c35feaec6d7b3', "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}`, value: value, blockdecimal: this.blockdecimal }, index.h("input", { key: '57575b6d01b4bf45703e76e0ac4b7e75aa7177ae', class: `form-control ${hasValueClass} ${isInvalidClass} ${lessLabelClass}`, id: this.inputId, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoComplete: this.autocomplete, autoCorrect: this.autocorrect, enterKeyHint: this.enterkeyhint, autoFocus: this.autofocus, inputMode: this.inputmode, min: this.min, max: this.max, minLength: this.minlength, maxLength: this.maxlength, name: this.name, pattern: this.pattern, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, spellcheck: this.spellcheck, step: this.step, size: this.size, type: this.type, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.type === 'number' ? (event) => this.handleKeyDown(event) : undefined, "data-cy": 'road-input' }), index.h("label", { key: '90ab2cc491c203f18e37654e361a03bf31f6e908', class: "form-label", id: labelId, htmlFor: this.inputId }, this.label), this.error && this.error !== '' && (Array.isArray(this.error)
+            ? // Si error est un tableau, on itère et génère un <p> pour chaque élément
+                this.error.map((err, index$1) => (index.h("p", { key: index$1, class: "invalid-feedback" }, index.h("road-icon", { slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), err.trim(), " ")))
+            : // Si error est une chaîne, on la divise avec split et génère un <p> pour chaque élément
+                this.error.split(',').map((err, index$1) => (index.h("p", { key: index$1, class: "invalid-feedback" }, index.h("road-icon", { slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), err.trim(), " ")))), this.helper && this.helper !== '' && index.h("p", { key: 'ac10569a3eacf0e85142238d18139bb4b95c24e3', class: "helper" }, this.helper), this.type && this.type == 'password' && index.h("slot", { key: '17e2a2ea624850955a29167e0475cff88960cc49', name: "checklistPassword" })));
     }
     static get watchers() { return {
         "debounce": ["debounceChanged"],
@@ -18036,7 +18043,7 @@ const Input = class {
 let inputIds = 0;
 Input.style = RoadInputStyle0;
 
-const inputGroupCss = ":host{display:block}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%;font-family:var(--road-font, sans-serif)}::slotted(road-input),::slotted(input),::slotted(textarea),::slotted(road-select){position:relative;flex:1 1 auto;width:1%;margin-bottom:0}::slotted([slot=\"prepend\"]){margin-right:-3px;border-right-color:transparent;border-color:var(--road-input-outline);border-top-right-radius:0;border-bottom-right-radius:0;position:absolute;left:0;top:0;bottom:0}::slotted([slot=\"append\"]){margin-left:-0.25rem;border-color:var(--road-input-outline);border-left-width:0;position:absolute;right:0;top:0;bottom:0}@media (hover: hover){.input-group:not(.is-disabled):hover ::slotted([slot=\"prepend\"]){border-color:var(--road-input-outline-variant);border-right-color:transparent}.input-group:not(.is-disabled):hover ::slotted([slot=\"append\"]){border-color:var(--road-input-outline-variant);border-left-color:transparent}:host(.phone-number-group) .input-group:not(.is-disabled):hover ::slotted([slot=\"prepend\"]){border-color:var(--road-input-outline-variant)}}.input-group:focus-within ::slotted([slot=\"prepend\"]),:host(.phone-number-group) .input-group:focus-within ::slotted([slot=\"prepend\"]){border-color:var(--road-grey-0);border-width:2px;border-right-color:transparent;outline:none;}.input-group:focus-within ::slotted([slot=\"append\"]){border-color:var(--road-grey-0);border-width:2px;border-left-color:transparent;outline:none;}.input-group:focus-within ::slotted(road-input):focus-visible{border-color:var(--road-grey-0);border-width:2px;outline:none;}.input-group-prepend,.input-group-append{display:flex;height:3rem}::slotted(road-button){--padding-start:0.5rem;--padding-end:0.5rem;position:relative;z-index:2;min-width:3rem;margin:0;font-size:var(--road-font-size-14)}::slotted(road-button):hover{background-color:var(--road-button-ghost-variant)}.input-group-prepend{z-index:1;order:-1;position:relative}.input-group-prepend~.form-label{left:calc(3rem + 1px)}.input-group-append{position:relative;z-index:1;border-radius:0 0.25rem 0.25rem 0}::slotted(label){display:flex;align-items:center;padding:0 0.5rem;margin-bottom:0;color:var(--road-on-surface);text-align:center;white-space:nowrap;cursor:text;border-radius:0.25rem;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}::slotted(road-label){display:flex;align-items:center;padding:0 0.5rem;margin-bottom:0;color:var(--road-on-surface);text-align:center;white-space:nowrap;cursor:text;background:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0.25rem;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}::slotted(road-input:not(:first-child)),::slotted(road-select:not(:first-child)){border-radius:0}.input-group-append ::slotted([slot=\"append\"]){border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.input-group-prepend ::slotted([slot=\"prepend\"]){border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}:host(.phone-number-group) .input-group-prepend ::slotted([slot=\"prepend\"]){border-right:1px solid var(--road-input-outline);border-top-right-radius:0;border-bottom-right-radius:0}.input-group-prepend ::slotted(label){margin-right:calc(-1rem + 1px)}.input-group-append:hover ::slotted(road-button){background-color:var(--road-button-ghost-variant)}.size-xl .input-group-prepend,.size-xl .input-group-append{height:3.5rem}.size-xl ::slotted(road-button){height:3.5rem}.input-group.is-invalid ::slotted([slot=\"append\"]),.input-group.is-invalid ::slotted([slot=\"prepend\"]){border-color:var(--road-danger-outline)}:host(.phone-number-group) .input-group.is-invalid ::slotted([slot=\"prepend\"]){border-color:var(--road-danger-outline)}:host([disabled]){cursor:not-allowed}:host([disabled]) .input-group{pointer-events:none;}:host([disabled]) ::slotted([slot=\"append\"]),:host([disabled]) ::slotted([slot=\"prepend\"]){color:var(--road-on-surface-disabled);cursor:not-allowed;background:#e4e5e9}:host([disabled]) ::slotted([slot=\"append\"] road-icon),:host([disabled]) ::slotted([slot=\"prepend\"] road-icon){color:var(--road-on-surface-disabled)}:host([disabled]) road-icon{color:var(--road-on-surface-disabled)}";
+const inputGroupCss = ":host{display:block}.input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%;font-family:var(--road-font, sans-serif)}::slotted(road-input),::slotted(input),::slotted(textarea),::slotted(road-select){position:relative;flex:1 1 auto;width:1%;margin-bottom:0}::slotted([slot=\"prepend\"]){margin-right:-3px;border-right-color:transparent;border-color:var(--road-input-outline);border-top-right-radius:0;border-bottom-right-radius:0;position:absolute;left:0;top:0;bottom:0}::slotted([slot=\"append\"]){margin-left:-0.25rem;border-color:var(--road-input-outline);border-left-width:0;position:absolute;right:0;top:0;bottom:0}@media (hover: hover){.input-group:not(.is-disabled):hover ::slotted([slot=\"prepend\"]){border-right-color:transparent}.input-group:not(.is-disabled):hover ::slotted([slot=\"append\"]){border-left-color:transparent}:host(.phone-number-group) .input-group:not(.is-disabled):hover ::slotted([slot=\"prepend\"]){border-color:var(--road-input-outline-variant)}}.input-group:focus-within ::slotted([slot=\"prepend\"]),:host(.phone-number-group) .input-group:focus-within ::slotted([slot=\"prepend\"]){border-color:var(--road-grey-0);border-width:2px;border-right-color:transparent;outline:none;}.input-group:focus-within ::slotted([slot=\"append\"]){border-color:var(--road-grey-0);border-width:2px;border-left-color:transparent;outline:none;}.input-group:focus-within ::slotted(road-input):focus-visible{border-color:var(--road-grey-0);border-width:2px;outline:none;}.input-group-prepend,.input-group-append{display:flex;height:3rem}::slotted(road-button){--padding-start:0.5rem;--padding-end:0.5rem;position:relative;z-index:2;min-width:3rem;margin:0;font-size:var(--road-font-size-14)}::slotted(road-button):hover{background-color:var(--road-button-ghost-variant)}.input-group-prepend{z-index:1;order:-1;position:relative}.input-group-prepend~.form-label{left:calc(3rem + 1px)}.input-group-append{position:relative;z-index:1;border-radius:0 0.25rem 0.25rem 0}::slotted(label){display:flex;align-items:center;padding:0 0.5rem;margin-bottom:0;color:var(--road-on-surface);text-align:center;white-space:nowrap;cursor:text;border-radius:0.25rem;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}::slotted(road-label){display:flex;align-items:center;padding:0 0.5rem;margin-bottom:0;color:var(--road-on-surface);text-align:center;white-space:nowrap;cursor:text;background:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0.25rem;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}::slotted(road-input:not(:first-child)),::slotted(road-select:not(:first-child)){border-radius:0}.input-group-append ::slotted([slot=\"append\"]){border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}.input-group-prepend ::slotted([slot=\"prepend\"]){border-right:0;border-top-right-radius:0;border-bottom-right-radius:0}:host(.phone-number-group) .input-group-prepend ::slotted([slot=\"prepend\"]){border-right:1px solid var(--road-input-outline);border-top-right-radius:0;border-bottom-right-radius:0}.input-group-prepend ::slotted(label){margin-right:calc(-1rem + 1px)}.input-group-append:hover ::slotted(road-button){background-color:var(--road-button-ghost-variant)}.size-xl .input-group-prepend,.size-xl .input-group-append{height:3.5rem}.size-xl ::slotted(road-button){height:3.5rem}.input-group.is-invalid ::slotted([slot=\"append\"]),.input-group.is-invalid ::slotted([slot=\"prepend\"]){border-color:var(--road-danger-outline)}:host(.phone-number-group) .input-group.is-invalid ::slotted([slot=\"prepend\"]){border-color:var(--road-danger-outline)}:host([disabled]){cursor:not-allowed}:host([disabled]) .input-group{pointer-events:none;}:host([disabled]) ::slotted([slot=\"append\"]),:host([disabled]) ::slotted([slot=\"prepend\"]){color:var(--road-on-surface-disabled);cursor:not-allowed;background:#e4e5e9}:host([disabled]) ::slotted([slot=\"append\"] road-icon),:host([disabled]) ::slotted([slot=\"prepend\"] road-icon){color:var(--road-on-surface-disabled)}:host([disabled]) road-icon{color:var(--road-on-surface-disabled)}";
 const RoadInputGroupStyle0 = inputGroupCss;
 
 const InputGroup = class {
@@ -18069,16 +18076,16 @@ const InputGroup = class {
         const formSelect = this.el.querySelector('.form-select');
         const formSelectLabel = this.el.querySelector('.form-select-label');
         if (formControl) {
-            formControl.style.textIndent = hasPrepend ? '2rem' : '';
+            formControl.style.textIndent = hasPrepend ? '2.1rem' : '';
         }
         if (formSelect) {
-            formSelect.style.textIndent = hasPrepend ? '2rem' : '';
+            formSelect.style.textIndent = hasPrepend ? '2.1rem' : '';
         }
         if (formLabel) {
-            formLabel.style.textIndent = hasPrepend ? '2.7rem' : '';
+            formLabel.style.textIndent = hasPrepend ? '2.8rem' : '';
         }
         if (formSelectLabel) {
-            formSelectLabel.style.textIndent = hasPrepend ? '2.7rem' : '';
+            formSelectLabel.style.textIndent = hasPrepend ? '2.8rem' : '';
         }
     }
     componentDidLoad() {
@@ -18094,7 +18101,7 @@ const InputGroup = class {
             ? `size-${this.el.querySelector('road-input').sizes}`
             : '';
         const disabledClass = this.disabled ? 'is-disabled' : '';
-        return (index.h("div", { key: '99a512f367c7dfb57297073d05d3e341df818ab3', class: `input-group ${errorClass} ${disabledClass} ${sizeClass}` }, index.h("div", { key: '9e89c27036e321223513c99d3f399694008a4b99', class: "input-group-prepend" }, index.h("slot", { key: 'f448db90587308448b33aeeff57e26f9943c836c', name: "prepend" })), index.h("slot", { key: '67214bd2d0fed61ae080aa10306b98bb376f8f7d' }), index.h("div", { key: '152a4f643d38c0b443a39d3cc8fa781c9b99f87b', class: "input-group-append" }, index.h("slot", { key: '549c3c8f388cf6f26c1080da788a9aadf53ac61b', name: "append" }))));
+        return (index.h("div", { key: '54938b0939fc88368a47099bd3263a4eaaa273fc', class: `input-group ${errorClass} ${disabledClass} ${sizeClass}` }, index.h("div", { key: '3039896e2e22c633d4b298899488b16dc2d34018', class: "input-group-prepend" }, index.h("slot", { key: 'ad675a53558b83d6dd5b0ae044db538245da0316', name: "prepend" })), index.h("slot", { key: '1283ee327bbe9755e107a80cf700293c685429bf' }), index.h("div", { key: '677da10746507b1171498461da76d7e8e7d6056a', class: "input-group-append" }, index.h("slot", { key: '2bbf8d38a2343e362ee20bc8c3d54f88fd992eed', name: "append" }))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -18157,13 +18164,13 @@ const Item = class {
                 target,
             };
         const showDetail = detail !== undefined && detail;
-        return (index.h(index.Host, { key: '9fb4b35e594ec2393232ad0a9403e279e2e2889c', "aria-disabled": disabled ? 'true' : null, class: {
+        return (index.h(index.Host, { key: '9b71788b470f7fc686c9953868c59515607d5b01', "aria-disabled": disabled ? 'true' : null, class: {
                 [`item-lines-${lines}`]: lines !== undefined,
-            } }, index.h(TagType, Object.assign({ key: '9fba47364f496d51e09e3b2a5a92dd00ef71ff87' }, attrs, { class: {
+            } }, index.h(TagType, Object.assign({ key: 'd05ff0c98f1a0713e935954b995e0f6476069414' }, attrs, { class: {
                 'item-native': true,
                 'item-active': this.active,
                 [`layout-${layout}`]: layout !== undefined,
-            }, part: "native", disabled: disabled }), index.h("slot", { key: 'fe656d0fa4a1f518f6ab7a43524e244d6eb37d30', name: "start" }), index.h("div", { key: 'd1c19e1d0a10b578799970249bf4e40cdddd9dc3', class: "item-inner" }, index.h("div", { key: '3523d2bd743dc2f16cc1dc2de844a3ab3be93ff2', class: "input-wrapper" }, index.h("slot", { key: 'a7da0e4dcf42fc54130eaafa1a08d16315b52d54' }), index.h("div", { key: 'd63ad621b6f43da35bec1a270ceacd40876b4d3e', class: "input-wrapper-info" }, index.h("road-label", { key: '14763d79d648cfbbb21136998287411ab3231cbc', class: "input-wrapper-info-title" }, this.titleItem), index.h("p", { key: '5048f0bab07eb191b4ba3d8655a7890a45926541', class: "input-wrapper-info-text" }, this.text))), index.h("slot", { key: 'ef5cef7e326421ea28f0420a81a1773b74adc8bf', name: "end" }), showDetail && index.h("road-icon", { key: 'ecb61fe5b2cd5e3ba3ba8b30427337cbde78fd78', icon: detailIcon, lazy: false, class: "item-detail-icon" })))));
+            }, part: "native", disabled: disabled }), index.h("slot", { key: '4287ffe1ac1fc6471bef8cc1c060637bd6889ef4', name: "start" }), index.h("div", { key: '70dff3ab1b88fc4e51e83280504c85cfdbef6e75', class: "item-inner" }, index.h("div", { key: '872a6387bceac2c8ef76d8ebd5ecc47cb6f93aa7', class: "input-wrapper" }, index.h("slot", { key: 'c0e117161a86fb92ed121ab1fdc71de76a9d1aae' }), index.h("div", { key: '23f4c082e69b0584cecadaf62c3cda21073068d6', class: "input-wrapper-info" }, index.h("road-label", { key: '7af0a0698d00c0681181038163b8f5c15ef82e9a', class: "input-wrapper-info-title" }, this.titleItem), index.h("p", { key: '87653ef8324a8e8b82270d697e657e242e9494be', class: "input-wrapper-info-text" }, this.text))), index.h("slot", { key: '4d58e9d7d5f808b3a7f6bc2dee4912015070a495', name: "end" }), showDetail && index.h("road-icon", { key: '6422e581f75db848cc4e788d7fd9f48709bd7588', icon: detailIcon, lazy: false, class: "item-detail-icon" })))));
     }
     get el() { return index.getElement(this); }
 };
@@ -18177,7 +18184,7 @@ const Label = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h("slot", { key: '3ba99679bcd840c743cbc724843909bd267d0ab2' }));
+        return (index.h("slot", { key: 'e6b8246e6673eeaa1d33517a58de2df43091c4dc' }));
     }
 };
 Label.style = RoadLabelStyle0;
@@ -18191,9 +18198,9 @@ const List = class {
     }
     render() {
         const { lines } = this;
-        return (index.h(index.Host, { key: 'ddd543051e3de681b5672d7ab87ebe742858da9c', class: {
+        return (index.h(index.Host, { key: 'a830b17499a394ad9bccaaed0aa2056ae538929b', class: {
                 [`list-lines-${lines}`]: lines !== undefined,
-            } }, index.h("slot", { key: '56e04b9869dc48d1011e422c57ec2578e61301c6' })));
+            } }, index.h("slot", { key: '1010f8f4a4376db24412ea8e5f407f3951ac8333' })));
     }
 };
 List.style = RoadListStyle0;
@@ -18206,7 +18213,7 @@ const Row = class {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '891c70924e7955aa953e3e233cd57dd6aff4068a' }, index.h("slot", { key: 'acb726260f4492a126b9aa1f51d89b329bf6a09c' })));
+        return (index.h(index.Host, { key: '4d56e5a10387b76a5b9848b29b66b5d1893c1b39' }, index.h("slot", { key: 'ba686ef7958ff67384c6ca8d88767f1dd55e9f5a' })));
     }
 };
 Row.style = RoadRowStyle0;
@@ -18220,7 +18227,7 @@ const Toolbar = class {
     }
     render() {
         const colorClass = this.color !== undefined ? `toolbar-${this.color}` : '';
-        return (index.h(index.Host, { key: '3babdf893a7a89e310b620737ef852ee133ccebb', class: colorClass }, index.h("div", { key: 'de9400a86c87d427d22b496cd6ceb31cb93ccf54', class: "toolbar-container" }, index.h("slot", { key: '50559e69631b7581ad67338aea96acd42926b9ab', name: "start" }), index.h("slot", { key: '40bcbd63fb2f83d7c8294154734c58c0650ee182', name: "primary" }), index.h("div", { key: '4eec60ca600f33e3e0c6d9056c9913d8df7e62bd', class: "toolbar-content" }, index.h("slot", { key: 'f1105dc9a8ac7ff4cfc7e8e166d8a0e13c1bee73' })), index.h("slot", { key: 'ca6e18fc20fb0a636d54573ffb99074940e41bcc', name: "secondary" }), index.h("slot", { key: 'c73721561d9d3d38c38a9dc453757b185bbd81a5', name: "end" }))));
+        return (index.h(index.Host, { key: '1666aad03b553002af15625a73060f5dbf4601b8', class: colorClass }, index.h("div", { key: 'e627795b3897fe397d86a9c879ea2df29ca40a30', class: "toolbar-container" }, index.h("slot", { key: '123ce565840045140bf2271fada84db838c1b0d6', name: "start" }), index.h("slot", { key: '115bb3ee9c656a81b61a601a319ec6923657894a', name: "primary" }), index.h("div", { key: '123ec182ca9d3dfd6bb2437c5689cce4c6e63069', class: "toolbar-content" }, index.h("slot", { key: '9c7a630301f524c0adef6bbc6ca6e89cabcba81a' })), index.h("slot", { key: 'a37d49d76f8df43da0e2969e17497f06e0eae184', name: "secondary" }), index.h("slot", { key: '62e6e5cbd5d9b1fdc2dead440ef9e60425796f75', name: "end" }))));
     }
 };
 Toolbar.style = RoadToolbarStyle0;