@roadtrip/components 3.27.0 → 3.29.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/dist/cjs/loader.cjs.js +1 -1
  2. package/dist/cjs/road-badge_14.cjs.entry.js +44 -13
  3. package/dist/cjs/road-badge_14.cjs.entry.js.map +1 -1
  4. package/dist/cjs/road-phone-number-input.cjs.entry.js +1 -1
  5. package/dist/cjs/road-phone-number-input.cjs.entry.js.map +1 -1
  6. package/dist/cjs/road-tab-button.cjs.entry.js +6 -4
  7. package/dist/cjs/road-tab-button.cjs.entry.js.map +1 -1
  8. package/dist/cjs/road-toggle.cjs.entry.js +3 -2
  9. package/dist/cjs/road-toggle.cjs.entry.js.map +1 -1
  10. package/dist/cjs/roadtrip.cjs.js +1 -1
  11. package/dist/collection/components/button/button.css +42 -2
  12. package/dist/collection/components/button/button.stories.js +13 -1
  13. package/dist/collection/components/drawer/drawer.css +8 -0
  14. package/dist/collection/components/input/input.js +13 -2
  15. package/dist/collection/components/input/input.js.map +1 -1
  16. package/dist/collection/components/input-group/input-group.css +67 -12
  17. package/dist/collection/components/input-group/input-group.js +55 -8
  18. package/dist/collection/components/input-group/input-group.js.map +1 -1
  19. package/dist/collection/components/input-group/input-group.stories.js +25 -15
  20. package/dist/collection/components/phone-number-input/phone-number-input.js +1 -1
  21. package/dist/collection/components/phone-number-input/phone-number-input.js.map +1 -1
  22. package/dist/collection/components/tab-button/tab-button.css +19 -2
  23. package/dist/collection/components/tab-button/tab-button.js +23 -3
  24. package/dist/collection/components/tab-button/tab-button.js.map +1 -1
  25. package/dist/collection/components/toggle/toggle.css +4 -0
  26. package/dist/collection/components/toggle/toggle.js +2 -1
  27. package/dist/collection/components/toggle/toggle.js.map +1 -1
  28. package/dist/esm/loader.js +1 -1
  29. package/dist/esm/road-badge_14.entry.js +44 -13
  30. package/dist/esm/road-badge_14.entry.js.map +1 -1
  31. package/dist/esm/road-phone-number-input.entry.js +1 -1
  32. package/dist/esm/road-phone-number-input.entry.js.map +1 -1
  33. package/dist/esm/road-tab-button.entry.js +6 -4
  34. package/dist/esm/road-tab-button.entry.js.map +1 -1
  35. package/dist/esm/road-toggle.entry.js +3 -2
  36. package/dist/esm/road-toggle.entry.js.map +1 -1
  37. package/dist/esm/roadtrip.js +1 -1
  38. package/dist/html.html-data.json +10 -1
  39. package/dist/roadtrip/p-1115f970.entry.js +2 -0
  40. package/dist/roadtrip/p-1115f970.entry.js.map +1 -0
  41. package/dist/roadtrip/p-2e7d3440.entry.js +2 -0
  42. package/dist/roadtrip/p-2e7d3440.entry.js.map +1 -0
  43. package/dist/roadtrip/p-37563bb6.entry.js +2 -0
  44. package/dist/roadtrip/p-37563bb6.entry.js.map +1 -0
  45. package/dist/roadtrip/{p-026e28b6.entry.js → p-8ac960ce.entry.js} +2 -2
  46. package/dist/roadtrip/{p-026e28b6.entry.js.map → p-8ac960ce.entry.js.map} +1 -1
  47. package/dist/roadtrip/roadtrip.css +1 -1
  48. package/dist/roadtrip/roadtrip.esm.js +1 -1
  49. package/dist/roadtrip/roadtrip.esm.js.map +1 -1
  50. package/dist/types/components/input/input.d.ts +1 -0
  51. package/dist/types/components/input-group/input-group.d.ts +7 -1
  52. package/dist/types/components/tab-button/tab-button.d.ts +4 -0
  53. package/dist/types/components.d.ts +16 -0
  54. package/hydrate/index.js +58 -21
  55. package/package.json +1 -1
  56. package/dist/roadtrip/p-0dbf612d.entry.js +0 -2
  57. package/dist/roadtrip/p-0dbf612d.entry.js.map +0 -1
  58. package/dist/roadtrip/p-430e6759.entry.js +0 -2
  59. package/dist/roadtrip/p-430e6759.entry.js.map +0 -1
  60. package/dist/roadtrip/p-c1dca3cc.entry.js +0 -2
  61. package/dist/roadtrip/p-c1dca3cc.entry.js.map +0 -1
package/hydrate/index.js CHANGED
@@ -6186,7 +6186,7 @@ class Banner {
6186
6186
  }; }
6187
6187
  }
6188
6188
 
