@roadtrip/components 3.51.0 → 3.51.2

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

@@ -2049,6 +2049,7 @@ const Drawer = class {
                 tabbableOptions: {
                     getShadowRoot: true,
                 },
+                preventScroll: true,
             });
         }
         return this.focusTrap;
@@ -2067,7 +2068,7 @@ const Drawer = class {
         const backIconElement = this.hasBackIcon ? (index.h("button", { type: "button", class: "drawer-action", "aria-label": ariaLabelBack, onClick: this.onClickBack }, index.h("road-icon", { icon: index$1.navigationChevron, rotate: "180" }), this.backText)) : null;
         const closeIconElement = this.hasCloseIcon ? (index.h("button", { type: "button", class: "drawer-close", onClick: this.onClick, "aria-label": ariaLabelClose }, index.h("road-icon", { icon: index$1.navigationClose, "aria-hidden": "true" }))) : null;
         const drawerWidthValue = this.position === "bottom" ? "100%" : `${this.drawerWidth}px`;
-        return (index.h(index.Host, { key: '283b6f1f997e92d9305b0ddf7191b568e1cd1587', class: `${drawerIsOpenClass}  drawer-${this.position}`, tabindex: "0", role: "dialog", "aria-label": ariaLabel }, index.h("div", { key: 'cf42a9521522d35a5b2479ebabce388498cf410f', class: "road-drawer-wrapper" }, index.h("div", { key: 'a2c92e33dc4a758e5861c124d63f9228c75657a0', class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), index.h("div", { key: 'b3cd8785eabb3dd1699248d48f8fc6179b24cbe3', class: "drawer-dialog", style: { maxWidth: drawerWidthValue }, role: "document" }, index.h("div", { key: '15da695b8585dedfb49b27882c84501b67a7a606', class: "drawer-content" }, index.h("header", { key: '601f047b868cf2794c7264ae6a12ba1d2699327e', class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle ? (index.h("h2", { class: "drawer-title" }, this.drawerTitle)) : (index.h("div", { class: "drawer-title" }, index.h("slot", { name: "title" }))), closeIconElement), index.h("div", { key: '1cf0ad2e8393893fd26277179a9877961966e0f2', class: `drawer-body ${removePaddingClass}` }, index.h("slot", { key: '860817b92a5a97b74de9a60f403807ad9bc2b30d' })), index.h("footer", { key: '8b91123cef24c0f1fe3c36482f09f46558d575aa', class: `drawer-footer ${removePaddingClass}`, hidden: !this.hasFooterContent }, index.h("slot", { key: '1c459e52b42e59f2074ce603f57bcaec9a00d827', name: "footer", onSlotchange: this.onFooterSlotChange })))))));
+        return (index.h(index.Host, { key: 'f3f7bb36db4476325b4e7a879a739529bc79d964', class: `${drawerIsOpenClass}  drawer-${this.position}`, tabindex: "0", role: "dialog", "aria-label": ariaLabel }, index.h("div", { key: '407cd4cc74d0f94f43cb306e8e7c819b771493dd', class: "road-drawer-wrapper" }, index.h("div", { key: '2f09ca1bfff5bf81ed94a277910dbb6017d0b984', class: "drawer-overlay", onClick: this.onClick, tabindex: "-1" }), index.h("div", { key: 'ae71f5011512dd1dd2a3cdd69b7ca6c8838b787f', class: "drawer-dialog", style: { maxWidth: drawerWidthValue }, role: "document" }, index.h("div", { key: '94cf3ed5d1a5e62cf15ec3a20a6bb786a240d61a', class: "drawer-content" }, index.h("header", { key: '58c9716838a98d57a0f147aed96c7b06d98ac9cf', class: `drawer-header ${inverseHeaderClass} ${drawerDelimiterClass}` }, backIconElement, this.drawerTitle ? (index.h("h2", { class: "drawer-title" }, this.drawerTitle)) : (index.h("div", { class: "drawer-title" }, index.h("slot", { name: "title" }))), closeIconElement), index.h("div", { key: '5d97f008d5514de90fac3c7d6c517882216aee00', class: `drawer-body ${removePaddingClass}` }, index.h("slot", { key: '53a401cd8b6295017d4903e7626d2ab643ad8b26' })), index.h("footer", { key: 'e1c65d15af977b46484d35c6b93def36c3523fdb', class: `drawer-footer ${removePaddingClass}`, hidden: !this.hasFooterContent }, index.h("slot", { key: 'c7b7694a70fb98a9057d5292acbf6bdda42267c5', name: "footer", onSlotchange: this.onFooterSlotChange })))))));
     }
     get el() { return index.getElement(this); }
     static get watchers() { return {
@@ -19542,6 +19543,8 @@ const Input = class {
         this.debounce = 0;
         this.debouncedRoadChange = this.createDebouncedRoadChange();
         this.onInput = (ev) => {
+            if (this.isComposing)
+                return;
             const input = ev.target;
             let newValue = input.value;
             if (this.type === 'number' && this.blockdecimal) {
@@ -19574,6 +19577,14 @@ const Input = class {
             this.enforceMinMaxValue();
         };
         this.onBlur = () => {
+            var _a, _b;
+            if (this.isComposing) {
+                this.isComposing = false;
+                const domValue = (_b = (_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+                if (this.value !== domValue) {
+                    this.value = domValue;
+                }
+            }
             let value = this.getValue();
             if (this.type === 'number') {
                 const minValue = this.min !== undefined ? parseFloat(this.min) : undefined;
@@ -19607,6 +19618,17 @@ const Input = class {
         this.onFocus = () => {
             this.roadFocus.emit();
         };
+        this.isComposing = false;
+        this.onCompositionStart = () => {
+            this.isComposing = true;
+        };
+        this.onCompositionUpdate = (ev) => {
+            this.onInput(ev);
+        };
+        this.onCompositionEnd = (ev) => {
+            this.isComposing = false;
+            this.onInput(ev);
+        };
     }
     handleKeyDown(event) {
         if (this.type === 'number' && this.blockdecimal) {
@@ -19670,11 +19692,11 @@ const Input = class {
         const lessLabelClass = this.label !== '' ? '' : 'less-label';
         const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';
         const isValidClass = this.success == true ? 'is-valid' : '';
-        return (index.h(index.Host, { key: 'be099a0ea8338c8c4ed1ad3e73b0036156410d9e', "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}`, value: value, blockdecimal: this.blockdecimal }, index.h("input", { key: '6bdc1d4f3648314134cd7790804430ca4292c5cd', class: `form-control ${hasValueClass} ${isInvalidClass} ${isValidClass} ${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, list: this.list, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.type === 'number' ? (event) => this.handleKeyDown(event) : undefined, "data-cy": 'road-input', ref: el => (this.inputEl = el) }), index.h("label", { key: '38884ef3e266eece5f45a3746ab366fd5aa2810c', class: "form-label", id: labelId, htmlFor: this.inputId }, this.label), this.error && this.error !== '' && (Array.isArray(this.error)
+        return (index.h(index.Host, { key: '1a723a76c79f3d505845abd0a1e78f42f85d79d3', "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}`, value: value, blockdecimal: this.blockdecimal }, index.h("input", { key: '44fa837d7d2fd3acf01c0728778e2dad3e8a5bb4', class: `form-control ${hasValueClass} ${isInvalidClass} ${isValidClass} ${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, list: this.list, value: value, onInput: this.onInput, onCompositionstart: this.onCompositionStart, onCompositionupdate: this.onCompositionUpdate, onCompositionend: this.onCompositionEnd, onBlur: this.onBlur, onFocus: this.onFocus, onKeyDown: this.type === 'number' ? (event) => this.handleKeyDown(event) : undefined, "data-cy": 'road-input', ref: el => (this.inputEl = el) }), index.h("label", { key: 'b6b196160326ed5d3ffe65741f6aae0037c355ce', 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: 'eda924baf7920edab4432565e020d8f21a5f70f1', class: "helper" }, this.helper), this.type && this.type == 'password' && index.h("slot", { key: '52dbaeb8362e4949c48297ba32ae331143044f78', name: "checklistPassword" })));
+                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: 'a8af4a8359dd410e54ffc0a5668550d6c0cd8d6b', class: "helper" }, this.helper), this.type && this.type == 'password' && index.h("slot", { key: '4550347f0788d382ba515d1e5489c72b9c9cf44f', name: "checklistPassword" })));
     }
     static get watchers() { return {
         "debounce": ["debounceChanged"],