@roadtrip/components 3.44.0 → 3.45.1

package/dist/collection/components/range/range.js

@@ -95,14 +95,14 @@ export class Range {
     render() {
         const value = this.getValue();
         const datalist = this.showLabels !== undefined ? `tickmarks` : "";
-        return (h(Host, { key: '70682c392f1e20883fb831efc8de0f9a067b3009', tabindex: "0", class: { disabled: this.disabled } }, h("div", { key: '981f26d40294cd905075d0745e4728543bdc618e', class: "form-group d-flex align-items-end" }, this.showTick && (h("road-icon", { key: '43f2969c43d2573de4db51261263ff22d834cc89', icon: navigationAddLessSolid, class: "mr-8", size: "sm" })), h("div", { key: '2009bfe7013711fcac093f8c67f54daf8f293d05', class: "form-range", style: {
+        return (h(Host, { key: '4a3eac8fe972c4da37712c2bfb9f9368a2c5e0e4', tabindex: "0", class: { disabled: this.disabled } }, h("div", { key: '7ede74bdbb7f85124b250a02f312e0fa8672b445', class: "form-group d-flex align-items-end" }, this.showTick && (h("road-icon", { key: 'bbfe778ba2082b82dac80d2c9b11b032ae4d3dc5', icon: navigationAddLessSolid, class: "mr-8", size: "sm" })), h("div", { key: 'a5617bb934ee0e8f481d4cbbe334ecdcccb80f4a', class: "form-range", style: {
                 "--min": this.min,
                 "--max": this.max,
                 "--value": value,
                 "--background-color": this.disabled
                     ? "var(--road-surface-disabled)"
                     : "initial",
-            } }, this.showValue && h("output", { key: 'b918d44808d44f446f88781b56a18da28768d184' }), this.showLabels && h("slot", { key: '341f43e617bca8decaa791170065658cf5c57923', name: "datalist" }), h("input", { key: '20d9d42bcfd89eb76a9459571cec4e790d8904f4', type: "range", class: "form-range-input", id: this.rangeId, min: this.min, max: this.max, value: value, onInput: this.onInput, list: datalist, "aria-label": "Valeur", tabindex: "0", disabled: this.disabled }), h("label", { key: '6ff1fbdc6111509511a1e50e0e65f43ec692f74f', class: "form-range-label" }, "Valeur"), h("div", { key: 'fadff2d5d9fda1b85290a4c39697968b13470412', class: "form-range-progress" })), this.showTick && (h("road-icon", { key: '79f4b51b9e695692777ab37b36511dfc8209812c', icon: navigationAddMoreSolid, class: "ml-8", size: "sm" })))));
+            } }, this.showValue && h("output", { key: 'f8fb6174412f03e9e0ada70b79715b8892c394e7' }), this.showLabels && h("slot", { key: '77278e535a1cf754b21ef12ebd1650aa03942ad0', name: "datalist" }), h("input", { key: 'c40fc31c0744955b440b162e5cddaa7c7b2119a3', type: "range", class: "form-range-input", id: this.rangeId, min: this.min, max: this.max, value: value, onInput: this.onInput, list: datalist, "aria-label": "Valeur", tabindex: "0", disabled: this.disabled }), h("label", { key: 'ec72158b6b0f7128aee76222506a6ecf80bbf43c', class: "form-range-label" }, "Valeur"), h("div", { key: 'ec3ba04cbb45a2af707f81e0fd05fbbb868c8187', class: "form-range-progress" })), this.showTick && (h("road-icon", { key: '293312e73482a2dafe8ef694ae2e56e3f37955bb', icon: navigationAddMoreSolid, class: "ml-8", size: "sm" })))));
     }
     static get is() { return "road-range"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/rating/rating.js

@@ -37,7 +37,7 @@ export class Rating {
         const sizeRatingStarsClass = this.size !== undefined ? `rating-stars rating-stars--${this.size}` : 'rating-stars';
         const sizeRatingNumberClass = this.size !== undefined ? `rating-number rating-number--${this.size}` : 'rating-number';
         const readOnly = this.readonly == true ? `readonly` : '';
-        return (h(Host, { key: 'de9146b27a97204cf394332ed3cd39872b2021be' }, h("div", { key: '10e5404e7b77281cbc6db3c7b5443158cff0d5d2', class: `${sizeRatingStarsClass}` }, [...Array(rate)].map(() => h("road-icon", { icon: star, size: "sm", color: "warning" })), [...Array(rateDecimale)].map(() => h("road-icon", { icon: starHalfColor, size: "sm", class: "rating-star" })), [...Array(5 - rate - rateDecimale)].map(() => h("road-icon", { icon: star, size: "sm", class: "rating-star" }))), this.readonly == false && this.showreviews && h("a", { key: 'ba4c82ef9eff58a95cb6049839c26c2a2e74dd2d', class: `${sizeRatingNumberClass}`, href: this.url }, "(", this.reviews, this.reviewsText && ` ${this.reviewsText}`, ")"), this.readonly == true && this.showreviews && h("road-label", { key: 'd7066a54aecd03e699e63ef2c4546a350252712a', class: `${sizeRatingNumberClass} ${readOnly}` }, "(", this.reviews, this.reviewsText && ` ${this.reviewsText}`, ")")));
+        return (h(Host, { key: 'f3317daf4cdd2e6a539936c9dbe095c791ce883d' }, h("div", { key: 'fe4e3b262592ca714e26f7cc03ac9ba4435d0b51', class: `${sizeRatingStarsClass}` }, [...Array(rate)].map(() => h("road-icon", { icon: star, size: "sm", color: "warning" })), [...Array(rateDecimale)].map(() => h("road-icon", { icon: starHalfColor, size: "sm", class: "rating-star" })), [...Array(5 - rate - rateDecimale)].map(() => h("road-icon", { icon: star, size: "sm", class: "rating-star" }))), this.readonly == false && this.showreviews && h("a", { key: '17bd3fb3ecbbd6e040c3c9c70fb92b9af90ee6b1', class: `${sizeRatingNumberClass}`, href: this.url }, "(", this.reviews, this.reviewsText && ` ${this.reviewsText}`, ")"), this.readonly == true && this.showreviews && h("road-label", { key: '5dba1d64ca367649797df7b872789e7cdc130e8c', class: `${sizeRatingNumberClass} ${readOnly}` }, "(", this.reviews, this.reviewsText && ` ${this.reviewsText}`, ")")));
     }
     static get is() { return "road-rating"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/row/row.js

@@ -4,7 +4,7 @@ import { Host, h } from "@stencil/core";
  */
 export class Row {
     render() {
-        return (h(Host, { key: 'c38bbf8641a80fc8ebb76c25f5cec3070127c569' }, h("slot", { key: 'b8459fd13efb02e5b04fb4558533f89f37cbe858' })));
+        return (h(Host, { key: 'b9735c29e64bf4dbd798811326b36efab2fe84b0' }, h("slot", { key: '33cd185fdb68387287d1099576d03340d45dc579' })));
     }
     static get is() { return "road-row"; }
     static get encapsulation() { return "shadow"; }

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

@@ -52,10 +52,10 @@ export class SegmentedButton {
     render() {
         const { tabIndex, selected, tab } = this;
         const sizeClass = this.size !== undefined ? `btn-${this.size}` : '';
-        return (h(Host, { key: 'f97ac52e941a6d41c3cc1ebde88396c7a88bcc5b', onClick: this.onClick, onKeyup: this.onKeyUp, role: "tab", tabindex: tabIndex, "aria-selected": selected ? 'true' : null, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (h(Host, { key: '8b14a7cc7b693e9738cc01498921b86f01a5e2a5', onClick: this.onClick, onKeyup: this.onKeyUp, role: "tab", tabindex: tabIndex, "aria-selected": selected ? 'true' : null, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
                 'tab-selected': selected,
                 [`${sizeClass}`]: true,
-            } }, h("span", { key: 'd608b3b0da3af5184b3a4faeda5bfc6d643cb14f', tabIndex: -1, class: "button-native", part: "native", "aria-hidden": "true" }, h("span", { key: '6aab4780198238402d5911e60b905d8187624266', class: "button-content" }, h("slot", { key: '12d3b5ebb3de039dffd9d99bd658de975a2ed6df' })))));
+            } }, h("span", { key: '2e4d84a1561a9c09b441fd858c3625f784c6794c', tabIndex: -1, class: "button-native", part: "native", "aria-hidden": "true" }, h("span", { key: '2acfa633cb9a32c3554ac7067fd62737bc45b172', class: "button-content" }, h("slot", { key: '1b133f39ff11f8bdd8be0b3d7f780262f0af2e18' })))));
     }
     static get is() { return "road-segmented-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segmented-button-bar/segmented-button-bar.js

@@ -18,7 +18,7 @@ export class ButtonBar {
         this.selectedTabChanged();
     }
     render() {
-        return (h(Host, { key: 'a5bf3fc09d2e077e087ae5246ee562aed29472a5', role: "tablist" }, h("slot", { key: '48a1e2e24b79f769bc35e4d048218210be1b0d56' })));
+        return (h(Host, { key: 'd4cf00bc997e0ed05484681fb5fc5f554b3d6fbd', role: "tablist" }, h("slot", { key: 'cadf449cf80d55a0fe297fff440f65f6c096c371' })));
     }
     static get is() { return "road-segmented-button-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/segmented-buttons/segmented-buttons.js

@@ -86,7 +86,7 @@ export class Tabs {
         return Array.from(this.el.querySelectorAll('road-tab'));
     }
     render() {
-        return (h(Host, { key: 'd1d9e0ab7ed50aa338646a473b2c3e22d4a30f6b', onRoadSegmentedButtonClick: this.onTabClicked }, h("slot", { key: '681bb4fdcf7bc99dd558723c85ea65b6182a7556', name: "top" }), h("slot", { key: '395d680d41e4c831d7e12e2d4b5e83e74d1128cf' })));
+        return (h(Host, { key: '51b943aa1730a5869b8d4616e5b9d0a883c3e17c', onRoadSegmentedButtonClick: this.onTabClicked }, h("slot", { key: '14c0de7b24f8a960a331c258ac91dd2ec4e1dda2', name: "top" }), h("slot", { key: 'b8d71615b2b6bbee3ce95754f0b2f0a7c5ef3385' })));
     }
     static get is() { return "road-segmented-buttons"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/select/select.js

@@ -92,7 +92,7 @@ export class Select {
         const labelId = this.selectId + '-label';
         const hasValueClass = this.value && this.value !== '' ? 'has-value' : '';
         const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';
-        return (h(Host, { key: 'fb313bb494596711a3b9f5c893ad32718d8b91b9', class: this.sizes && `select-${this.sizes}` }, h("select", { key: '1414476677d43a66f4386b33d0e214dfda608f3c', class: `form-select ${hasValueClass} ${isInvalidClass}`, id: this.selectId, "aria-disabled": this.disabled ? 'true' : null, autoFocus: this.autofocus, disabled: this.disabled, name: this.name, required: this.required, size: this.size, onChange: this.onChange, onFocus: this.onFocus, onBlur: this.onBlur }, h("option", { key: 'e76bb7a68a1876237168287ed1c644489b01ae1d', selected: !this.value, disabled: true, hidden: true, style: { display: 'none' }, value: "" }), this.options && this.options.map(option => (h("option", { value: option.value, selected: this.value !== null && option.value == this.value }, option.label)))), h("label", { key: 'a8e873fecdd61d0b329cac070f3705aaf534e846', class: "form-select-label", id: labelId, htmlFor: this.selectId }, this.label), this.error && this.error !== '' && h("p", { key: '82ba6e3b17d05cd9b90ce1b47c1fabe7673753d2', class: "invalid-feedback" }, this.error), this.helper && this.helper !== '' && h("p", { key: '6641b93d7b62266d671196f340d8ff2b385b5159', class: "helper" }, this.helper)));
+        return (h(Host, { key: '252c4ae08501f73688cf0c7c7b0830439f1f8e1f', class: this.sizes && `select-${this.sizes}` }, h("select", { key: '28001067f4222640b9a7d4a93692ff94593651c1', class: `form-select ${hasValueClass} ${isInvalidClass}`, id: this.selectId, "aria-disabled": this.disabled ? 'true' : null, autoFocus: this.autofocus, disabled: this.disabled, name: this.name, required: this.required, size: this.size, onChange: this.onChange, onFocus: this.onFocus, onBlur: this.onBlur }, h("option", { key: '8933f32a5982c18c456bb06e22a28f67320927b0', selected: !this.value, disabled: true, hidden: true, style: { display: 'none' }, value: "" }), this.options && this.options.map(option => (h("option", { value: option.value, selected: this.value !== null && option.value == this.value }, option.label)))), h("label", { key: '49e2bd5cff399c79900ac65dd37e73bc862f3d00', class: "form-select-label", id: labelId, htmlFor: this.selectId }, this.label), this.error && this.error !== '' && h("p", { key: 'e3a55cc35184e8767ba35ac87cb45e7e24f3c116', class: "invalid-feedback" }, this.error), this.helper && this.helper !== '' && h("p", { key: 'd824610dfb9031aecee47f63c288069ca3aed0b6', class: "helper" }, this.helper)));
     }
     static get is() { return "road-select"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/select-filter/select-filter.js

@@ -179,7 +179,7 @@ export class SelectFilter {
         const options = this.filteredOptions;
         const isActive = this.isActive ? 'true' : 'false';
         const notActive = this.isActive ? '' : 'not-active';
-        return (h(Host, { key: 'b1411c1e27ab139c15417acfe996f70f1412f049', "is-active": isActive }, h("slot", { key: 'cf2229232ebeb1b781f44dac2ce2bcc19eb56282' }), this.isOpen && (h("div", { key: '568f2f9ea1dfa8f6178805062cc5d391fbb1e122', class: `${notActive} select-filter-list`, role: "listbox", onMouseLeave: this.handleMouseLeave }, options.length === 0 ? (h("div", { class: "select-filter-empty" }, "Aucune option")) : (h("ul", { class: "pl-0" }, options.map((option, idx) => (h("li", { class: `select-filter-item ${this.activeIndex === idx ? 'active' : ''}`, role: "option", "aria-selected": this.activeIndex === idx ? 'true' : 'false', onClick: (e) => this.handleOptionClick(option.item.value, option.item.label.replace(/(<([^>]+)>)/gi, ''), e), onMouseOver: () => this.handleOptionMouseOver(idx), innerHTML: option.item.label, tabindex: this.activeIndex === idx ? 0 : -1 })))))))));
+        return (h(Host, { key: '56283f348c18c9f4da780910a296dff17656881e', "is-active": isActive }, h("slot", { key: '43a5b9dadb04f532e62259a415d921b731b7911e' }), this.isOpen && (h("div", { key: 'cac8b402cfaa77e6c84e60a50f73d148475c93f7', class: `${notActive} select-filter-list`, role: "listbox", onMouseLeave: this.handleMouseLeave }, options.length === 0 ? (h("div", { class: "select-filter-empty" }, "Aucune option")) : (h("ul", { class: "pl-0" }, options.map((option, idx) => (h("li", { class: `select-filter-item ${this.activeIndex === idx ? 'active' : ''}`, role: "option", "aria-selected": this.activeIndex === idx ? 'true' : 'false', onClick: (e) => this.handleOptionClick(option.item.value, option.item.label.replace(/(<([^>]+)>)/gi, ''), e), onMouseOver: () => this.handleOptionMouseOver(idx), innerHTML: option.item.label, tabindex: this.activeIndex === idx ? 0 : -1 })))))))));
     }
     static get is() { return "road-select-filter"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/skeleton/skeleton.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class Skeleton {
     render() {
-        return (h("span", { key: '33cfe20d51c54101ccf43a5027549fa79d707cab' }, "\u00A0"));
+        return (h("span", { key: 'f938a4cd82c542599e6729e9bbfca3fa51573956' }, "\u00A0"));
     }
     static get is() { return "road-skeleton"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/spinner/spinner.js

@@ -13,7 +13,7 @@ export class Spinner {
     render() {
         const sizeClass = this.size !== undefined ? `spinner spinner--${this.size}` : 'spinner';
         const colorClass = this.size !== undefined ? `spinner-circle spinner-circle--${this.color}` : 'spinner-circle';
-        return (h("svg", { key: '90d3a6eafbf227b79edf5b298b2bd5e212436c7a', class: `${sizeClass}`, viewBox: "25 25 50 50" }, h("circle", { key: '9a90e8724a39005b1a51029b25401fc876149571', class: `${colorClass}`, cx: "50", cy: "50", r: "20" })));
+        return (h("svg", { key: '1465d5db948734bba9d01c1371fbe97fba33ccb5', class: `${sizeClass}`, viewBox: "25 25 50 50" }, h("circle", { key: 'f7dd929e5cdef073f60d8e6d651fc3e64e594ced', class: `${colorClass}`, cx: "50", cy: "50", r: "20" })));
     }
     static get is() { return "road-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/status-chip/status-chip.js

@@ -12,7 +12,7 @@ export class Chip {
         this.size = 'sm';
     }
     render() {
-        return (h(Host, { key: '66bf3407592164729d81e1269900dfff160d60ce', class: `chip-${this.size}`, tabindex: "0" }, h("div", { key: 'e037baad33a3be2b430f9c2325abc81f4e7fd015', class: "chip-description" }, h("road-icon", { key: '961d65ef9f31be4444c983c0bd178e19c0f06692', class: "chip-icon", color: "info", icon: alertInfoSolid }), h("slot", { key: '3f1852768aa6a6dc6b234832688f6868b9676591' }))));
+        return (h(Host, { key: '22343d5f99de6406223630ccc5ddc4c8363f87ff', class: `chip-${this.size}`, tabindex: "0" }, h("div", { key: '53693f688a08c07d7c5c5c8f6f4ab6ecbad5c783', class: "chip-description" }, h("road-icon", { key: 'd66577297e5c33d7722c3026293830092e9f0239', class: "chip-icon", color: "info", icon: alertInfoSolid }), h("slot", { key: '248ca83089bffdb3695d953cb14ac38a27e10b4d' }))));
     }
     static get is() { return "road-status-chip"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/switch/switch.js

@@ -70,11 +70,11 @@ export class Switch {
     }
     render() {
         const labelId = this.switchId + '-label';
-        const textLabel = h("label", { key: 'ce7aa5f11558ca65be5c3e67fa4bd195befb93fb', class: "form-switch-label", id: labelId, htmlFor: this.switchId }, this.label);
+        const textLabel = h("label", { key: 'b0499c36ab0eb33ac879c37115b6a4754c5d1529', class: "form-switch-label", id: labelId, htmlFor: this.switchId }, this.label);
         const colorClass = this.color !== undefined ? 'form-switch-' + this.color : '';
         const isSpacedClass = this.isSpaced && 'form-switch-spaced';
         const rightSwitchClass = this.hasLeftLabel ? 'form-switch-right' : '';
-        return (h(Host, { key: '67cb125cd5c23b799ae301f584fe2fbf446a35dd' }, h("input", { key: 'dc19948d6370b14e077eb4725cfcb35916eb779f', class: "form-switch-input", type: "checkbox", id: this.switchId, name: this.name, checked: this.checked, disabled: this.disabled, value: this.value, "aria-checked": `${this.checked}`, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur }), h("label", { key: 'fb2645a723c66e5d45d621260f4ef18a172dccc4', class: `form-switch-label ${isSpacedClass} ${colorClass}`, htmlFor: this.switchId }, this.hasLeftLabel && textLabel, h("div", { key: 'a0e6f831b9136f89fcc70ed3004a8551c4b10760', class: `form-switch-lever ${rightSwitchClass}`, "data-off": this.off, "data-on": this.on }), this.hasLeftLabel ? '' : textLabel)));
+        return (h(Host, { key: 'a9365fb9fd70d406e5a90d740cead5094861ac79' }, h("input", { key: '8714e6da068a91604e19dfbdba6f6c712c339c07', class: "form-switch-input", type: "checkbox", id: this.switchId, name: this.name, checked: this.checked, disabled: this.disabled, value: this.value, "aria-checked": `${this.checked}`, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur }), h("label", { key: 'b181aecf57662fe3d9c4032ef5fbd47709730e85', class: `form-switch-label ${isSpacedClass} ${colorClass}`, htmlFor: this.switchId }, this.hasLeftLabel && textLabel, h("div", { key: '4c6da52b6e04657d6749eec12c3c6ff5f97ce762', class: `form-switch-lever ${rightSwitchClass}`, "data-off": this.off, "data-on": this.on }), this.hasLeftLabel ? '' : textLabel)));
     }
     static get is() { return "road-switch"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tab/tab.js

@@ -21,9 +21,9 @@ export class Tab {
     }
     render() {
         const { tab, active } = this;
-        return (h(Host, { key: '3027c31c282565b7d5905d3b3031db04ba1bed44', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
+        return (h(Host, { key: '925b7e9bcb116de9081e0f238799e28a31d385a1', role: "tabpanel", "aria-hidden": !active ? 'true' : null, "aria-labelledby": `tab-button-${tab}`, class: {
                 'tab-hidden': !active,
-            } }, h("slot", { key: '70ae19f3e889a8c46d062363445185055a6c1133' })));
+            } }, h("slot", { key: 'c4ae28afb00bd729cc5b2c434b8ac62d94d8b5f3' })));
     }
     static get is() { return "road-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tab-bar/tab-bar.js

@@ -36,11 +36,11 @@ export class TabBar {
     }
     render() {
         const { expand, center, secondary } = this;
-        return (h(Host, { key: 'a40a29c3f335bd4b49495203834bb937af77a4bb', role: "tablist", class: {
+        return (h(Host, { key: 'c88f5a50d83ec07361ed5dd08d5b8a29fd4ac13d', role: "tablist", class: {
                 'tab-expand': expand,
                 'tab-center': center,
                 'tab-secondary': secondary,
-            } }, h("slot", { key: 'b7abc10609ae8939e729c735fb942b1b89c604ad' })));
+            } }, h("slot", { key: '9a9f51b48cef50e484e4e6b0696108e9263f0f48' })));
     }
     static get is() { return "road-tab-bar"; }
     static get encapsulation() { return "shadow"; }

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

@@ -71,7 +71,7 @@ export class TabButton {
             rel,
             target,
         };
-        return (h(Host, { key: '3cb6c6f8dcab1715547dfa6fc43c4e6ec3234507', onClick: (ev) => !disabled && this.onClick(ev), onKeyup: (ev) => !disabled && this.onKeyUp(ev), role: "tab", tabindex: disabled ? -1 : tabIndex, "aria-selected": selected ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
+        return (h(Host, { key: 'd10e81cf00ff7acb3888181bf7b60db6b7e24162', onClick: (ev) => !disabled && this.onClick(ev), onKeyup: (ev) => !disabled && this.onKeyUp(ev), role: "tab", tabindex: disabled ? -1 : tabIndex, "aria-selected": selected ? 'true' : 'false', "aria-disabled": disabled ? 'true' : null, id: tab !== undefined ? `tab-button-${tab}` : null, class: {
                 'tab-selected': selected,
                 'tab-has-label': hasLabel,
                 'tab-has-icon': hasIcon,
@@ -79,7 +79,7 @@ export class TabButton {
                 'tab-has-icon-only': hasIcon && !hasLabel,
                 [`tab-layout-${layout}`]: true,
                 'tab-disabled': disabled, // Classe CSS pour les styles désactivés
-            } }, h("a", Object.assign({ key: '7f07a67f84c56857ac864b2d56c1698f31f618d5' }, attrs, { tabIndex: -1, class: "button-native", part: "native" }), h("span", { key: 'b6b0a2caa81b69199bf85210cec8722846a413b8', class: "button-inner" }, h("slot", { key: 'efbc557b0428fe1513f150ed97f0c9037284daa2' })))));
+            } }, h("a", Object.assign({ key: '81f0045d7d4b05e70ddcbab15866ed09d70eff11' }, attrs, { tabIndex: -1, class: "button-native", part: "native" }), h("span", { key: 'f167d63f29af54aa2632a0e46ca64499a70b3a22', class: "button-inner" }, h("slot", { key: '1b91f5ba629820ef6764eba4064d551ac8b6f820' })))));
     }
     static get is() { return "road-tab-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/table.js

@@ -4,7 +4,7 @@ import { h } from "@stencil/core";
  */
 export class Table {
     render() {
-        return (h("slot", { key: '4fbbf196c158059cc8c375e9fcd848cd8e2d864f' }));
+        return (h("slot", { key: '62d09e884d94443c31146ec24273a787c6ee3787' }));
     }
     static get is() { return "road-table"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/tabs/tabs.js

@@ -99,7 +99,7 @@ export class Tabs {
         return Array.from(this.el.querySelectorAll('road-tab'));
     }
     render() {
-        return (h(Host, { key: '5bea03df378d3de02ca7dec12e9794a8edbb073c', onRoadTabButtonClick: this.onTabClicked }, h("slot", { key: '9f6d69f412a26dce57a919d02003e7548e824b08', name: "top" }), h("div", { key: '05058a9ec02a249ab6bc9d0f2bc301c1803e1e20', class: "tabs-inner" }, h("slot", { key: 'f10bf6e9d99a0c040dd4045b18f22f288e19fc2e' }))));
+        return (h(Host, { key: '27ab87f41f3d6751434e8d6a2631cbe82d0a0cbc', onRoadTabButtonClick: this.onTabClicked }, h("slot", { key: 'bbb551131576e4eee16b94217507c31c2c60a6be', name: "top" }), h("div", { key: 'f8b534238faee2fc29784b7e1725b15191349838', class: "tabs-inner" }, h("slot", { key: 'a7314be1ed2375a652afab28df2c3bb0e5a154f2' }))));
     }
     static get is() { return "road-tabs"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tag/tag.js

@@ -16,7 +16,7 @@ export class Tag {
     }
     render() {
         const contrastClass = this.contrast ? `tag-${this.color} tag-${this.color}-contrast` : `tag-${this.color}`;
-        return (h(Host, { key: '2639b90b789a6fde1fae0f3201236a7c9f4e1aad', class: `${contrastClass}` }, h("slot", { key: '8039feeab97b500f0828e1efa751b9771f4f5e65' })));
+        return (h(Host, { key: '0310697bbc0e468cfb7a7c2c2d1b6c7b00e5c8a1', class: `${contrastClass}` }, h("slot", { key: '70eb0d5b559ca409cb1eae30a258fada641009d3' })));
     }
     static get is() { return "road-tag"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/text/text.js

@@ -11,7 +11,7 @@ export class Text {
     }
     render() {
         const colorClass = this.color !== undefined ? `text-${this.color}` : '';
-        return (h(Host, { key: '2b1df03bfadf4021cf4016c584cdbd0ccf09324c', class: `${colorClass}` }, h("slot", { key: '6966b8ebe4a2eb48b1fd020a707c6a37a519b099' })));
+        return (h(Host, { key: '9d1a62edc9a4602497b542292a0313ed52fc6156', class: `${colorClass}` }, h("slot", { key: '9aa0f728eae087590555f108f6562b96f5a926ed' })));
     }
     static get is() { return "road-text"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/textarea/textarea.js

@@ -82,7 +82,7 @@ export class Textarea {
         const hasValueClass = this.value !== '' ? 'has-value' : '';
         const noResizeClass = this.resize == false ? 'no-resize' : '';
         const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';
-        return (h(Host, { key: 'cc414e4da358e65b430b91b0f834cbe403993693', "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}` }, h("textarea", { key: '0d0a45eaf71ada8178387d6debfc5e3d6da6cb4f', class: `form-control textarea-control ${hasValueClass} ${noResizeClass} ${isInvalidClass}`, id: this.textareaId, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, maxLength: this.maxlength, minLength: this.minlength, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, value: value, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus }), h("label", { key: 'a74070b2761b5ced0251f5bce4ef48837d892c9d', class: "form-label", id: labelId, htmlFor: this.textareaId }, this.label), this.error && this.error !== '' && h("p", { key: 'ba52ee759d52772a2eac2e9948c64309164aabdc', class: "invalid-feedback" }, this.error), this.helper && this.helper !== '' && h("p", { key: '377f7c03d77aad381b2bdd63c4753369870612df', class: "helper" }, this.helper)));
+        return (h(Host, { key: 'b77fec4a19c3443154c949db07408a4a5c453f24', "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}` }, h("textarea", { key: 'ca0a2c4c1e436b3e99933eab9c3dd420693dd5ce', class: `form-control textarea-control ${hasValueClass} ${noResizeClass} ${isInvalidClass}`, id: this.textareaId, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, disabled: this.disabled, autoCapitalize: this.autocapitalize, autoFocus: this.autofocus, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, maxLength: this.maxlength, minLength: this.minlength, name: this.name, placeholder: this.placeholder, readOnly: this.readonly, required: this.required, value: value, spellcheck: this.spellcheck, cols: this.cols, rows: this.rows, wrap: this.wrap, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus }), h("label", { key: 'c59652092cfebc7a0cb9b1165b9387fd9a18c8d4', class: "form-label", id: labelId, htmlFor: this.textareaId }, this.label), this.error && this.error !== '' && h("p", { key: '7f2edce4666cc9a30bc365db10917a6b3c9f28da', class: "invalid-feedback" }, this.error), this.helper && this.helper !== '' && h("p", { key: '98885d35065c4309cfa1fcf4d20188fcd17c7e49', class: "helper" }, this.helper)));
     }
     static get is() { return "road-textarea"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/time-range-picker/time-range-picker.js

@@ -81,7 +81,7 @@ export class RoadTimeRangePicker {
         return { start: this.start, end: this.end };
     }
     render() {
-        return (h(Host, { key: 'c1528d80635b8cfdf6dbd01f890f20b12cb5948b', class: `time-range-picker input-${this.sizes}` }, this.label && (h("p", { key: '2d97d59a6b8449695537ad1a5bd0991e01c19bac', class: "label m-0" }, this.label, this.required && h("span", { key: '156a83258da14bc98be719155735afdbb17ccd50', class: "required-indicator" }, " *"))), h("div", { key: '836ab421c7c9ddbcd0e51a135d670962a0a27bf3', class: "time-range-picker-content d-flex align-items-center my-4" }, h("slot", { key: '66f945df18b1b404aa073d38501e11ee8bd5a1f0', name: "start" }), h("span", { key: '392ade369762ccf97ca3a8cf69398ca3a247f14e', class: "separator mx-12" }, this.separator), h("slot", { key: 'afac72354a5166ece7fcfea81c7115c599c61b85', name: "end" })), h("div", { key: '1a6d049fbe026f2c76cfb9164a3fff7983174ac4', class: "messages mt-1" }, this.errorMessages.map((msg, index) => (h("p", { key: index, class: "invalid-feedback m-0" }, h("road-icon", { slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), msg.trim())))), this.helper && h("p", { key: 'dacbada369bbbe28302070d11e2242958ee2d983', class: "helper mt-1" }, this.helper)));
+        return (h(Host, { key: '685a7671de7ffed7e612757dd378605b3036834b', class: `time-range-picker input-${this.sizes}` }, this.label && (h("p", { key: '12e0ed7a4983760428896639991992f954b1f2c9', class: "label m-0" }, this.label, this.required && h("span", { key: '7074c6b2ac09d83213c2e3fccd80a8669120ba54', class: "required-indicator" }, " *"))), h("div", { key: '623dc14b5b941c44b2cd6a3877c6f898f788f758', class: "time-range-picker-content d-flex align-items-center my-4" }, h("slot", { key: '35188a877334036853d72ef053e39ac6a2900d90', name: "start" }), h("span", { key: '1e1d3b4f5d21390c05f13e38d5e3333a555e1a62', class: "separator mx-12" }, this.separator), h("slot", { key: 'dd753814efa448dac72354add6e2774c22147139', name: "end" })), h("div", { key: '02f8b622150eda4e4499e658799894de74a20958', class: "messages mt-1" }, this.errorMessages.map((msg, index) => (h("p", { key: index, class: "invalid-feedback m-0" }, h("road-icon", { slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), msg.trim())))), this.helper && h("p", { key: '0d61bde2b23a43bf9fd726586de324c9d1e45954', class: "helper mt-1" }, this.helper)));
     }
     static get is() { return "road-time-range-picker"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toast/toast.js

@@ -86,7 +86,7 @@ export class Toast {
         if (this.color == 'danger') {
             this.timeout = 0;
         }
-        return (h(Host, { key: '7e6b8eb5b97d93b1c0da2b5fca2b95d7fe53b464', class: `${toastIsOpenClass}`, role: "alert" }, h("div", { key: '928fcd556ba9573248c0bf136d41ae385fef3c0f', class: `toast toast-${this.color}` }, h("road-icon", { key: '6620412742937e307d6677bdfeb5b3df34403cee', class: "toast-icon", icon: icon, "aria-hidden": "true" }), h("p", { key: 'b7fa0b376a936b6ddf6f7a995fbd531b6657dc72', class: "toast-label" }, this.label), h("button", { key: 'c38b2ab0f05605a9c428684e31ef07a8ee03491c', type: "button", class: "toast-close", "aria-label": "Close", onClick: this.onClick }, h("road-icon", { key: '71820f58335f516f7660650e10f042b347922113', icon: navigationClose, size: "md" })), h("slot", { key: '52cc64d445b08d0f3a993deae2228e8da87ba5f5', name: "progress" }))));
+        return (h(Host, { key: 'a23d9efd2c57c549c299afa7397c1d54da39fad4', class: `${toastIsOpenClass}`, role: "alert" }, h("div", { key: '2a2781c355e65842713a0fb011b24f13da018809', class: `toast toast-${this.color}` }, h("road-icon", { key: 'bdc30f61254fa6a358780a9eb24f5951ffe12684', class: "toast-icon", icon: icon, "aria-hidden": "true" }), h("p", { key: '26690a7b4c4d2c9b5111226e37e50f04900e7322', class: "toast-label" }, this.label), h("button", { key: '4b02f4e03ecfa6f9587808884f60852af9eed9ee', type: "button", class: "toast-close", "aria-label": "Close", onClick: this.onClick }, h("road-icon", { key: 'b7558ca5cce55da8fc90eb3011a0ba449a476289', icon: navigationClose, size: "md" })), h("slot", { key: 'cf46edeb98030ef816a3c0029265a53783d9ed56', name: "progress" }))));
     }
     static get is() { return "road-toast"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toggle/toggle.js

@@ -58,11 +58,11 @@ export class toggle {
     }
     render() {
         const labelId = this.toggleId + '-label';
-        const textLabel = h("label", { key: '200063a0e964b5a6cc9694a6aae1b45418751867', class: "form-toggle-label", id: labelId, htmlFor: this.toggleId }, this.label);
+        const textLabel = h("label", { key: 'ba35148ac26c71b2bc262b3fe9f7dc3de5f08370', class: "form-toggle-label", id: labelId, htmlFor: this.toggleId }, this.label);
         const isSpacedClass = this.isSpaced && 'form-toggle-spaced';
         const righttoggleClass = this.hasLeftLabel ? 'form-toggle-right' : '';
         const disabledClass = this.disabled ? 'disabled' : '';
-        return (h(Host, { key: '65b426ec8ab4b2e9c1f773e92c5034cb67893ded' }, h("input", { key: 'a92fd1807ad4fa13492cc7dc3664b088228d020b', class: "form-toggle-input", type: "checkbox", id: this.toggleId, name: this.name, checked: this.checked, disabled: this.disabled, value: this.value, "aria-checked": `${this.checked}`, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur }), h("label", { key: '4ad95f0f23572757d568923e88b29f7c7a24bbfa', class: `form-toggle-label ${isSpacedClass} ${disabledClass}`, htmlFor: this.toggleId }, this.hasLeftLabel && textLabel, h("div", { key: 'd82522fd9584390936eaf96b65a6a6fb14713794', class: `form-toggle-lever ${righttoggleClass}` }, this.checked ? (h("road-icon", { name: "check-small-solid", class: "form-toggle-lever-check", size: "md" })) : (h("road-icon", { name: "navigation-close-solid", class: "form-toggle-lever-close", size: "md" }))), this.hasLeftLabel ? '' : textLabel)));
+        return (h(Host, { key: 'f534525f661135af3465bf513fbffe03dc56ab38' }, h("input", { key: '7f81baf61ec97adcce01edaee0bf758e5523d71b', class: "form-toggle-input", type: "checkbox", id: this.toggleId, name: this.name, checked: this.checked, disabled: this.disabled, value: this.value, "aria-checked": `${this.checked}`, "aria-disabled": this.disabled ? 'true' : null, "aria-labelledby": labelId, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur }), h("label", { key: '62460c291d7d6a518e5c5d08fa5776050d95110c', class: `form-toggle-label ${isSpacedClass} ${disabledClass}`, htmlFor: this.toggleId }, this.hasLeftLabel && textLabel, h("div", { key: '43512b3f7203bee3137e986ee021bd1107f118cc', class: `form-toggle-lever ${righttoggleClass}` }, this.checked ? (h("road-icon", { name: "check-small-solid", class: "form-toggle-lever-check", size: "md" })) : (h("road-icon", { name: "navigation-close-solid", class: "form-toggle-lever-close", size: "md" }))), this.hasLeftLabel ? '' : textLabel)));
     }
     static get is() { return "road-toggle"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/toolbar/toolbar.js

@@ -10,7 +10,7 @@ import { Host, h } from "@stencil/core";
 export class Toolbar {
     render() {
         const colorClass = this.color !== undefined ? `toolbar-${this.color}` : '';
-        return (h(Host, { key: '4155097cf17050c6f1c9ddd4ad66c153f005fa45', class: colorClass }, h("div", { key: '74c8520959b7893b32c59744ad5486ed075d5ee1', class: "toolbar-container" }, h("slot", { key: '37605f2014027e0f12b5c80b2f57db710ae3b726', name: "start" }), h("slot", { key: '9162f18c3fc3fab8ce1491841889a2d9616ab0e9', name: "primary" }), h("div", { key: 'fdf739135446b6977e3d89537118a3417c0bfd86', class: "toolbar-content" }, h("slot", { key: '48434e192dd116fe52796dbe3f62d6bed0ac5a79' })), h("slot", { key: '5eee5c80975129ed993ce466e5d96efdd6854922', name: "secondary" }), h("slot", { key: 'c52c70da47aea897e50c7eab9a3fdfba5f9056e3', name: "end" }))));
+        return (h(Host, { key: 'b241b745def7b165ef5e6df90a4c976df79967a7', class: colorClass }, h("div", { key: 'b7429305780cefbc62057b3de5585505d197b4e3', class: "toolbar-container" }, h("slot", { key: 'e1095e0ccbe77021455b2b2dc50cde77f2570889', name: "start" }), h("slot", { key: '4664948325cb7a5bd0994078828457aba28ee6f7', name: "primary" }), h("div", { key: 'ab74e4d57f7abc23f85812c98de539c0b734a186', class: "toolbar-content" }, h("slot", { key: 'e79434348e852c3904ffa47856d8c091628fb59d' })), h("slot", { key: '6e7ae8afa24083b5a3b0ebb1aadcbf26c3f7b8d0', name: "secondary" }), h("slot", { key: 'e1fb505a58d79c0e3ebb6c7dbfe28ea572c4036f', name: "end" }))));
     }
     static get is() { return "road-toolbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toolbar-title/toolbar-title.js

@@ -4,7 +4,7 @@ import { h } from "@stencil/core";
  */
 export class ToolbarTitle {
     render() {
-        return (h("div", { key: 'fe411cfd08be76715a7896bb645a9c5d07479539', class: "toolbar-title" }, h("slot", { key: 'c81416028a3c8aef9676e3c52f6ffb3202994eff' })));
+        return (h("div", { key: '742688fba3267e9a387d8ae176d5af3112035686', class: "toolbar-title" }, h("slot", { key: '23f50e8813d852a95e6489272b90bc6698772a4e' })));
     }
     static get is() { return "road-toolbar-title"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toolbar-title-page/toolbar-title-page.js

@@ -4,7 +4,7 @@ import { h } from "@stencil/core";
  */
 export class ToolbarAppName {
     render() {
-        return (h("div", { key: 'fa5fa9ad6f5e3a1d562bdc38b312c16cc9483d54', class: "toolbar-title-page" }, h("slot", { key: 'b35389dcc32ff0ba0c163e5916d701c79fbf8ba9' })));
+        return (h("div", { key: '5b3f14f6952d3601e6e998ff2b727424fab555cd', class: "toolbar-title-page" }, h("slot", { key: '9f0eb9f41cc22369bc1867ebd5f28b89fa442eba' })));
     }
     static get is() { return "road-toolbar-title-page"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/toolbar-v2/toolbar-v2.js

@@ -9,7 +9,7 @@ import { Host, h } from "@stencil/core";
  */
 export class ToolbarV2 {
     render() {
-        return (h(Host, { key: 'baadd003637adbfecd43171047bd15bdf9ea6703', class: "toolbar" }, h("div", { key: 'ce2ad280afbb52c7dfd3d05fd4cbbc740edcbc72', class: "toolbar-container" }, h("div", { key: 'ede1c5b3749744ecdd41926b11efbde968bf58c1', class: "toolbar-container-content-left" }, h("slot", { key: 'c0076ab7411d30d6c018155c11eef33ddcd7341b', name: "start" }), h("slot", { key: 'c6cb5ab75a4135c73bc6daf10c6075aa98cd8d51', name: "primary" })), h("div", { key: 'bc46b95ef46a0c55ea67fbdc04d8ab04179c6445', class: "toolbar-content" }, h("slot", { key: 'c73f60b2ba26f405fd13cd66b6b5b87810b50b44' })), h("div", { key: '0886cb221b201e1f39754e9a18a844a582437572', class: "toolbar-container-content-right" }, h("slot", { key: '3d143472b05113fb9440738c5b74afed8e75d68c', name: "secondary" }), h("slot", { key: '98cceebd60e608dd9e7eced6046cd5a0b12d8a94', name: "end" })))));
+        return (h(Host, { key: '62ea20f134b10b364d0c9238aa64ba1d75a9191a', class: "toolbar" }, h("div", { key: 'c3b5a93350cbf7de5d5224c04fd082ff993020b1', class: "toolbar-container" }, h("div", { key: 'e3d8b61c07cbeef7720fce382d78668f6d74ae35', class: "toolbar-container-content-left" }, h("slot", { key: '7255141af24d37a06e36f5c565c95b918d53392e', name: "start" }), h("slot", { key: 'ce9156a72df70dae4e725a5d145af1ba32078c17', name: "primary" })), h("div", { key: '27f73e3afe5a75911165cc4beea2a5aa9f57bab4', class: "toolbar-content" }, h("slot", { key: 'a11fa5976a59e1e34375a43ed3f4f7dc4aec1fb9' })), h("div", { key: 'c1d147e5883163ef8dd8aa3c2498d577166aade7', class: "toolbar-container-content-right" }, h("slot", { key: 'f85a1e5cda535a862fa19660e369b72d1927fd33', name: "secondary" }), h("slot", { key: '4a66978a37a7203b583c6c3c6b907db4b77f2be2', name: "end" })))));
     }
     static get is() { return "road-toolbar-v2"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/tooltip/tooltip.js

@@ -1,4 +1,30 @@
 import { Host, h } from "@stencil/core";
+let isKeyboardNavigation = false;
+const onGlobalKeyDown = () => {
+    isKeyboardNavigation = true;
+};
+const onGlobalMouseDown = () => {
+    isKeyboardNavigation = false;
+};
+let globalInputModeUsers = 0;
+function registerGlobalInputModeListeners() {
+    if (typeof document === "undefined")
+        return;
+    if (globalInputModeUsers === 0) {
+        document.addEventListener("keydown", onGlobalKeyDown);
+        document.addEventListener("mousedown", onGlobalMouseDown);
+    }
+    globalInputModeUsers++;
+}
+function unregisterGlobalInputModeListeners() {
+    if (typeof document === "undefined")
+        return;
+    globalInputModeUsers = Math.max(0, globalInputModeUsers - 1);
+    if (globalInputModeUsers === 0) {
+        document.removeEventListener("keydown", onGlobalKeyDown);
+        document.removeEventListener("mousedown", onGlobalMouseDown);
+    }
+}
 /**
  * @slot tooltip-content - content of the tooltip, if you need to add html content, use this slot, otherwise use directly the content prop.
  *
@@ -13,15 +39,15 @@ export class Tooltip {
         /**
          * The tooltip's content.
          */
-        this.content = '';
+        this.content = "";
         /**
          * The position of the tooltip.
          */
-        this.position = 'top';
+        this.position = "top";
         /**
          * The content align of the tooltip.
          */
-        this.contentAlign = 'center';
+        this.contentAlign = "center";
         /**
          * Indicates whether or not the tooltip is open. You can use this or the open/close methods.
          */
@@ -31,36 +57,31 @@ export class Tooltip {
          * options can be passed by separating them with a space. When manual is used, the tooltip must be activated
          * programmatically.
          */
-        this.trigger = 'hover';
+        this.trigger = "hover";
         this.onClick = () => {
-            if (this.hasTrigger('click')) {
+            if (this.hasTrigger("click")) {
                 this.isOpen ? this.close() : this.open();
             }
         };
         this.onMouseOver = () => {
-            if (this.hasTrigger('hover')) {
+            if (this.hasTrigger("hover")) {
                 this.open();
             }
         };
         this.onMouseOut = () => {
-            if (this.hasTrigger('hover')) {
+            if (this.hasTrigger("hover")) {
                 this.close();
             }
         };
-        this.isKeyboardNavigation = false;
-        this.handleKeyDown = () => {
-            this.isKeyboardNavigation = true;
-        };
-        this.handleMouseDown = () => {
-            this.isKeyboardNavigation = false;
-        };
         this.onFocus = () => {
-            if (this.isKeyboardNavigation && this.hasTrigger('hover')) {
+            if (isKeyboardNavigation &&
+                (this.hasTrigger("hover") || this.hasTrigger("focus"))) {
                 this.open();
             }
         };
         this.onBlur = () => {
-            if (this.isKeyboardNavigation && this.hasTrigger('hover')) {
+            if (isKeyboardNavigation &&
+                (this.hasTrigger("hover") || this.hasTrigger("focus"))) {
                 this.close();
             }
         };
@@ -77,30 +98,23 @@ export class Tooltip {
     async close() {
         this.isOpen = false;
     }
-    // Écoute les événements pour détecter le mode d'interaction
-    componentDidMount() {
-        document.addEventListener('keydown', this.handleKeyDown);
-        document.addEventListener('mousedown', this.handleMouseDown);
-    }
-    componentDidLoad() {
-        document.addEventListener('keydown', this.handleKeyDown);
-        document.addEventListener('mousedown', this.handleMouseDown);
+    connectedCallback() {
+        registerGlobalInputModeListeners();
     }
-    componentWillUnmount() {
-        document.removeEventListener('keydown', this.handleKeyDown);
-        document.removeEventListener('mousedown', this.handleMouseDown);
+    disconnectedCallback() {
+        unregisterGlobalInputModeListeners();
     }
     hasTrigger(triggerType) {
-        const triggers = this.trigger.split(' ');
+        const triggers = this.trigger.split(" ");
         return triggers.includes(triggerType);
     }
     render() {
-        return (h(Host, { key: '1e3cb1bb336b5c4a63f3395c588f2c842a6c22a7', onMouseOver: this.onMouseOver, onMouseOut: this.onMouseOut, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur, tabindex: "0" // Makes the element focusable
+        return (h(Host, { key: '9150dafd734e51cf806d8fe9dd9f7cabb30516f0', onMouseOver: this.onMouseOver, onMouseOut: this.onMouseOut, onClick: this.onClick, onFocus: this.onFocus, onBlur: this.onBlur, tabindex: "0" // Makes the element focusable
             ,
-            "data-tooltip-position": this.position }, h("slot", { key: '8b5ae95d0076acbad18fb73bf32e9b31085c8365', "aria-describedby": this.tooltipId }), h("div", { key: 'ba8a5ac573fa0b31edb9e26fab1c8ee212789f1d', part: "tooltip", id: this.tooltipId, class: {
+            "data-tooltip-position": this.position }, h("slot", { key: '11b94662e222cdb59b71a2f261788860444ae274', "aria-describedby": this.tooltipId }), h("div", { key: '59cc457c5e21956d9c395b82db9bc0e1cd867432', part: "tooltip", id: this.tooltipId, class: {
                 tooltip: true,
-                'tooltip-open': this.isOpen,
-            }, role: "tooltip", "aria-hidden": !this.isOpen ? 'true' : 'false' }, this.content, h("slot", { key: 'cbc2c9bce87ee7b42897c9a8a24ff0f896e0670c', name: "tooltip-content" }))));
+                "tooltip-open": this.isOpen,
+            }, role: "tooltip", "aria-hidden": !this.isOpen ? "true" : "false" }, this.content, h("slot", { key: '4ce82842f3a6a7c91c6e8f2c7c7f86775f83a2c3', name: "tooltip-content" }))));
     }
     static get is() { return "road-tooltip"; }
     static get encapsulation() { return "shadow"; }
@@ -154,13 +168,13 @@ export class Tooltip {
                 "setter": false,
                 "attribute": "content",
                 "reflect": false,
-                "defaultValue": "''"
+                "defaultValue": "\"\""
             },
             "position": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "| 'top'\n    | 'right'\n    | 'bottom'\n    | 'top-left'\n    | 'top-right'\n    | 'top-start'\n    | 'top-end'\n    | 'bottom-left'\n    | 'bottom-right'\n    | 'bottom-start'\n    | 'bottom-end'\n    | 'left'",
+                    "original": "| \"top\"\n    | \"right\"\n    | \"bottom\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"top-start\"\n    | \"top-end\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n    | \"bottom-start\"\n    | \"bottom-end\"\n    | \"left\"",
                     "resolved": "\"bottom\" | \"bottom-end\" | \"bottom-left\" | \"bottom-right\" | \"bottom-start\" | \"left\" | \"right\" | \"top\" | \"top-end\" | \"top-left\" | \"top-right\" | \"top-start\"",
                     "references": {}
                 },
@@ -174,13 +188,13 @@ export class Tooltip {
                 "setter": false,
                 "attribute": "position",
                 "reflect": false,
-                "defaultValue": "'top'"
+                "defaultValue": "\"top\""
             },
             "contentAlign": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
-                    "original": "| 'center'\n    | 'left'",
+                    "original": "\"center\" | \"left\"",
                     "resolved": "\"center\" | \"left\"",
                     "references": {}
                 },
@@ -194,7 +208,7 @@ export class Tooltip {
                 "setter": false,
                 "attribute": "content-align",
                 "reflect": false,
-                "defaultValue": "'center'"
+                "defaultValue": "\"center\""
             },
             "isOpen": {
                 "type": "boolean",
@@ -234,7 +248,7 @@ export class Tooltip {
                 "setter": false,
                 "attribute": "trigger",
                 "reflect": false,
-                "defaultValue": "'hover'"
+                "defaultValue": "\"hover\""
             }
         };
     }