6189
- const buttonCss = "/*!@:host*/.sc-road-button-h{--border-radius:0.25rem;--font-size:var(--road-button-medium);--margin-bottom:1rem;--padding-start:1.5rem;--padding-end:1.5rem;box-sizing:border-box;display:inline-flex;display:-webkit-inline-flex;align-items:center;justify-content:center;height:3rem;padding:0;margin-bottom:var(--margin-bottom);font-family:var(--road-font, sans-serif);font-size:var(--font-size);font-weight:700;line-height:1.375;color:var(--road-grey-10);text-decoration:none;white-space:nowrap;vertical-align:middle;background:transparent;border:1px solid transparent;border-radius:var(--border-radius);transition:background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}/*!@:host(:hover)*/.sc-road-button-h:hover{text-decoration:none}/*!@:host(.focus-visible)*/.focus-visible.sc-road-button-h{text-decoration:underline;outline:auto}/*!@.button-native*/.button-native.sc-road-button{position:relative;display:flex;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%;padding:0 var(--padding-end) 0 var(--padding-start);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:inherit;text-decoration:none;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;cursor:pointer;background:transparent;border:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@:host(.btn-default:not([disabled]).focus-visible)*/.btn-default.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-grey-80)}/*!@:host(.btn-primary)*/.btn-primary.sc-road-button-h{color:var(--road-on-button-primary);background:var(--road-button-primary)}/*!@:host(.btn-primary) ::slotted(road-icon)*/.sc-road-button-h.btn-primary .sc-road-button-s>road-icon{color:var(--road-on-button-primary)}/*!@:host(.btn-primary:not([disabled]):hover),\n:host(.btn-primary:not([disabled]).focus-visible)*/.btn-primary.sc-road-button-h:not([disabled]):hover,.btn-primary.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-button-primary-variant);outline:0}/*!@:host(.btn-secondary)*/.btn-secondary.sc-road-button-h{color:var(--road-on-button-secondary);background:var(--road-button-secondary)}/*!@:host(.btn-secondary) ::slotted(road-icon)*/.sc-road-button-h.btn-secondary .sc-road-button-s>road-icon{color:var(--road-on-button-secondary)}/*!@:host(.btn-secondary:not([disabled]):hover),\n:host(.btn-secondary:not([disabled]).focus-visible)*/.btn-secondary.sc-road-button-h:not([disabled]):hover,.btn-secondary.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-button-secondary-variant)}/*!@:host(.btn-link)*/.btn-link.sc-road-button-h{font-weight:400;color:var(--road-link-primary);text-decoration:underline;background:transparent}/*!@:host(.btn-link:not([disabled]):hover),\n:host(.btn-link:not([disabled]).focus-visible)*/.btn-link.sc-road-button-h:not([disabled]):hover,.btn-link.sc-road-button-h:not([disabled]).focus-visible{color:var(--road-primary-30)}/*!@:host(.btn-outline-primary),\n:host(.btn-outline-secondary),\n:host(.btn-outline-default)*/.btn-outline-primary.sc-road-button-h,.btn-outline-secondary.sc-road-button-h,.btn-outline-default.sc-road-button-h{background:transparent}/*!@:host(.btn-outline-default)*/.btn-outline-default.sc-road-button-h{color:var(--road-on-surface-weak);background:var(--road-surface);border-color:var(--road-input-outline)}/*!@:host(.btn-outline-default) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-default .sc-road-button-s>road-icon{color:var(--road-on-surface-weak)}/*!@:host(.btn-outline-default:hover),\n:host(.btn-outline-default.focus-visible)*/.btn-outline-default.sc-road-button-h:hover,.btn-outline-default.focus-visible.sc-road-button-h{background:var(--road-grey-80)}/*!@:host(.btn-ghost) ::slotted(road-icon)*/.sc-road-button-h.btn-ghost .sc-road-button-s>road-icon{color:var(--road-icon)}/*!@:host(.btn-ghost:hover),\n:host(.btn-ghost.focus-visible)*/.btn-ghost.sc-road-button-h:hover,.btn-ghost.focus-visible.sc-road-button-h{background:var(--road-button-ghost-variant)}/*!@:host([aria-disabled].btn-outline-primary)*/[aria-disabled].btn-outline-primary.sc-road-button-h{background:none}/*!@:host(.btn-outline-primary)*/.btn-outline-primary.sc-road-button-h{color:var(--road-button-primary);border-color:var(--road-button-tertiary-outline)}/*!@:host(.btn-outline-primary) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-primary .sc-road-button-s>road-icon{color:var(--road-button-primary)}/*!@:host(.btn-outline-primary:hover),\n:host(.btn-outline-primary.focus-visible)*/.btn-outline-primary.sc-road-button-h:hover,.btn-outline-primary.focus-visible.sc-road-button-h{background:var(--road-button-tertiary-variant)}/*!@:host(.btn-outline-secondary)*/.btn-outline-secondary.sc-road-button-h{color:var(--road-button-secondary);border-color:var(--road-button-secondary)}/*!@:host(.btn-outline-secondary) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-secondary .sc-road-button-s>road-icon{color:var(--road-button-secondary)}/*!@:host(.btn-outline-secondary:hover),\n:host(.btn-outline-secondary.focus-visible)*/.btn-outline-secondary.sc-road-button-h:hover,.btn-outline-secondary.focus-visible.sc-road-button-h{background:var(--road-button-tertiary-variant)}/*!@:host([aria-disabled])*/[aria-disabled].sc-road-button-h{color:var(--road-on-surface-disabled);pointer-events:none;cursor:not-allowed;background-color:var(--road-surface-disabled);border-color:1px solid var(--road-surface-disabled)}/*!@:host([aria-disabled]) ::slotted(road-icon)*/.sc-road-button-h[aria-disabled] .sc-road-button-s>road-icon{color:var(--road-on-surface-disabled)}/*!@.button-native:disabled*/.button-native.sc-road-button:disabled{cursor:not-allowed}/*!@::slotted([slot=\"start\"])*/.sc-road-button-s>[slot=\"start\"]{margin-right:0.5rem}/*!@::slotted([slot=\"end\"])*/.sc-road-button-s>[slot=\"end\"]{margin-left:0.5rem}/*!@:host(.btn-xl)*/.btn-xl.sc-road-button-h{height:3.5rem}/*!@:host(.btn-xl) ::slotted(road-icon)*/.sc-road-button-h.btn-xl .sc-road-button-s>road-icon{width:2rem;height:2rem}/*!@:host(.btn-icon.btn-xl)*/.btn-icon.btn-xl.sc-road-button-h{width:56px}/*!@:host(.btn-lg)*/.btn-lg.sc-road-button-h{height:3rem}/*!@:host(.btn-lg) ::slotted(road-icon)*/.sc-road-button-h.btn-lg .sc-road-button-s>road-icon{width:2rem;height:2rem}/*!@:host(.btn-icon.btn-lg)*/.btn-icon.btn-lg.sc-road-button-h{width:48px}/*!@:host(.btn-md)*/.btn-md.sc-road-button-h{--font-size:var(--road-font-size-14);height:2.5rem}/*!@:host(.btn-md) ::slotted(road-icon)*/.sc-road-button-h.btn-md .sc-road-button-s>road-icon{width:1.5rem;height:1.5rem}/*!@:host(.btn-icon.btn-md)*/.btn-icon.btn-md.sc-road-button-h{width:40px}/*!@:host(.btn-sm)*/.btn-sm.sc-road-button-h{--font-size:var(--road-font-size-14);height:2rem}/*!@:host(.btn-sm) ::slotted(road-icon)*/.sc-road-button-h.btn-sm .sc-road-button-s>road-icon{width:1.25rem;height:1.25rem}/*!@:host(.btn-icon.btn-sm)*/.btn-icon.btn-sm.sc-road-button-h{width:32px}/*!@:host(.btn-block)*/.btn-block.sc-road-button-h{width:100%}/*!@:host(.btn-icon) .button-native*/.btn-icon.sc-road-button-h .button-native.sc-road-button{padding:0}/*!@::slotted(road-badge)*/.sc-road-button-s>road-badge{position:absolute;top:4px;left:calc(50% + 0.375rem);box-sizing:border-box;height:auto}";
6189
+ const buttonCss = "/*!@:host*/.sc-road-button-h{--border-radius:0.25rem;--font-size:var(--road-button-medium);--margin-bottom:1rem;--padding-start:1.5rem;--padding-end:1.5rem;box-sizing:border-box;display:inline-flex;display:-webkit-inline-flex;align-items:center;justify-content:center;height:3rem;padding:0;margin-bottom:var(--margin-bottom);font-family:var(--road-font, sans-serif);font-size:var(--font-size);font-weight:700;line-height:1.375;color:var(--road-grey-10);text-decoration:none;white-space:nowrap;vertical-align:middle;background:transparent;border:1px solid transparent;border-radius:var(--border-radius);transition:background 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms, color 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms}/*!@:host(:hover)*/.sc-road-button-h:hover{text-decoration:none}/*!@:host(.focus-visible)*/.focus-visible.sc-road-button-h{text-decoration:underline;outline:auto}/*!@.button-native*/.button-native.sc-road-button{position:relative;display:flex;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%;padding:0 var(--padding-end) 0 var(--padding-start);margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:inherit;text-decoration:none;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;cursor:pointer;background:transparent;border:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@:host(.btn-default:not([disabled]).focus-visible)*/.btn-default.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-grey-80)}/*!@:host(.btn-primary)*/.btn-primary.sc-road-button-h{color:var(--road-on-button-primary);background:var(--road-button-primary)}/*!@:host(.btn-primary) ::slotted(road-icon)*/.sc-road-button-h.btn-primary .sc-road-button-s>road-icon{color:var(--road-on-button-primary)}/*!@:host(.btn-primary:not([disabled]):hover),\n:host(.btn-primary:not([disabled]).focus-visible)*/.btn-primary.sc-road-button-h:not([disabled]):hover,.btn-primary.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-button-primary-variant);outline:0}/*!@:host(.btn-secondary)*/.btn-secondary.sc-road-button-h{color:var(--road-on-button-secondary);background:var(--road-button-secondary)}/*!@:host(.btn-secondary) ::slotted(road-icon)*/.sc-road-button-h.btn-secondary .sc-road-button-s>road-icon{color:var(--road-on-button-secondary)}/*!@:host(.btn-secondary:not([disabled]):hover),\n:host(.btn-secondary:not([disabled]).focus-visible)*/.btn-secondary.sc-road-button-h:not([disabled]):hover,.btn-secondary.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-button-secondary-variant)}/*!@:host(.btn-destructive)*/.btn-destructive.sc-road-button-h{color:var(--road-on-button-destructive-primary);background:var(--road-button-destructive-primary)}/*!@:host(.btn-destructive) ::slotted(road-icon)*/.sc-road-button-h.btn-destructive .sc-road-button-s>road-icon{color:var(--road-on-button-destructive-primary)}/*!@:host(.btn-destructive:not([disabled]):hover),\n:host(.btn-destructive:not([disabled]).focus-visible)*/.btn-destructive.sc-road-button-h:not([disabled]):hover,.btn-destructive.sc-road-button-h:not([disabled]).focus-visible{background:var(--road-button-destructive-primary-variant)}/*!@:host(.btn-link)*/.btn-link.sc-road-button-h{font-weight:400;color:var(--road-link-primary);text-decoration:underline;background:transparent}/*!@:host(.btn-link:not([disabled]):hover),\n:host(.btn-link:not([disabled]).focus-visible)*/.btn-link.sc-road-button-h:not([disabled]):hover,.btn-link.sc-road-button-h:not([disabled]).focus-visible{color:var(--road-primary-30)}/*!@:host(.btn-outline-primary),\n:host(.btn-outline-secondary),\n:host(.btn-outline-default),\n:host(.btn-outline-destructive)*/.btn-outline-primary.sc-road-button-h,.btn-outline-secondary.sc-road-button-h,.btn-outline-default.sc-road-button-h,.btn-outline-destructive.sc-road-button-h{background:transparent}/*!@:host(.btn-outline-default)*/.btn-outline-default.sc-road-button-h{color:var(--road-on-surface-weak);background:var(--road-surface);border-color:var(--road-input-outline)}/*!@:host(.btn-outline-default) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-default .sc-road-button-s>road-icon{color:var(--road-on-surface-weak)}/*!@:host(.btn-outline-default:hover),\n:host(.btn-outline-default.focus-visible)*/.btn-outline-default.sc-road-button-h:hover,.btn-outline-default.focus-visible.sc-road-button-h{background:var(--road-grey-80)}/*!@:host(.btn-ghost)*/.btn-ghost.sc-road-button-h{color:var(--road-on-button-ghost)}/*!@:host(.btn-ghost) ::slotted(road-icon)*/.sc-road-button-h.btn-ghost .sc-road-button-s>road-icon{color:var(--road-on-button-ghost)}/*!@:host(.btn-ghost:hover),\n:host(.btn-ghost.focus-visible)*/.btn-ghost.sc-road-button-h:hover,.btn-ghost.focus-visible.sc-road-button-h{background:var(--road-button-ghost-variant)}/*!@:host([aria-disabled].btn-outline-primary)*/[aria-disabled].btn-outline-primary.sc-road-button-h{background:none}/*!@:host(.btn-outline-primary)*/.btn-outline-primary.sc-road-button-h{color:var(--road-button-primary);border-color:var(--road-button-tertiary-outline)}/*!@:host(.btn-outline-primary) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-primary .sc-road-button-s>road-icon{color:var(--road-button-primary)}/*!@:host(.btn-outline-primary:hover),\n:host(.btn-outline-primary.focus-visible)*/.btn-outline-primary.sc-road-button-h:hover,.btn-outline-primary.focus-visible.sc-road-button-h{background:var(--road-button-tertiary-variant)}/*!@:host(.btn-outline-secondary)*/.btn-outline-secondary.sc-road-button-h{color:var(--road-button-secondary);border-color:var(--road-button-secondary)}/*!@:host(.btn-outline-secondary) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-secondary .sc-road-button-s>road-icon{color:var(--road-button-secondary)}/*!@:host(.btn-outline-secondary:hover),\n:host(.btn-outline-secondary.focus-visible)*/.btn-outline-secondary.sc-road-button-h:hover,.btn-outline-secondary.focus-visible.sc-road-button-h{background:var(--road-button-tertiary-variant)}/*!@:host(.btn-outline-destructive)*/.btn-outline-destructive.sc-road-button-h{color:var(--road-on-button-destructive-secondary);border-color:var(--road-button-destructive-outline)}/*!@:host(.btn-outline-destructive) ::slotted(road-icon)*/.sc-road-button-h.btn-outline-destructive .sc-road-button-s>road-icon{color:var(--road-on-button-destructive-secondary)}/*!@:host(.btn-outline-destructive:hover),\n:host(.btn-outline-destructive.focus-visible)*/.btn-outline-destructive.sc-road-button-h:hover,.btn-outline-destructive.focus-visible.sc-road-button-h{background:var(--road-button-destructive-secondary-variant)}/*!@:host([aria-disabled])*/[aria-disabled].sc-road-button-h{color:var(--road-on-surface-disabled);pointer-events:none;cursor:not-allowed;background-color:var(--road-surface-disabled);border-color:1px solid var(--road-surface-disabled)}/*!@:host([aria-disabled]) ::slotted(road-icon)*/.sc-road-button-h[aria-disabled] .sc-road-button-s>road-icon{color:var(--road-on-surface-disabled)}/*!@.button-native:disabled*/.button-native.sc-road-button:disabled{cursor:not-allowed}/*!@::slotted([slot=\"start\"])*/.sc-road-button-s>[slot=\"start\"]{margin-right:0.5rem}/*!@::slotted([slot=\"end\"])*/.sc-road-button-s>[slot=\"end\"]{margin-left:0.5rem}/*!@:host(.btn-xl)*/.btn-xl.sc-road-button-h{height:3.5rem}/*!@:host(.btn-xl) ::slotted(road-icon)*/.sc-road-button-h.btn-xl .sc-road-button-s>road-icon{width:2rem;height:2rem}/*!@:host(.btn-icon.btn-xl)*/.btn-icon.btn-xl.sc-road-button-h{width:56px}/*!@:host(.btn-lg)*/.btn-lg.sc-road-button-h{height:3rem}/*!@:host(.btn-lg) ::slotted(road-icon)*/.sc-road-button-h.btn-lg .sc-road-button-s>road-icon{width:2rem;height:2rem}/*!@:host(.btn-icon.btn-lg)*/.btn-icon.btn-lg.sc-road-button-h{width:48px}/*!@:host(.btn-md)*/.btn-md.sc-road-button-h{--font-size:var(--road-font-size-14);height:2.5rem}/*!@:host(.btn-md) ::slotted(road-icon)*/.sc-road-button-h.btn-md .sc-road-button-s>road-icon{width:1.5rem;height:1.5rem}/*!@:host(.btn-icon.btn-md)*/.btn-icon.btn-md.sc-road-button-h{width:40px}/*!@:host(.btn-sm)*/.btn-sm.sc-road-button-h{--font-size:var(--road-font-size-14);height:2rem}/*!@:host(.btn-sm) ::slotted(road-icon)*/.sc-road-button-h.btn-sm .sc-road-button-s>road-icon{width:1.25rem;height:1.25rem}/*!@:host(.btn-icon.btn-sm)*/.btn-icon.btn-sm.sc-road-button-h{width:32px}/*!@:host(.btn-block)*/.btn-block.sc-road-button-h{width:100%}/*!@:host(.btn-icon) .button-native*/.btn-icon.sc-road-button-h .button-native.sc-road-button{padding:0}/*!@::slotted(road-badge)*/.sc-road-button-s>road-badge{position:absolute;top:4px;left:calc(50% + 0.375rem);box-sizing:border-box;height:auto}";
6190
6190
 
6191
6191
  /**
6192
6192
  * @slot - Content of the button.
@@ -13749,7 +13749,7 @@ class Dialog {
13749
13749
  }; }
13750
13750
  }
13751
13751
 
13752
- const drawerCss = "/*!@:host*/.sc-road-drawer-h{--background:var(--road-surface);--color:var(--road-on-surface);--header-icon:var(--road-on-surface);--header-color:var(--road-on-surface);--header-background:var(--road-surface);--header-delimiter:0;--back-chevron-color:var(--road-icon);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:flex;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;opacity:0;transition:opacity 0.15s linear, visibility 0.15s}/*!@.drawer-overlay*/.drawer-overlay.sc-road-drawer{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none;cursor:pointer;background:var(--road-overlay)}/*!@.drawer-dialog*/.drawer-dialog.sc-road-drawer{position:relative;width:100%;pointer-events:none;transition:transform 0.3s ease-out;transform:translateX(-100%)}/*!@:host(.drawer-right)*/.drawer-right.sc-road-drawer-h{justify-content:flex-end}/*!@:host(.drawer-right) .drawer-dialog*/.drawer-right.sc-road-drawer-h .drawer-dialog.sc-road-drawer{transform:translateX(100%)}/*!@:host(.drawer-bottom)*/.drawer-bottom.sc-road-drawer-h{align-items:flex-end}/*!@:host(.drawer-bottom) .drawer-dialog*/.drawer-bottom.sc-road-drawer-h .drawer-dialog.sc-road-drawer{width:100%;max-height:var(--max-height);transform:translateY(100%)}/*!@:host(.drawer-bottom) .drawer-content*/.drawer-bottom.sc-road-drawer-h .drawer-content.sc-road-drawer{height:auto}/*!@.drawer-content*/.drawer-content.sc-road-drawer{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;box-shadow:var(--road-elevation-hight)}/*!@.drawer-header*/.drawer-header.sc-road-drawer{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;height:3.5rem;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}/*!@.drawer-header road-icon*/.drawer-header.sc-road-drawer road-icon.sc-road-drawer{flex-shrink:0;color:var(--header-icon)}/*!@.drawer-footer*/.drawer-footer.sc-road-drawer{padding:var(--road-spacing-05)}/*!@.drawer-header-inverse*/.drawer-header-inverse.sc-road-drawer{--header-icon:var(--road-on-primary);--header-color:var(--road-on-primary);--header-background:var(--road-primary-variant);margin-bottom:2.5rem}/*!@.drawer-action,\n.drawer-close*/.drawer-action.sc-road-drawer,.drawer-close.sc-road-drawer{display:flex;align-items:center;justify-content:center;height:3.5rem;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon*/.drawer-header.sc-road-drawer:not(.drawer-header-inverse) .drawer-action.sc-road-drawer road-icon.sc-road-drawer{color:var(--back-chevron-color)}/*!@.drawer-action ~ .drawer-title,\n.drawer-close ~ .drawer-title*/.drawer-action.sc-road-drawer~.drawer-title.sc-road-drawer,.drawer-close.sc-road-drawer~.drawer-title.sc-road-drawer{padding-left:0}/*!@.drawer-action-left,\n.drawer-close-left*/.drawer-action-left.sc-road-drawer,.drawer-close-left.sc-road-drawer{margin-right:auto}/*!@.drawer-title*/.drawer-title.sc-road-drawer{display:flex;flex-grow:1;align-items:center;justify-content:center;height:3.5rem;padding-left:3.5rem;margin:0;font-size:var(--road-body-medium)}/*!@.drawer-body*/.drawer-body.sc-road-drawer{overflow-y:auto}/*!@:host(.drawer-right) .drawer-body,\n:host(.drawer-left) .drawer-body*/.drawer-right.sc-road-drawer-h .drawer-body.sc-road-drawer,.drawer-left.sc-road-drawer-h .drawer-body.sc-road-drawer{height:calc(100vh - 3.5rem)}/*!@.drawer-inner*/.drawer-inner.sc-road-drawer{padding:0 1rem 2.5rem}@media (min-width: 768px){/*!@.drawer-inner*/.drawer-inner.sc-road-drawer{padding:0 2rem 2.5rem}}/*!@:host(.drawer-open)*/.drawer-open.sc-road-drawer-h{visibility:visible !important;opacity:1}/*!@:host(.drawer-open) .drawer-dialog*/.drawer-open.sc-road-drawer-h .drawer-dialog.sc-road-drawer{transform:none}";
13752
+ const drawerCss = "/*!@:host*/.sc-road-drawer-h{--background:var(--road-surface);--color:var(--road-on-surface);--header-icon:var(--road-on-surface);--header-color:var(--road-on-surface);--header-background:var(--road-surface);--header-delimiter:0;--back-chevron-color:var(--road-icon);--max-height:auto;--z-index:10;position:fixed;top:0;left:0;z-index:var(--z-index);display:flex;justify-content:flex-start;width:100%;height:100%;overflow:hidden;font-family:var(--road-font, sans-serif);line-height:1.5;color:var(--color);visibility:hidden !important;opacity:0;transition:opacity 0.15s linear, visibility 0.15s}/*!@.drawer-overlay*/.drawer-overlay.sc-road-drawer{position:absolute;top:0;right:0;bottom:0;left:0;display:block;touch-action:none;cursor:pointer;background:var(--road-overlay)}/*!@.drawer-dialog*/.drawer-dialog.sc-road-drawer{position:relative;width:100%;pointer-events:none;transition:transform 0.3s ease-out;transform:translateX(-100%)}/*!@:host(.drawer-right)*/.drawer-right.sc-road-drawer-h{justify-content:flex-end}/*!@:host(.drawer-right) .drawer-dialog*/.drawer-right.sc-road-drawer-h .drawer-dialog.sc-road-drawer{transform:translateX(100%)}/*!@:host(.drawer-bottom)*/.drawer-bottom.sc-road-drawer-h{align-items:flex-end}/*!@:host(.drawer-bottom) .drawer-dialog*/.drawer-bottom.sc-road-drawer-h .drawer-dialog.sc-road-drawer{width:100%;max-height:var(--max-height);transform:translateY(100%)}/*!@:host(.drawer-bottom) .drawer-content*/.drawer-bottom.sc-road-drawer-h .drawer-content.sc-road-drawer{height:auto}/*!@.drawer-content*/.drawer-content.sc-road-drawer{position:relative;display:flex;flex-direction:column;width:100%;height:100vh;pointer-events:auto;background-color:var(--background);background-clip:padding-box;box-shadow:var(--road-elevation-hight)}/*!@.drawer-header*/.drawer-header.sc-road-drawer{display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;height:3.5rem;color:var(--header-color);background:var(--header-background);border-color:var(--road-grey-300);border-style:solid;border-width:var(--header-delimiter)}/*!@.drawer-header road-icon*/.drawer-header.sc-road-drawer road-icon.sc-road-drawer{flex-shrink:0;color:var(--header-icon)}/*!@.drawer-footer*/.drawer-footer.sc-road-drawer{padding:var(--road-spacing-05)}/*!@.drawer-header-inverse*/.drawer-header-inverse.sc-road-drawer{--header-icon:var(--road-on-primary);--header-color:var(--road-on-primary);--header-background:var(--road-primary-variant);margin-bottom:2.5rem}/*!@.drawer-action,\n.drawer-close*/.drawer-action.sc-road-drawer,.drawer-close.sc-road-drawer{display:flex;align-items:center;justify-content:center;height:3.5rem;padding:0.5rem;font-family:inherit;font-size:0.875rem;color:inherit;cursor:pointer;background:transparent;border:0;appearance:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@.drawer-header:not(.drawer-header-inverse) .drawer-action road-icon*/.drawer-header.sc-road-drawer:not(.drawer-header-inverse) .drawer-action.sc-road-drawer road-icon.sc-road-drawer{color:var(--back-chevron-color)}/*!@.drawer-action ~ .drawer-title,\n.drawer-close ~ .drawer-title*/.drawer-action.sc-road-drawer~.drawer-title.sc-road-drawer,.drawer-close.sc-road-drawer~.drawer-title.sc-road-drawer{padding-left:0}/*!@.drawer-action-left,\n.drawer-close-left*/.drawer-action-left.sc-road-drawer,.drawer-close-left.sc-road-drawer{margin-right:auto}/*!@.drawer-title*/.drawer-title.sc-road-drawer{display:flex;flex-grow:1;align-items:center;justify-content:center;height:3.5rem;padding-left:3.5rem;margin:0;font-size:var(--road-body-medium)}/*!@.drawer-body*/.drawer-body.sc-road-drawer{overflow-y:auto}/*!@:host(.drawer-right) .drawer-body,\n:host(.drawer-left) .drawer-body*/.drawer-right.sc-road-drawer-h .drawer-body.sc-road-drawer,.drawer-left.sc-road-drawer-h .drawer-body.sc-road-drawer{height:calc(100vh - 3.5rem)}/*!@.drawer-inner*/.drawer-inner.sc-road-drawer{padding:0 1rem 2.5rem}@media (min-width: 768px){/*!@.drawer-inner*/.drawer-inner.sc-road-drawer{padding:0 2rem 2.5rem}/*!@.drawer-body*/.drawer-body.sc-road-drawer{padding:0 var(--road-spacing-08) var(--road-spacing-05)}/*!@.drawer-footer*/.drawer-footer.sc-road-drawer{padding:var(--road-spacing-05) var(--road-spacing-08)}}/*!@:host(.drawer-open)*/.drawer-open.sc-road-drawer-h{visibility:visible !important;opacity:1}/*!@:host(.drawer-open) .drawer-dialog*/.drawer-open.sc-road-drawer-h .drawer-dialog.sc-road-drawer{transform:none}";
13753
13753
 
13754
13754
  /**
13755
13755
  * @slot - Content of the drawer.
@@ -31764,6 +31764,17 @@ class Input {
31764
31764
  this.helper = undefined;
31765
31765
  this.debounce = 0;
31766
31766
  }
31767
+ handleKeyDown(event) {
31768
+ // Vérifier que le type est "number" avant d'appliquer les restrictions
31769
+ if (this.type === 'number') {
31770
+ // Liste des caractères interdits
31771
+ const forbiddenKeys = ['e', '-', '.', ',', '¨', '^', '`', '+'];
31772
+ // Empêcher la saisie si la touche est interdite
31773
+ if (forbiddenKeys.includes(event.key)) {
31774
+ event.preventDefault();
31775
+ }
31776
+ }
31777
+ }
31767
31778
  createDebouncedRoadChange() {
31768
31779
  return lodash.debounce((value) => {
31769
31780
  this.roadChange.emit({ value: value == null ? value : value.toString() });
@@ -31803,10 +31814,10 @@ class Input {
31803
31814
  render() {
31804
31815
  const value = this.getValue();
31805
31816
  const labelId = this.inputId + '-label';
31806
- const hasValueClass = this.value !== '' ? 'has-value' : '';
31817
+ const hasValueClass = this.value !== '' && this.value !== null ? 'has-value' : '';
31807
31818
  const lessLabelClass = this.label !== '' ? '' : 'less-label';
31808
31819
  const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';
31809
- return (hAsync(Host, { "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}`, value: value }, hAsync("input", { 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, onKeyUp: (event) => this.enforceMinMax(event.target), "data-cy": 'road-input' }), hAsync("label", { class: "form-label", id: labelId, htmlFor: this.inputId }, this.label), this.error && this.error !== '' && hAsync("p", { class: "invalid-feedback" }, hAsync("road-icon", { slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), this.error), this.helper && this.helper !== '' && hAsync("p", { class: "helper" }, this.helper), this.type && this.type == 'password' && hAsync("slot", { name: "checklistPassword" })));
31820
+ return (hAsync(Host, { "aria-disabled": this.disabled ? 'true' : null, class: this.sizes && `input-${this.sizes}`, value: value }, hAsync("input", { 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, onKeyUp: (event) => this.enforceMinMax(event.target), "data-cy": 'road-input' }), hAsync("label", { class: "form-label", id: labelId, htmlFor: this.inputId }, this.label), this.error && this.error !== '' && hAsync("p", { class: "invalid-feedback" }, hAsync("road-icon", { slot: "start", name: "alert-error-solid", "aria-hidden": "true", size: "sm" }), this.error), this.helper && this.helper !== '' && hAsync("p", { class: "helper" }, this.helper), this.type && this.type == 'password' && hAsync("slot", { name: "checklistPassword" })));
31810
31821
  }
31811
31822
  static get watchers() { return {
31812
31823
  "debounce": ["debounceChanged"],
@@ -31852,7 +31863,7 @@ class Input {
31852
31863
  }
31853
31864
  let inputIds = 0;
31854
31865
 
31855
- const inputGroupCss = "/*!@:host*/.sc-road-input-group-h{display:block}/*!@.input-group*/.input-group.sc-road-input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%;font-family:var(--road-font, sans-serif)}/*!@::slotted(road-input),\n::slotted(input),\n::slotted(textarea),\n::slotted(road-select)*/.sc-road-input-group-s>road-input,.sc-road-input-group-s>input,.sc-road-input-group-s>textarea,.sc-road-input-group-s>road-select{position:relative;flex:1 1 auto;width:1%;margin-bottom:0}/*!@::slotted([slot=\"prepend\"])*/.sc-road-input-group-s>[slot=\"prepend\"]{margin-right:-3px;border-color:var(--road-input-outline);border-right-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}/*!@::slotted([slot=\"append\"])*/.sc-road-input-group-s>[slot=\"append\"]{margin-left:-0.25rem;border-color:var(--road-input-outline);border-left-width:0}@media (hover: hover){/*!@.input-group:not(.is-disabled):hover ::slotted([slot=\"prepend\"])*/.input-group:not(.is-disabled):hover .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-input-outline-variant);border-right-color:transparent}/*!@.input-group:not(.is-disabled):hover ::slotted([slot=\"append\"])*/.input-group:not(.is-disabled):hover .sc-road-input-group-s>[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\"])*/.sc-road-input-group-h.phone-number-group .input-group:not(.is-disabled):hover .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-input-outline-variant)}}/*!@.input-group:focus-within ::slotted([slot=\"prepend\"])*/.input-group:focus-within .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-input-outline-variant);border-right-color:transparent}/*!@:host(.phone-number-group) .input-group:focus-within ::slotted([slot=\"prepend\"])*/.sc-road-input-group-h.phone-number-group .input-group:focus-within .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-input-outline-variant);border-right-color:transparent}/*!@.input-group:focus-within ::slotted([slot=\"append\"])*/.input-group:focus-within .sc-road-input-group-s>[slot=\"append\"]{border-color:var(--road-input-outline-variant);border-left-color:transparent}/*!@.input-group-prepend,\n.input-group-append*/.input-group-prepend.sc-road-input-group,.input-group-append.sc-road-input-group{display:flex;height:3rem}/*!@::slotted(road-button)*/.sc-road-input-group-s>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)}/*!@.input-group-prepend*/.input-group-prepend.sc-road-input-group{z-index:1;order:-1}/*!@.input-group-prepend ~ .form-label*/.input-group-prepend.sc-road-input-group~.form-label.sc-road-input-group{left:calc(3rem + 1px)}/*!@.input-group-append*/.input-group-append.sc-road-input-group{position:relative;z-index:1;border-radius:0 0.25rem 0.25rem 0}/*!@::slotted(label)*/.sc-road-input-group-s>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)),\n::slotted(road-select:not(:first-child))*/.sc-road-input-group-s>road-input:not(:first-child),.sc-road-input-group-s>road-select:not(:first-child){border-radius:0}/*!@.input-group-append ::slotted([slot=\"append\"])*/.input-group-append .sc-road-input-group-s>[slot=\"append\"]{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}/*!@.input-group-prepend ::slotted([slot=\"prepend\"])*/.input-group-prepend .sc-road-input-group-s>[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\"])*/.sc-road-input-group-h.phone-number-group .input-group-prepend .sc-road-input-group-s>[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)*/.input-group-prepend .sc-road-input-group-s>label{margin-right:calc(-1rem + 1px)}/*!@.input-group-append ::slotted(road-button)*/.input-group-append .sc-road-input-group-s>road-button{background-color:var(--road-surface)}/*!@.size-xl .input-group-prepend,\n.size-xl .input-group-append*/.size-xl.sc-road-input-group .input-group-prepend.sc-road-input-group,.size-xl.sc-road-input-group .input-group-append.sc-road-input-group{height:3.5rem}/*!@.size-xl ::slotted(road-button)*/.size-xl .sc-road-input-group-s>road-button{height:3.5rem}/*!@.input-group.is-invalid ::slotted([slot=\"append\"]),\n.input-group.is-invalid ::slotted([slot=\"prepend\"])*/.input-group.is-invalid .sc-road-input-group-s>[slot=\"append\"],.input-group.is-invalid.sc-road-input-group-s>[slot=\"prepend\"],.input-group.is-invalid .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-danger-outline)}/*!@:host(.phone-number-group) .input-group.is-invalid ::slotted([slot=\"prepend\"])*/.sc-road-input-group-h.phone-number-group .input-group.is-invalid.sc-road-input-group-s>[slot=\"prepend\"],.input-group.is-invalid .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-danger-outline)}/*!@.input-group.is-disabled ::slotted([slot=\"append\"]),\n.input-group.is-disabled ::slotted([slot=\"prepend\"])*/.input-group.is-disabled .sc-road-input-group-s>[slot=\"append\"],.input-group.is-disabled.sc-road-input-group-s>[slot=\"prepend\"],.input-group.is-disabled .sc-road-input-group-s>[slot=\"prepend\"]{cursor:not-allowed;background:#e4e5e9}/*!@.is-disabled ::slotted(road-button)*/.is-disabled .sc-road-input-group-s>road-button{opacity:1}";
31866
+ const inputGroupCss = "/*!@:host*/.sc-road-input-group-h{display:block}/*!@.input-group*/.input-group.sc-road-input-group{position:relative;display:flex;flex-wrap:wrap;align-items:stretch;width:100%;font-family:var(--road-font, sans-serif)}/*!@::slotted(road-input),\n::slotted(input),\n::slotted(textarea),\n::slotted(road-select)*/.sc-road-input-group-s>road-input,.sc-road-input-group-s>input,.sc-road-input-group-s>textarea,.sc-road-input-group-s>road-select{position:relative;flex:1 1 auto;width:1%;margin-bottom:0}/*!@::slotted([slot=\"prepend\"])*/.sc-road-input-group-s>[slot=\"prepend\"]{margin-right:-3px;border-color:var(--road-input-outline);border-right-color:transparent;border-top-right-radius:0;border-bottom-right-radius:0}/*!@::slotted([slot=\"append\"])*/.sc-road-input-group-s>[slot=\"append\"]{margin-left:-0.25rem;border-color:var(--road-input-outline);border-left-width:0}@media (hover: hover){/*!@.input-group:not(.is-disabled):hover ::slotted([slot=\"prepend\"])*/.input-group:not(.is-disabled):hover .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-input-outline-variant);border-right-color:transparent}/*!@.input-group:not(.is-disabled):hover ::slotted([slot=\"append\"])*/.input-group:not(.is-disabled):hover .sc-road-input-group-s>[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\"])*/.sc-road-input-group-h.phone-number-group .input-group:not(.is-disabled):hover .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-input-outline-variant)}}/*!@.input-group:focus-within ::slotted([slot=\"prepend\"]),\n:host(.phone-number-group) .input-group:focus-within ::slotted([slot=\"prepend\"])*/.input-group:focus-within .sc-road-input-group-s>[slot=\"prepend\"],.sc-road-input-group-h.phone-number-group .input-group:focus-within.sc-road-input-group-s>[slot=\"prepend\"],.sc-road-input-group-h.phone-number-group .input-group:focus-within .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-grey-0);border-width:2px;border-right-color:transparent;outline:none}/*!@.input-group:focus-within ::slotted([slot=\"append\"])*/.input-group:focus-within .sc-road-input-group-s>[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*/.input-group:focus-within .sc-road-input-group-s>road-input:focus-visible{border-color:var(--road-grey-0);border-width:2px;outline:none}/*!@.input-group-prepend,\n.input-group-append*/.input-group-prepend.sc-road-input-group,.input-group-append.sc-road-input-group{display:flex;height:3rem}/*!@::slotted(road-button)*/.sc-road-input-group-s>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*/.sc-road-input-group-s>road-button:hover{background-color:var(--road-button-ghost-variant)}/*!@.input-group-prepend*/.input-group-prepend.sc-road-input-group{z-index:1;order:-1}/*!@.input-group-prepend ~ .form-label*/.input-group-prepend.sc-road-input-group~.form-label.sc-road-input-group{left:calc(3rem + 1px)}/*!@.input-group-append*/.input-group-append.sc-road-input-group{position:relative;z-index:1;border-radius:0 0.25rem 0.25rem 0}/*!@::slotted(label)*/.sc-road-input-group-s>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-label)*/.sc-road-input-group-s>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)),\n::slotted(road-select:not(:first-child))*/.sc-road-input-group-s>road-input:not(:first-child),.sc-road-input-group-s>road-select:not(:first-child){border-radius:0}/*!@.input-group-append ::slotted([slot=\"append\"])*/.input-group-append .sc-road-input-group-s>[slot=\"append\"]{border-left:0;border-top-left-radius:0;border-bottom-left-radius:0}/*!@.input-group-prepend ::slotted([slot=\"prepend\"])*/.input-group-prepend .sc-road-input-group-s>[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\"])*/.sc-road-input-group-h.phone-number-group .input-group-prepend .sc-road-input-group-s>[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)*/.input-group-prepend .sc-road-input-group-s>label{margin-right:calc(-1rem + 1px)}/*!@.input-group-append ::slotted(road-button)*/.input-group-append .sc-road-input-group-s>road-button{background-color:var(--road-surface)}/*!@.input-group-append:hover ::slotted(road-button)*/.input-group-append:hover .sc-road-input-group-s>road-button{background-color:var(--road-button-ghost-variant)}/*!@.size-xl .input-group-prepend,\n.size-xl .input-group-append*/.size-xl.sc-road-input-group .input-group-prepend.sc-road-input-group,.size-xl.sc-road-input-group .input-group-append.sc-road-input-group{height:3.5rem}/*!@.size-xl ::slotted(road-button)*/.size-xl .sc-road-input-group-s>road-button{height:3.5rem}/*!@.input-group.is-invalid ::slotted([slot=\"append\"]),\n.input-group.is-invalid ::slotted([slot=\"prepend\"])*/.input-group.is-invalid .sc-road-input-group-s>[slot=\"append\"],.input-group.is-invalid.sc-road-input-group-s>[slot=\"prepend\"],.input-group.is-invalid .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-danger-outline)}/*!@:host(.phone-number-group) .input-group.is-invalid ::slotted([slot=\"prepend\"])*/.sc-road-input-group-h.phone-number-group .input-group.is-invalid.sc-road-input-group-s>[slot=\"prepend\"],.input-group.is-invalid .sc-road-input-group-s>[slot=\"prepend\"]{border-color:var(--road-danger-outline)}/*!@:host([disabled])*/[disabled].sc-road-input-group-h{cursor:not-allowed}/*!@:host([disabled]) .input-group*/[disabled].sc-road-input-group-h .input-group.sc-road-input-group{pointer-events:none}/*!@:host([disabled]) ::slotted([slot=\"append\"]),\n:host([disabled]) ::slotted([slot=\"prepend\"])*/.sc-road-input-group-h[disabled] .sc-road-input-group-s>[slot=\"append\"],.sc-road-input-group-h[disabled].sc-road-input-group-s>[slot=\"prepend\"],.sc-road-input-group-h[disabled] .sc-road-input-group-s>[slot=\"prepend\"]{color:var(--road-on-surface-disabled);cursor:not-allowed;background:#e4e5e9}/*!@:host([disabled]) ::slotted([slot=\"append\"] road-icon),\n:host([disabled]) ::slotted([slot=\"prepend\"] road-icon)*/.sc-road-input-group-h[disabled] .sc-road-input-group-s>[slot=\"append\"] road-icon,.sc-road-input-group-h[disabled].sc-road-input-group-s>[slot=\"prepend\"],.sc-road-input-group-h[disabled].sc-road-input-group-s>[slot=\"prepend\"] road-icon,.sc-road-input-group-h[disabled] .sc-road-input-group-s>[slot=\"prepend\"] road-icon{color:var(--road-on-surface-disabled)}/*!@:host([disabled]) road-icon*/[disabled].sc-road-input-group-h road-icon.sc-road-input-group{color:var(--road-on-surface-disabled)}";
31856
31867
 
31857
31868
  /**
31858
31869
  * @slot prepend - Add icon or button before the field.
@@ -31862,25 +31873,47 @@ const inputGroupCss = "/*!@:host*/.sc-road-input-group-h{display:block}/*!@.inpu
31862
31873
  class InputGroup {
31863
31874
  constructor(hostRef) {
31864
31875
  registerInstance(this, hostRef);
31876
+ this.disabled = false;
31865
31877
  }
31866
- componentDidLoad() {
31867
- var _a;
31868
- if (this.el.querySelector("road-input[disabled]")) {
31869
- (_a = this.el.querySelector("road-button")) === null || _a === void 0 ? void 0 : _a.setAttribute('disabled', "");
31870
- }
31878
+ /** Watches for changes in the `disabled` prop and updates child elements. */
31879
+ handleDisabledChange(newValue) {
31880
+ this.updateDisabledState(newValue);
31881
+ }
31882
+ /** Applies or removes the `disabled` attribute to/from children. */
31883
+ updateDisabledState(isDisabled) {
31884
+ const children = this.el.querySelectorAll('road-input, road-button, road-select');
31885
+ children.forEach(child => {
31886
+ if (isDisabled) {
31887
+ child.setAttribute('disabled', '');
31888
+ }
31889
+ else {
31890
+ child.removeAttribute('disabled');
31891
+ }
31892
+ });
31893
+ }
31894
+ componentWillLoad() {
31895
+ // Ensure the initial state of `disabled` is applied before render.
31896
+ this.updateDisabledState(this.disabled);
31871
31897
  }
31872
31898
  render() {
31873
- const errorClass = this.el.querySelector("road-input[error]") ? 'is-invalid' : '';
31874
- const disabledClass = this.el.querySelector("road-input[disabled]") ? 'is-disabled' : '';
31875
- const sizeClass = this.el.querySelector("road-input[sizes]") ? `size-${this.el.querySelector("road-input").sizes}` : '';
31899
+ const errorClass = this.el.querySelector('road-input[error]') ? 'is-invalid' : '';
31900
+ const sizeClass = this.el.querySelector('road-input[sizes]')
31901
+ ? `size-${this.el.querySelector('road-input').sizes}`
31902
+ : '';
31903
+ const disabledClass = this.disabled ? 'is-disabled' : '';
31876
31904
  return (hAsync("div", { class: `input-group ${errorClass} ${disabledClass} ${sizeClass}` }, hAsync("div", { class: "input-group-prepend" }, hAsync("slot", { name: "prepend" })), hAsync("slot", null), hAsync("div", { class: "input-group-append" }, hAsync("slot", { name: "append" }))));
31877
31905
  }
31878
31906
  get el() { return getElement(this); }
31907
+ static get watchers() { return {
31908
+ "disabled": ["handleDisabledChange"]
31909
+ }; }
31879
31910
  static get style() { return inputGroupCss; }
31880
31911
  static get cmpMeta() { return {
31881
31912
  "$flags$": 9,
31882
31913
  "$tagName$": "road-input-group",
31883
- "$members$": undefined,
31914
+ "$members$": {
31915
+ "disabled": [4]
31916
+ },
31884
31917
  "$listeners$": undefined,
31885
31918
  "$lazyBundleId$": "-",
31886
31919
  "$attrsToReflect$": []
@@ -34328,7 +34361,7 @@ class RoadPhoneNumberInput {
34328
34361
  const valueId = selectId + '-value';
34329
34362
  const isInvalidClass = this.errorMessage.length ? 'is-invalid' : '';
34330
34363
  const isErrorClass = this.errorMessage.length ? 'is-error' : '';
34331
- return (hAsync(Host, null, hAsync("road-input-group", null, hAsync("div", { class: `road-phone-input-select ${isErrorClass}`, slot: "prepend" }, hAsync("select", { id: 'phone-number-input', class: `form-select-area has-value ${isInvalidClass}`, "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled, onChange: (event) => this.handleSelect(event), "aria-label": this.codeLabel, tabIndex: this.disabled ? -1 : 0 }, this.countryOptions && this.countryOptions.map(option => (hAsync("option", { value: option.value, disabled: option.disabled, selected: option.selected }, option.label)))), hAsync("label", { class: "form-select-area-label", id: labelId, htmlFor: selectId }, this.codeLabel), hAsync("label", { class: "form-select-area-value", id: valueId, htmlFor: selectId }, "+", this.selectedCountryCode)), hAsync("road-input", { id: "phone-number", sizes: "xl", label: this.phoneLabel, value: this.phoneValue, onRoadChange: (event) => this.handleInput(event), required: this.required, error: this.errorMessage, onKeyDown: (event) => this.handleKeyDown(event), tabIndex: 0 }))));
34364
+ return (hAsync(Host, null, hAsync("road-input-group", null, hAsync("div", { class: `road-phone-input-select ${isErrorClass}`, slot: "prepend" }, hAsync("select", { id: 'phone-number-input', class: `form-select-area has-value ${isInvalidClass}`, "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled, onChange: (event) => this.handleSelect(event), "aria-label": this.codeLabel, tabIndex: this.disabled ? -1 : 0 }, this.countryOptions && this.countryOptions.map(option => (hAsync("option", { value: option.value, disabled: option.disabled, selected: option.selected }, option.label)))), hAsync("label", { class: "form-select-area-label", id: labelId, htmlFor: selectId }, this.codeLabel), hAsync("label", { class: "form-select-area-value", id: valueId, htmlFor: selectId }, "+", this.selectedCountryCode)), hAsync("road-input", { type: "tel", id: "phone-number", sizes: "xl", label: this.phoneLabel, value: this.phoneValue, onRoadChange: (event) => this.handleInput(event), required: this.required, error: this.errorMessage, onKeyDown: (event) => this.handleKeyDown(event), tabIndex: 0 }))));
34332
34365
  }
34333
34366
  get el() { return getElement(this); }
34334
34367
  static get watchers() { return {
@@ -36747,7 +36780,7 @@ class TabBar {
36747
36780
  }; }
36748
36781
  }
36749
36782
 
36750
- const tabButtonCss = "/*!@:host*/.sc-road-tab-button-h{box-sizing:border-box;font-weight:700;color:var(--tab-color);outline:0;transition:background 0.15s ease-in-out}/*!@:host(.tab-secondary)*/.tab-secondary.sc-road-tab-button-h{--tab-underline-selected:var(--road-secondary-600)}/*!@:host(.tab-selected)*/.tab-selected.sc-road-tab-button-h{color:var(--tab-color-selected)}/*!@:host(.tab-selected) ::slotted(road-icon)*/.sc-road-tab-button-h.tab-selected .sc-road-tab-button-s>road-icon{color:var(--tab-color-selected)}/*!@:host(.tab-selected) .button-native::after*/.tab-selected.sc-road-tab-button-h .button-native.sc-road-tab-button::after{background:var(--tab-underline-selected);opacity:1;transform:none}/*!@:host(:hover)*/.sc-road-tab-button-h:hover{background:var(--tab-background-hover)}/*!@:host(.focus-visible)*/.focus-visible.sc-road-tab-button-h{background:var(--tab-background-focused);outline:auto}/*!@.button-native*/.button-native.sc-road-tab-button{position:relative;box-sizing:border-box;display:flex;flex-direction:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%;min-height:3.5rem;padding:0.75rem var(--padding-end, 1.5rem) 0.75rem var(--padding-start, 1.5rem);margin:0;overflow:hidden;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:inherit;text-decoration:none;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;cursor:pointer;background:transparent;-webkit-user-drag:none;border-color:initial;border-style:initial;border-width:0;border-radius:inherit;border-image:initial;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@.button-native::after*/.button-native.sc-road-tab-button::after{position:absolute;bottom:0;left:0;display:block;width:100%;height:2px;content:\"\";opacity:0;transition:transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);transform:scaleX(0);transform-origin:center}/*!@.button-inner*/.button-inner.sc-road-tab-button{position:relative;z-index:1;display:flex;flex-flow:inherit;align-items:center;justify-content:center;width:100%;height:100%}/*!@:host ::slotted(road-icon)*/.sc-road-tab-button-h .sc-road-tab-button-s>road-icon{color:var(--tab-color)}/*!@:host(.tab-layout-icon-start) ::slotted(road-icon)*/.sc-road-tab-button-h.tab-layout-icon-start .sc-road-tab-button-s>road-icon{margin-right:0.5rem}/*!@:host(.tab-layout-icon-top) .button-inner*/.tab-layout-icon-top.sc-road-tab-button-h .button-inner.sc-road-tab-button{flex-direction:column}/*!@:host ::slotted(road-label)*/.sc-road-tab-button-h .sc-road-tab-button-s>road-label{display:-webkit-box;max-width:12.5rem;overflow:hidden;font-size:1rem;color:var(--road-on-surface);-webkit-line-clamp:1;-webkit-box-orient:vertical;text-align:center;text-overflow:ellipsis;white-space:inherit}/*!@:host(.tab-layout-icon-top) ::slotted(road-label)*/.sc-road-tab-button-h.tab-layout-icon-top .sc-road-tab-button-s>road-label{margin-top:0.25rem;font-size:1rem}";
36783
+ const tabButtonCss = "/*!@:host*/.sc-road-tab-button-h{box-sizing:border-box;font-weight:700;color:var(--tab-color);outline:0;transition:background 0.15s ease-in-out}/*!@:host(.tab-secondary)*/.tab-secondary.sc-road-tab-button-h{--tab-underline-selected:var(--road-secondary-600)}/*!@:host(.tab-selected)*/.tab-selected.sc-road-tab-button-h{color:var(--tab-color-selected)}/*!@:host(.tab-selected) ::slotted(road-icon)*/.sc-road-tab-button-h.tab-selected .sc-road-tab-button-s>road-icon{color:var(--tab-color-selected)}/*!@:host(.tab-selected) .button-native::after*/.tab-selected.sc-road-tab-button-h .button-native.sc-road-tab-button::after{background:var(--tab-underline-selected);opacity:1;transform:none}/*!@:host(:hover)*/.sc-road-tab-button-h:hover{background:var(--tab-background-hover)}/*!@:host(.focus-visible)*/.focus-visible.sc-road-tab-button-h{background:var(--tab-background-focused);outline:auto}/*!@:host(.tab-disabled)*/.tab-disabled.sc-road-tab-button-h{background:var(--road-surface-disabled)}/*!@:host(.tab-disabled) .button-native*/.tab-disabled.sc-road-tab-button-h .button-native.sc-road-tab-button{cursor:not-allowed}/*!@:host(.tab-disabled) ::slotted(road-label)*/.sc-road-tab-button-h.tab-disabled .sc-road-tab-button-s>road-label{color:var(--road-on-surface-disabled)}/*!@.button-native*/.button-native.sc-road-tab-button{position:relative;box-sizing:border-box;display:flex;flex-direction:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%;min-height:3.5rem;padding:0.75rem var(--padding-end, 1.5rem) 0.75rem var(--padding-start, 1.5rem);margin:0;overflow:hidden;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:inherit;text-decoration:none;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;cursor:pointer;background:transparent;-webkit-user-drag:none;border-color:initial;border-style:initial;border-width:0;border-radius:inherit;border-image:initial;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@.button-native::after*/.button-native.sc-road-tab-button::after{position:absolute;bottom:0;left:0;display:block;width:100%;height:2px;content:\"\";background-color:var(--road-input-outline);opacity:1;transition:transform 0.25s cubic-bezier(0.4, 0, 0.2, 1);transform:none;transform-origin:center}/*!@.button-inner*/.button-inner.sc-road-tab-button{position:relative;z-index:1;display:flex;flex-flow:inherit;align-items:center;justify-content:center;width:100%;height:100%}/*!@:host ::slotted(road-icon)*/.sc-road-tab-button-h .sc-road-tab-button-s>road-icon{color:var(--tab-color)}/*!@:host(.tab-layout-icon-start) ::slotted(road-icon)*/.sc-road-tab-button-h.tab-layout-icon-start .sc-road-tab-button-s>road-icon{margin-right:0.5rem}/*!@:host(.tab-layout-icon-top) .button-inner*/.tab-layout-icon-top.sc-road-tab-button-h .button-inner.sc-road-tab-button{flex-direction:column}/*!@:host ::slotted(road-label)*/.sc-road-tab-button-h .sc-road-tab-button-s>road-label{display:-webkit-box;max-width:12.5rem;overflow:hidden;font-size:1rem;color:var(--road-on-surface);-webkit-line-clamp:1;-webkit-box-orient:vertical;text-align:center;text-overflow:ellipsis;white-space:inherit}/*!@:host(.tab-layout-icon-top) ::slotted(road-label)*/.sc-road-tab-button-h.tab-layout-icon-top .sc-road-tab-button-s>road-label{margin-top:0.25rem;font-size:1rem}";
36751
36784
 
36752
36785
  /**
36753
36786
  * @slot - Content of the tab-button, it should be road-icon and road-label elements.
@@ -36772,6 +36805,7 @@ class TabButton {
36772
36805
  this.rel = undefined;
36773
36806
  this.layout = 'icon-start';
36774
36807
  this.selected = false;
36808
+ this.disabled = false;
36775
36809
  this.tab = undefined;
36776
36810
  this.target = undefined;
36777
36811
  }
@@ -36811,20 +36845,21 @@ class TabButton {
36811
36845
  return 0;
36812
36846
  }
36813
36847
  render() {
36814
- const { hasIcon, hasLabel, tabIndex, href, rel, target, layout, selected, tab } = this;
36848
+ const { hasIcon, hasLabel, tabIndex, href, rel, target, layout, selected, tab, disabled } = this;
36815
36849
  const attrs = {
36816
36850
  download: this.download,
36817
- href,
36851
+ href: !disabled ? href : undefined,
36818
36852
  rel,
36819
36853
  target,
36820
36854
  };
36821
- return (hAsync(Host, { onClick: this.onClick, onKeyup: this.onKeyUp, role: "tab", tabindex: tabIndex, "aria-selected": selected ? 'true' : 'false', id: tab !== undefined ? `tab-button-${tab}` : null, class: {
36855
+ return (hAsync(Host, { 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: {
36822
36856
  'tab-selected': selected,
36823
36857
  'tab-has-label': hasLabel,
36824
36858
  'tab-has-icon': hasIcon,
36825
36859
  'tab-has-label-only': hasLabel && !hasIcon,
36826
36860
  'tab-has-icon-only': hasIcon && !hasLabel,
36827
36861
  [`tab-layout-${layout}`]: true,
36862
+ 'tab-disabled': disabled, // Classe CSS pour les styles désactivés
36828
36863
  } }, hAsync("a", Object.assign({}, attrs, { tabIndex: -1, class: "button-native", part: "native" }), hAsync("span", { class: "button-inner" }, hAsync("slot", null)))));
36829
36864
  }
36830
36865
  get el() { return getElement(this); }
@@ -36838,6 +36873,7 @@ class TabButton {
36838
36873
  "rel": [1],
36839
36874
  "layout": [1],
36840
36875
  "selected": [1028],
36876
+ "disabled": [1028],
36841
36877
  "tab": [1],
36842
36878
  "target": [1]
36843
36879
  },
@@ -37563,7 +37599,7 @@ class Tooltip {
37563
37599
  }
37564
37600
  let tooltipIds = 0;
37565
37601
 
37566
- const toggleCss = ".sc-road-toggle-h{--toggle-lever-width:4.5rem;position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);font-size:var(--road-label-medium);color:var(--road-on-surface)}.form-toggle-input.sc-road-toggle{position:absolute;z-index:-1;opacity:0}.form-toggle-label.sc-road-toggle{display:inline-flex;align-items:center;cursor:pointer;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.form-toggle-lever.sc-road-toggle{position:relative;box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;width:var(--toggle-lever-width);height:2rem;padding:0.5rem 0.625rem;margin-right:0.75rem;font-size:0.625rem;font-weight:700;line-height:1.6;content:\"\";background:var(--road-on-surface-extra-weak);border:0.125rem solid transparent;border-radius:1.125rem;transition:background 0.2s ease-in-out}.form-toggle-lever.sc-road-toggle::before{font-size:0.625rem;font-weight:700;color:var(--road-surface);text-transform:uppercase;content:attr(data-off)}.form-toggle-lever.sc-road-toggle::after{position:absolute;top:0.0625rem;left:0.0625rem;display:block;width:1.625rem;height:1.625rem;content:\"\";background:var(--road-on-success-surface-inverse);border-radius:50%;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{justify-content:flex-start;background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface);content:attr(data-on)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::after{transform:translateX(calc(var(--toggle-lever-width) - 2rem))}.form-toggle-input.focus-visible.sc-road-toggle~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{box-shadow:0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-primary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-secondary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-right.sc-road-toggle{margin-right:0;margin-left:0.75rem}.form-toggle-spaced.sc-road-toggle{display:flex;justify-content:space-between}";
37602
+ const toggleCss = ".sc-road-toggle-h{--toggle-lever-width:4.5rem;position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);font-size:var(--road-label-medium);color:var(--road-on-surface)}.form-toggle-input.sc-road-toggle{position:absolute;z-index:-1;opacity:0}.form-toggle-label.sc-road-toggle{display:inline-flex;align-items:center;cursor:pointer;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}.form-toggle-label.disabled.sc-road-toggle{cursor:not-allowed}.form-toggle-lever.sc-road-toggle{position:relative;box-sizing:border-box;display:flex;flex-shrink:0;align-items:center;justify-content:flex-end;width:var(--toggle-lever-width);height:2rem;padding:0.5rem 0.625rem;margin-right:0.75rem;font-size:0.625rem;font-weight:700;line-height:1.6;content:\"\";background:var(--road-on-surface-extra-weak);border:0.125rem solid transparent;border-radius:1.125rem;transition:background 0.2s ease-in-out}.form-toggle-lever.sc-road-toggle::before{font-size:0.625rem;font-weight:700;color:var(--road-surface);text-transform:uppercase;content:attr(data-off)}.form-toggle-lever.sc-road-toggle::after{position:absolute;top:0.0625rem;left:0.0625rem;display:block;width:1.625rem;height:1.625rem;content:\"\";background:var(--road-on-success-surface-inverse);border-radius:50%;box-shadow:var(--road-elevation-low);transition:transform 0.2s ease-in-out}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{justify-content:flex-start;background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface);content:attr(data-on)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle::after{transform:translateX(calc(var(--toggle-lever-width) - 2rem))}.form-toggle-input.focus-visible.sc-road-toggle~.form-toggle-label.sc-road-toggle .form-toggle-lever.sc-road-toggle{box-shadow:0 0 0 0.125rem var(--road-grey-100-new), 0 0 0 0.1875rem var(--road-primary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-secondary)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-secondary.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle{background:var(--road-success-surface-inverse)}.form-toggle-input.sc-road-toggle:checked~.form-toggle-success.sc-road-toggle .form-toggle-lever.sc-road-toggle::before{color:var(--road-surface)}.form-toggle-right.sc-road-toggle{margin-right:0;margin-left:0.75rem}.form-toggle-spaced.sc-road-toggle{display:flex;justify-content:space-between}";
37567
37603
 
37568
37604
  class toggle {
37569
37605
  constructor(hostRef) {
@@ -37611,7 +37647,8 @@ class toggle {
37611
37647
  const textLabel = hAsync("label", { class: "form-toggle-label", id: labelId, htmlFor: this.toggleId }, this.label);
37612
37648
  const isSpacedClass = this.isSpaced && 'form-toggle-spaced';
37613
37649
  const righttoggleClass = this.hasLeftLabel ? 'form-toggle-right' : '';
37614
- return (hAsync(Host, null, hAsync("input", { 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 }), hAsync("label", { class: `form-toggle-label ${isSpacedClass}`, htmlFor: this.toggleId }, this.hasLeftLabel && textLabel, hAsync("div", { class: `form-toggle-lever ${righttoggleClass}`, "data-off": this.off, "data-on": this.on }), this.hasLeftLabel ? '' : textLabel)));
37650
+ const disabledClass = this.disabled ? 'disabled' : '';
37651
+ return (hAsync(Host, null, hAsync("input", { 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 }), hAsync("label", { class: `form-toggle-label ${isSpacedClass} ${disabledClass}`, htmlFor: this.toggleId }, this.hasLeftLabel && textLabel, hAsync("div", { class: `form-toggle-lever ${righttoggleClass}`, "data-off": this.off, "data-on": this.on }), this.hasLeftLabel ? '' : textLabel)));
37615
37652
  }
37616
37653
  static get watchers() { return {
37617
37654
  "checked": ["checkedChanged"]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@roadtrip/components",
3
- "version": "3.27.0",
3
+ "version": "3.29.0",
4
4
  "description": "Web Component library for Roadtrip Design System",
5
5
  "license": "Apache-2.0",
6
6
  "homepage": "https://gitlab.com/mobivia-design/roadtrip/components",