@roadtrip/components 3.30.0 → 3.31.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 (68) hide show
  1. package/dist/cjs/index-12592729.js +16 -0
  2. package/dist/cjs/loader.cjs.js +1 -1
  3. package/dist/cjs/road-badge_14.cjs.entry.js +2 -2
  4. package/dist/cjs/road-badge_14.cjs.entry.js.map +1 -1
  5. package/dist/cjs/road-global-navigation-v2.cjs.entry.js +146 -0
  6. package/dist/cjs/road-global-navigation-v2.cjs.entry.js.map +1 -0
  7. package/dist/cjs/road-navbar-item-v2.cjs.entry.js +83 -0
  8. package/dist/cjs/road-navbar-item-v2.cjs.entry.js.map +1 -0
  9. package/dist/cjs/road-navbar-v2.cjs.entry.js +46 -0
  10. package/dist/cjs/road-navbar-v2.cjs.entry.js.map +1 -0
  11. package/dist/cjs/road-toolbar-v2.cjs.entry.js +21 -0
  12. package/dist/cjs/road-toolbar-v2.cjs.entry.js.map +1 -0
  13. package/dist/cjs/roadtrip.cjs.js +1 -1
  14. package/dist/collection/collection-manifest.json +4 -0
  15. package/dist/collection/components/drawer/drawer.css +1 -0
  16. package/dist/collection/components/global-navigation-v2/global-navigation-v2.css +14 -0
  17. package/dist/collection/components/global-navigation-v2/global-navigation-v2.js +231 -0
  18. package/dist/collection/components/global-navigation-v2/global-navigation-v2.js.map +1 -0
  19. package/dist/collection/components/global-navigation-v2/global-navigation-v2.stories.js +446 -0
  20. package/dist/collection/components/icon/icon.css +1 -1
  21. package/dist/collection/components/navbar-item-v2/navbar-item-v2.css +221 -0
  22. package/dist/collection/components/navbar-item-v2/navbar-item-v2.js +268 -0
  23. package/dist/collection/components/navbar-item-v2/navbar-item-v2.js.map +1 -0
  24. package/dist/collection/components/navbar-v2/navbar-v2.css +113 -0
  25. package/dist/collection/components/navbar-v2/navbar-v2.js +143 -0
  26. package/dist/collection/components/navbar-v2/navbar-v2.js.map +1 -0
  27. package/dist/collection/components/navbar-v2/navbar-v2.stories.js +381 -0
  28. package/dist/collection/components/toolbar-v2/toolbar-v2.css +216 -0
  29. package/dist/collection/components/toolbar-v2/toolbar-v2.js +27 -0
  30. package/dist/collection/components/toolbar-v2/toolbar-v2.js.map +1 -0
  31. package/dist/collection/components/toolbar-v2/toolbar-v2.stories.js +90 -0
  32. package/dist/esm/index-52302079.js +16 -0
  33. package/dist/esm/loader.js +1 -1
  34. package/dist/esm/road-badge_14.entry.js +2 -2
  35. package/dist/esm/road-badge_14.entry.js.map +1 -1
  36. package/dist/esm/road-global-navigation-v2.entry.js +142 -0
  37. package/dist/esm/road-global-navigation-v2.entry.js.map +1 -0
  38. package/dist/esm/road-navbar-item-v2.entry.js +79 -0
  39. package/dist/esm/road-navbar-item-v2.entry.js.map +1 -0
  40. package/dist/esm/road-navbar-v2.entry.js +42 -0
  41. package/dist/esm/road-navbar-v2.entry.js.map +1 -0
  42. package/dist/esm/road-toolbar-v2.entry.js +17 -0
  43. package/dist/esm/road-toolbar-v2.entry.js.map +1 -0
  44. package/dist/esm/roadtrip.js +1 -1
  45. package/dist/html.html-data.json +99 -0
  46. package/dist/roadtrip/p-586a101a.entry.js +2 -0
  47. package/dist/roadtrip/p-586a101a.entry.js.map +1 -0
  48. package/dist/roadtrip/p-5bf1b477.entry.js +2 -0
  49. package/dist/roadtrip/p-5bf1b477.entry.js.map +1 -0
  50. package/dist/roadtrip/p-5cdf4e2f.entry.js +2 -0
  51. package/dist/roadtrip/p-5cdf4e2f.entry.js.map +1 -0
  52. package/dist/roadtrip/p-a498e8eb.entry.js +2 -0
  53. package/dist/roadtrip/p-a498e8eb.entry.js.map +1 -0
  54. package/dist/roadtrip/p-e2e3aa1a.entry.js +2 -0
  55. package/dist/roadtrip/p-e2e3aa1a.entry.js.map +1 -0
  56. package/dist/roadtrip/roadtrip.css +1 -1
  57. package/dist/roadtrip/roadtrip.esm.js +1 -1
  58. package/dist/roadtrip/roadtrip.esm.js.map +1 -1
  59. package/dist/types/components/global-navigation-v2/global-navigation-v2.d.ts +32 -0
  60. package/dist/types/components/navbar-item-v2/navbar-item-v2.d.ts +61 -0
  61. package/dist/types/components/navbar-v2/navbar-v2.d.ts +23 -0
  62. package/dist/types/components/toolbar-v2/toolbar-v2.d.ts +11 -0
  63. package/dist/types/components-react.d.ts +81 -0
  64. package/dist/types/components.d.ts +180 -0
  65. package/hydrate/index.js +330 -4
  66. package/package.json +1 -1
  67. package/dist/roadtrip/p-1115f970.entry.js +0 -2
  68. package/dist/roadtrip/p-1115f970.entry.js.map +0 -1
package/hydrate/index.js CHANGED
@@ -5943,7 +5943,7 @@ const isSrc$2 = (str) => str.length > 0 && /(\/|\.)/.test(str);
5943
5943
  const isStr$2 = (val) => typeof val === 'string';
5944
5944
  const toLower$2 = (val) => val.toLowerCase();
5945
5945
 
5946
- const assetCss = "/*!@:host*/.sc-road-asset-h{box-sizing:content-box;contain:strict;display:table}/*!@.icon-inner*/.icon-inner.sc-road-asset{width:fit-content}/*!@:host svg*/.sc-road-asset-h svg.sc-road-asset{display:block;width:100%;height:100%}";
5946
+ const assetCss = "/*!@:host*/.sc-road-asset-h{box-sizing:content-box;contain:strict;display:table}/*!@.icon-inner*/.icon-inner.sc-road-asset{width:-moz-fit-content;width:fit-content}/*!@:host svg*/.sc-road-asset-h svg.sc-road-asset{display:block;width:100%;height:100%}";
5947
5947
 
5948
5948
  class Asset {
5949
5949
  constructor(hostRef) {
@@ -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}/*!@.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}";
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);background-color:var(--road-surface)}/*!@.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.
@@ -14136,6 +14136,155 @@ class GlobalNavigation {
14136
14136
  }; }
14137
14137
  }
14138
14138
 
14139
+ const globalNavigationV2Css = "/*!@:host*/.sc-road-global-navigation-v2-h{position:fixed;top:0;z-index:2;width:100%}";
14140
+
14141
+ /**
14142
+ * @slot navbar - it should be road-navbar-item elements. Max 5 items on Mobile or add them to the drawer
14143
+ */
14144
+ class GlobalNavigationV2 {
14145
+ constructor(hostRef) {
14146
+ registerInstance(this, hostRef);
14147
+ this.roadnavbarchanged = createEvent(this, "roadnavbarchanged", 7);
14148
+ this.roadNavbarChanged = createEvent(this, "roadNavbarChanged", 7);
14149
+ this.selectedTab = undefined;
14150
+ }
14151
+ selectedTabChanged() {
14152
+ if (this.selectedTab !== undefined) {
14153
+ this.roadnavbarchanged.emit({
14154
+ tab: this.selectedTab,
14155
+ });
14156
+ this.roadNavbarChanged.emit({
14157
+ tab: this.selectedTab,
14158
+ });
14159
+ }
14160
+ }
14161
+ onNavbarChanged(ev) {
14162
+ this.selectedTab = ev.detail.tab;
14163
+ }
14164
+ /** Toggles the compact attribute on <road-navbar-v2> */
14165
+ toggleCompactMode() {
14166
+ const navbar = this.host.querySelector('road-navbar-v2');
14167
+ const toolbar = this.host.querySelector('road-toolbar-v2');
14168
+ // Toggle "compact" attribute on <road-navbar-v2>
14169
+ if (navbar) {
14170
+ if (navbar.hasAttribute('compact')) {
14171
+ navbar.removeAttribute('compact');
14172
+ }
14173
+ else {
14174
+ navbar.setAttribute('compact', 'true');
14175
+ }
14176
+ }
14177
+ else {
14178
+ console.warn('<road-navbar-v2> not found inside <road-global-navigation-v2>');
14179
+ }
14180
+ // Replace class "toolbar" with "toolbar-compact" on <road-toolbar-v2>
14181
+ if (toolbar) {
14182
+ if (toolbar.classList.contains('toolbar-compact')) {
14183
+ toolbar.classList.remove('toolbar-compact');
14184
+ toolbar.classList.add('toolbar');
14185
+ }
14186
+ else {
14187
+ toolbar.classList.remove('toolbar');
14188
+ toolbar.classList.add('toolbar-compact');
14189
+ }
14190
+ }
14191
+ else {
14192
+ console.warn('<road-toolbar-v2> not found inside <road-global-navigation-v2>');
14193
+ }
14194
+ }
14195
+ /** Toggles the "justify-content-center" class on the element with "compact-logo" */
14196
+ toggleCompactLogoClass() {
14197
+ const logoElement = this.host.querySelector('.compact-logo');
14198
+ if (logoElement) {
14199
+ if (logoElement.classList.contains('justify-content-center')) {
14200
+ logoElement.classList.remove('justify-content-center');
14201
+ }
14202
+ else {
14203
+ logoElement.classList.add('justify-content-center');
14204
+ }
14205
+ }
14206
+ else {
14207
+ console.warn('Element with class "compact-logo" not found inside <road-global-navigation-v2>');
14208
+ }
14209
+ }
14210
+ /** Toggles the "rotate" attribute on the <road-icon> inside the <road-button> */
14211
+ toggleIconRotation(button) {
14212
+ const icon = button.querySelector('road-icon');
14213
+ if (icon) {
14214
+ if (icon.getAttribute('rotate') === '180') {
14215
+ icon.removeAttribute('rotate');
14216
+ }
14217
+ else {
14218
+ icon.setAttribute('rotate', '180');
14219
+ }
14220
+ }
14221
+ else {
14222
+ console.warn('<road-icon> not found inside <road-button>');
14223
+ }
14224
+ }
14225
+ /** Toggles the "trigger" attribute on <road-tooltip> elements based on the presence of the "compact" attribute on <road-navbar-v2> */
14226
+ toggleTooltips() {
14227
+ const navbar = this.host.querySelector('road-navbar-v2');
14228
+ if (navbar) {
14229
+ const hasCompactAttribute = navbar.hasAttribute('compact');
14230
+ const tooltips = navbar.querySelectorAll('road-tooltip');
14231
+ if (tooltips.length > 0) {
14232
+ // Mettre à jour l'attribut "trigger" en fonction de l'attribut "compact"
14233
+ tooltips.forEach((tooltip) => {
14234
+ if (hasCompactAttribute) {
14235
+ tooltip.setAttribute('trigger', 'hover'); // Définir sur "hover" si "compact" est présent
14236
+ }
14237
+ else {
14238
+ tooltip.setAttribute('trigger', 'focus'); // Définir sur "focus" si "compact" est absent
14239
+ }
14240
+ });
14241
+ }
14242
+ else {
14243
+ console.warn('<road-tooltip> elements not found inside <road-navbar-v2>.');
14244
+ }
14245
+ }
14246
+ else {
14247
+ console.warn('<road-navbar-v2> not found inside <road-global-navigation-v2>.');
14248
+ }
14249
+ }
14250
+ /** Toggles the compact mode and performs all related updates */
14251
+ /** Handles click events on road-button or its children */
14252
+ onButtonClick(event) {
14253
+ let target = event.target;
14254
+ // Traverse up the DOM tree to find the parent road-button
14255
+ while (target && target.tagName !== 'ROAD-BUTTON' && target !== document.body) {
14256
+ target = target.parentElement;
14257
+ }
14258
+ if ((target === null || target === void 0 ? void 0 : target.tagName) === 'ROAD-BUTTON' && target.classList.contains('compact-button')) {
14259
+ this.toggleCompactMode();
14260
+ this.toggleIconRotation(target);
14261
+ this.toggleCompactLogoClass();
14262
+ this.toggleTooltips();
14263
+ }
14264
+ }
14265
+ componentWillLoad() {
14266
+ this.selectedTabChanged();
14267
+ }
14268
+ render() {
14269
+ return (hAsync(Host, { role: "application" }, hAsync("slot", null)));
14270
+ }
14271
+ get host() { return getElement(this); }
14272
+ static get watchers() { return {
14273
+ "selectedTab": ["selectedTabChanged"]
14274
+ }; }
14275
+ static get style() { return globalNavigationV2Css; }
14276
+ static get cmpMeta() { return {
14277
+ "$flags$": 9,
14278
+ "$tagName$": "road-global-navigation-v2",
14279
+ "$members$": {
14280
+ "selectedTab": [1, "selected-tab"]
14281
+ },
14282
+ "$listeners$": [[0, "roadNavbarItemClick", "onNavbarChanged"], [0, "roadnavbaritemclick", "onNavbarChanged"], [8, "click", "onButtonClick"]],
14283
+ "$lazyBundleId$": "-",
14284
+ "$attrsToReflect$": []
14285
+ }; }
14286
+ }
14287
+
14139
14288
  const gridCss = "/*!@:host*/.sc-road-grid-h{box-sizing:border-box;display:block;width:100%;padding-right:8px;padding-left:8px;margin-right:auto;margin-left:auto}@media (min-width: 768px){/*!@:host*/.sc-road-grid-h{padding-right:24px;padding-left:24px}}";
14140
14289
 
14141
14290
  /**
@@ -14180,7 +14329,7 @@ const isSrc$1 = (str) => str.length > 0 && /(\/|\.)/.test(str);
14180
14329
  const isStr$1 = (val) => typeof val === 'string';
14181
14330
  const toLower$1 = (val) => val.toLowerCase();
14182
14331
 
14183
- const iconCss = "/*!@:host*/.sc-road-icon-h{box-sizing:content-box;display:inline-block;color:var(--road-icon);transition:fill 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;fill:currentColor;contain:strict}/*!@:host svg*/.sc-road-icon-h svg.sc-road-icon{display:block;width:100%;height:100%}/*!@:host(.icon-sm)*/.icon-sm.sc-road-icon-h{width:1.25rem;height:1.25rem}/*!@:host(.icon-md)*/.icon-md.sc-road-icon-h{width:1.5rem;height:1.5rem}/*!@:host(.icon-lg)*/.icon-lg.sc-road-icon-h{width:2rem;height:2rem}/*!@:host(.icon-3x)*/.icon-3x.sc-road-icon-h{width:3rem;height:3rem}/*!@:host(.icon-4x)*/.icon-4x.sc-road-icon-h{width:4rem;height:4rem}/*!@:host(.icon-primary)*/.icon-primary.sc-road-icon-h{color:var(--road-primary-50);fill:currentColor}/*!@:host(.icon-secondary)*/.icon-secondary.sc-road-icon-h{color:var(--road-secondary-50);fill:currentColor}/*!@:host(.icon-accent)*/.icon-accent.sc-road-icon-h{color:var(--road-secondary-50);fill:currentColor}/*!@:host(.icon-info)*/.icon-info.sc-road-icon-h{color:var(--road-info-icon);fill:currentColor}/*!@:host(.icon-success)*/.icon-success.sc-road-icon-h{color:var(--road-success-icon);fill:currentColor}/*!@:host(.icon-warning)*/.icon-warning.sc-road-icon-h{color:var(--road-warning-icon);fill:currentColor}/*!@:host(.icon-danger)*/.icon-danger.sc-road-icon-h{color:var(--road-danger-icon);fill:currentColor}/*!@:host(.icon-default)*/.icon-default.sc-road-icon-h{color:var(--road-icon);fill:currentColor}/*!@:host(.icon-white)*/.icon-white.sc-road-icon-h{color:var(--road-icon-inverse);fill:currentColor}/*!@:host(.icon-rotate-90)*/.icon-rotate-90.sc-road-icon-h{transform:rotate(90deg)}/*!@:host(.icon-rotate-180)*/.icon-rotate-180.sc-road-icon-h{transform:rotate(180deg);transform:scaleX(-1)}/*!@:host(.icon-rotate-270)*/.icon-rotate-270.sc-road-icon-h{transform:rotate(270deg)}";
14332
+ const iconCss = "/*!@:host*/.sc-road-icon-h{box-sizing:content-box;display:inline-block;color:currentColor;transition:fill 250ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;fill:currentColor;contain:strict}/*!@:host svg*/.sc-road-icon-h svg.sc-road-icon{display:block;width:100%;height:100%}/*!@:host(.icon-sm)*/.icon-sm.sc-road-icon-h{width:1.25rem;height:1.25rem}/*!@:host(.icon-md)*/.icon-md.sc-road-icon-h{width:1.5rem;height:1.5rem}/*!@:host(.icon-lg)*/.icon-lg.sc-road-icon-h{width:2rem;height:2rem}/*!@:host(.icon-3x)*/.icon-3x.sc-road-icon-h{width:3rem;height:3rem}/*!@:host(.icon-4x)*/.icon-4x.sc-road-icon-h{width:4rem;height:4rem}/*!@:host(.icon-primary)*/.icon-primary.sc-road-icon-h{color:var(--road-primary-50);fill:currentColor}/*!@:host(.icon-secondary)*/.icon-secondary.sc-road-icon-h{color:var(--road-secondary-50);fill:currentColor}/*!@:host(.icon-accent)*/.icon-accent.sc-road-icon-h{color:var(--road-secondary-50);fill:currentColor}/*!@:host(.icon-info)*/.icon-info.sc-road-icon-h{color:var(--road-info-icon);fill:currentColor}/*!@:host(.icon-success)*/.icon-success.sc-road-icon-h{color:var(--road-success-icon);fill:currentColor}/*!@:host(.icon-warning)*/.icon-warning.sc-road-icon-h{color:var(--road-warning-icon);fill:currentColor}/*!@:host(.icon-danger)*/.icon-danger.sc-road-icon-h{color:var(--road-danger-icon);fill:currentColor}/*!@:host(.icon-default)*/.icon-default.sc-road-icon-h{color:var(--road-icon);fill:currentColor}/*!@:host(.icon-white)*/.icon-white.sc-road-icon-h{color:var(--road-icon-inverse);fill:currentColor}/*!@:host(.icon-rotate-90)*/.icon-rotate-90.sc-road-icon-h{transform:rotate(90deg)}/*!@:host(.icon-rotate-180)*/.icon-rotate-180.sc-road-icon-h{transform:rotate(180deg);transform:scaleX(-1)}/*!@:host(.icon-rotate-270)*/.icon-rotate-270.sc-road-icon-h{transform:rotate(270deg)}";
14184
14333
 
14185
14334
  class Icon {
14186
14335
  constructor(hostRef) {
@@ -32188,7 +32337,7 @@ const navbarItemCss = "/*!@:host*/.sc-road-navbar-item-h{position:relative;box-s
32188
32337
  *
32189
32338
  * @part native - The native HTML anchor element that wraps all child elements.
32190
32339
  */
32191
- class NavbarItem {
32340
+ class NavbarItem$1 {
32192
32341
  constructor(hostRef) {
32193
32342
  registerInstance(this, hostRef);
32194
32343
  this.roadnavbaritemclick = createEvent(this, "roadnavbaritemclick", 7);
@@ -32276,6 +32425,151 @@ class NavbarItem {
32276
32425
  }; }
32277
32426
  }
32278
32427
 
32428
+ const navbarItemV2Css = "/*!@:host*/.sc-road-navbar-item-v2-h{position:relative;box-sizing:border-box;display:flex;flex:1;flex-basis:0;flex-direction:column;flex-grow:1;align-items:center;justify-content:center;text-align:center;white-space:nowrap}@media (min-width: 1200px){/*!@:host*/.sc-road-navbar-item-v2-h{flex-grow:inherit;width:-moz-fit-content;width:fit-content;padding:var(--road-spacing-04) 0 var(--road-spacing-04) var(--road-spacing-04);text-align:left}}/*!@:host(.tab-disabled),\n:host(.tab-disabled) road-tooltip,\n:host(.tab-disabled) road-tooltip road-icon,\n:host(.tab-disabled) ::slotted(road-icon)*/.tab-disabled.sc-road-navbar-item-v2-h,.tab-disabled.sc-road-navbar-item-v2-h road-tooltip.sc-road-navbar-item-v2,.tab-disabled.sc-road-navbar-item-v2-h road-tooltip.sc-road-navbar-item-v2 road-icon.sc-road-navbar-item-v2,.sc-road-navbar-item-v2-h.tab-disabled.sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h.tab-disabled .sc-road-navbar-item-v2-s>road-icon{color:var(--road-on-surface-disabled);cursor:not-allowed;fill:var(--road-on-surface-disabled)}/*!@:host(.tab-selected),\n:host(.tab-selected) road-tooltip road-icon,\n:host(.tab-selected) ::slotted(road-icon)*/.tab-selected.sc-road-navbar-item-v2-h,.tab-selected.sc-road-navbar-item-v2-h road-tooltip.sc-road-navbar-item-v2 road-icon.sc-road-navbar-item-v2,.sc-road-navbar-item-v2-h.tab-selected.sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h.tab-selected .sc-road-navbar-item-v2-s>road-icon{color:var(--road-on-button-tertiary);fill:var(--road-on-button-tertiary)}/*!@:host(.tab-selected)::after*/.tab-selected.sc-road-navbar-item-v2-h::after{position:absolute;bottom:-12px;left:0;display:block;width:100%;height:4px;color:var(--road-on-button-tertiary);content:\"\";background-color:var(--road-on-button-tertiary)}@media (min-width: 1200px){/*!@:host(.tab-selected)::after*/.tab-selected.sc-road-navbar-item-v2-h::after{display:none}}/*!@:host(.focus-visible) ::slotted(road-icon),\n:host(.focus-visible) ::slotted(road-icon)::after,\n:host(.focus-visible) ::slotted(road-label),\n:host(.focus-visible) ::slotted(road-label)::after,\n:host(:hover) ::slotted(road-icon),\n:host(:hover) ::slotted(road-icon)::after,\n:host(:hover) ::slotted(road-label),\n:host(:hover) ::slotted(road-label)::after*/.sc-road-navbar-item-v2-h.focus-visible .sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h.focus-visible.sc-road-navbar-item-v2-s>road-icon::after,.sc-road-navbar-item-v2-h.focus-visible .sc-road-navbar-item-v2-s>road-icon::after,.sc-road-navbar-item-v2-h.focus-visible.sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h.focus-visible .sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h.focus-visible.sc-road-navbar-item-v2-s>road-label::after,.sc-road-navbar-item-v2-h.focus-visible .sc-road-navbar-item-v2-s>road-label::after,.sc-road-navbar-item-v2-h:hover.sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h:hover .sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h:hover.sc-road-navbar-item-v2-s>road-icon::after,.sc-road-navbar-item-v2-h:hover .sc-road-navbar-item-v2-s>road-icon::after,.sc-road-navbar-item-v2-h:hover.sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h:hover .sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h:hover.sc-road-navbar-item-v2-s>road-label::after,.sc-road-navbar-item-v2-h:hover .sc-road-navbar-item-v2-s>road-label::after{color:var(--road-on-button-tertiary)}/*!@:host(.tab-disabled.focus-visible) ::slotted(road-icon),\n:host(.tab-disabled.focus-visible) ::slotted(road-label),\n:host(.tab-disabled:hover) ::slotted(road-icon),\n:host(.tab-disabled:hover) ::slotted(road-label)*/.sc-road-navbar-item-v2-h.tab-disabled.focus-visible .sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h.tab-disabled.focus-visible.sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h.tab-disabled.focus-visible .sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h.tab-disabled:hover.sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h.tab-disabled:hover .sc-road-navbar-item-v2-s>road-icon,.sc-road-navbar-item-v2-h.tab-disabled:hover.sc-road-navbar-item-v2-s>road-label,.sc-road-navbar-item-v2-h.tab-disabled:hover .sc-road-navbar-item-v2-s>road-label{color:var(--road-on-surface-disabled);cursor:not-allowed;fill:var(--road-on-surface-disabled)}/*!@.button-native*/.button-native.sc-road-navbar-item-v2{position:relative;box-sizing:border-box;display:flex;flex-direction:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%;margin:0;overflow:visible;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-color:initial;border-style:initial;border-width:0;border-radius:inherit;border-image:initial;outline:0;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}/*!@:host(.tab-disabled) .button-native*/.tab-disabled.sc-road-navbar-item-v2-h .button-native.sc-road-navbar-item-v2{cursor:not-allowed}/*!@.button-inner*/.button-inner.sc-road-navbar-item-v2{position:relative;z-index:1;display:flex;flex-flow:inherit;align-items:inherit;justify-content:inherit;width:100%;height:100%}/*!@::slotted(road-icon)*/.sc-road-navbar-item-v2-s>road-icon{display:block;width:2rem;height:2rem;margin-right:auto;margin-bottom:0.25rem;margin-left:auto;fill:currentColor}@media (min-width: 1200px){/*!@:host ::slotted(road-tooltip)*/.sc-road-navbar-item-v2-h .sc-road-navbar-item-v2-s>road-tooltip{width:100%}}/*!@::slotted(road-label)*/.sc-road-navbar-item-v2-s>road-label{position:relative;box-sizing:border-box;display:flex;flex:1;flex-direction:column;font-size:var(--road-label-small);font-weight:700;text-align:center;white-space:nowrap}@media (min-width: 1200px){/*!@::slotted(road-label)*/.sc-road-navbar-item-v2-s>road-label{display:block}}/*!@::slotted(road-badge)*/.sc-road-navbar-item-v2-s>road-badge{position:absolute;top:4px;left:calc(50% + 0.375rem);z-index:1;box-sizing:border-box;height:auto;font-size:var(--road-font-size-10);font-weight:400}";
32429
+
32430
+ /**
32431
+ * @slot - Content of the item, it should be road-icon and road-label elements.
32432
+ *
32433
+ * @part native - The native HTML anchor element that wraps all child elements.
32434
+ */
32435
+ class NavbarItem {
32436
+ constructor(hostRef) {
32437
+ registerInstance(this, hostRef);
32438
+ this.roadnavbaritemclick = createEvent(this, "roadnavbaritemclick", 7);
32439
+ this.roadNavbarItemClick = createEvent(this, "roadNavbarItemClick", 7);
32440
+ this.onKeyUp = (ev) => {
32441
+ if (ev.key === 'Enter' || ev.key === ' ') {
32442
+ this.selectTab(ev);
32443
+ }
32444
+ };
32445
+ this.onClick = (ev) => {
32446
+ this.selectTab(ev);
32447
+ };
32448
+ this.disabled = false;
32449
+ this.download = undefined;
32450
+ this.href = undefined;
32451
+ this.rel = undefined;
32452
+ this.selected = false;
32453
+ this.tab = undefined;
32454
+ this.target = undefined;
32455
+ }
32456
+ onNavbarChanged(ev) {
32457
+ this.selected = this.tab === ev.detail.tab;
32458
+ }
32459
+ /**
32460
+ * Watch for changes to `selected` and move focus to this element if `selected` is true.
32461
+ */
32462
+ handleSelectedChange(newValue) {
32463
+ if (newValue) {
32464
+ this.el.focus();
32465
+ }
32466
+ }
32467
+ selectTab(ev) {
32468
+ if (this.tab !== undefined) {
32469
+ if (!this.disabled) {
32470
+ this.roadnavbaritemclick.emit({
32471
+ tab: this.tab,
32472
+ href: this.href,
32473
+ selected: this.selected,
32474
+ });
32475
+ this.roadNavbarItemClick.emit({
32476
+ tab: this.tab,
32477
+ href: this.href,
32478
+ selected: this.selected,
32479
+ });
32480
+ }
32481
+ if (this.href === undefined) {
32482
+ ev.preventDefault();
32483
+ }
32484
+ }
32485
+ }
32486
+ render() {
32487
+ const { href, rel, target, selected, tab, disabled } = this;
32488
+ const attrs = {
32489
+ download: this.download,
32490
+ href,
32491
+ rel,
32492
+ target,
32493
+ };
32494
+ return (hAsync(Host, { onClick: this.onClick, onKeyup: this.onKeyUp, role: "menuitem", tabindex: "0", "aria-selected": selected ? 'true' : null, id: tab !== undefined ? `navbar-item-${tab}` : null, disabled: disabled, class: {
32495
+ 'navbar-item': true,
32496
+ 'tab-selected': selected,
32497
+ 'tab-disabled': disabled,
32498
+ } }, hAsync("a", Object.assign({}, attrs, { tabIndex: -1, class: "button-native", part: "native" }), hAsync("span", { class: "button-inner" }, hAsync("slot", null)))));
32499
+ }
32500
+ get el() { return getElement(this); }
32501
+ static get watchers() { return {
32502
+ "selected": ["handleSelectedChange"]
32503
+ }; }
32504
+ static get style() { return navbarItemV2Css; }
32505
+ static get cmpMeta() { return {
32506
+ "$flags$": 9,
32507
+ "$tagName$": "road-navbar-item-v2",
32508
+ "$members$": {
32509
+ "disabled": [4],
32510
+ "download": [1],
32511
+ "href": [1],
32512
+ "rel": [1],
32513
+ "selected": [1028],
32514
+ "tab": [1],
32515
+ "target": [1]
32516
+ },
32517
+ "$listeners$": [[8, "roadNavbarChanged", "onNavbarChanged"], [8, "roadnavbarchanged", "onNavbarChanged"]],
32518
+ "$lazyBundleId$": "-",
32519
+ "$attrsToReflect$": []
32520
+ }; }
32521
+ }
32522
+
32523
+ const navbarV2Css = "/*!@:host*/.sc-road-navbar-v2-h{--z-index:3;position:fixed;bottom:0;left:0;z-index:var(--z-index);box-sizing:border-box;display:flex;align-items:center;width:100%;height:5.125rem;padding-left:0;margin:0;text-align:center;-webkit-user-select:none;user-select:none;background-color:var(--road-surface);border-top:1px solid var(--road-outline-weak)}@media (max-width: 576px){/*!@:host*/.sc-road-navbar-v2-h{overflow-x:auto}}@media (min-width: 1200px){/*!@:host*/.sc-road-navbar-v2-h{flex-direction:column;align-items:flex-start;width:260px;height:100%;padding:var(--road-spacing-05);text-align:left;border-top:0;border-right:1px solid var(--road-outline-weak);justify-content:space-between;height:100%}}/*!@::slotted(.drawer-button-save)*/.sc-road-navbar-v2-s>.drawer-button-save{position:absolute;bottom:0;width:100%}/*!@.button-native*/.button-native.sc-road-navbar-v2{position:relative;display:flex;flex-flow:row nowrap;flex-shrink:0;align-items:center;justify-content:center;width:100%;height:100%;padding:var(--padding-end) var(--padding-end) var(--padding-start) 0;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)}@media (min-width: 1200px){/*!@:host(.compact)*/.compact.sc-road-navbar-v2-h{max-width:5.5rem}/*!@.compact ::slotted(.compact-container)*/.compact .sc-road-navbar-v2-s>.compact-container{max-width:3.5rem}/*!@.compact ::slotted(.compact-container) .compact-logo*/.compact .sc-road-navbar-v2-s>.compact-container .compact-logo{justify-content:center}}";
32524
+
32525
+ /**
32526
+ * @slot - Content of the navbar, it should be road-navbar-item elements. Max 5 items on Mobile
32527
+ */
32528
+ class NavbarV2 {
32529
+ constructor(hostRef) {
32530
+ registerInstance(this, hostRef);
32531
+ this.roadnavbarchanged = createEvent(this, "roadnavbarchanged", 7);
32532
+ this.roadNavbarChanged = createEvent(this, "roadNavbarChanged", 7);
32533
+ this.compact = false;
32534
+ this.selectedTab = undefined;
32535
+ }
32536
+ selectedTabChanged() {
32537
+ if (this.selectedTab !== undefined) {
32538
+ this.roadnavbarchanged.emit({
32539
+ tab: this.selectedTab,
32540
+ });
32541
+ this.roadNavbarChanged.emit({
32542
+ tab: this.selectedTab,
32543
+ });
32544
+ }
32545
+ }
32546
+ onNavbarChanged(ev) {
32547
+ this.selectedTab = ev.detail.tab;
32548
+ }
32549
+ componentWillLoad() {
32550
+ this.selectedTabChanged();
32551
+ }
32552
+ render() {
32553
+ const compactClass = this.compact ? 'compact' : '';
32554
+ return (hAsync(Host, { role: "menubar", class: `${compactClass}` }, hAsync("slot", null)));
32555
+ }
32556
+ static get watchers() { return {
32557
+ "selectedTab": ["selectedTabChanged"]
32558
+ }; }
32559
+ static get style() { return navbarV2Css; }
32560
+ static get cmpMeta() { return {
32561
+ "$flags$": 9,
32562
+ "$tagName$": "road-navbar-v2",
32563
+ "$members$": {
32564
+ "compact": [516],
32565
+ "selectedTab": [1, "selected-tab"]
32566
+ },
32567
+ "$listeners$": [[0, "roadNavbarItemClick", "onNavbarChanged"], [0, "roadnavbaritemclick", "onNavbarChanged"]],
32568
+ "$lazyBundleId$": "-",
32569
+ "$attrsToReflect$": [["compact", "compact"]]
32570
+ }; }
32571
+ }
32572
+
32279
32573
  const plateNumberCss = ".sc-road-plate-number-h{display:block}.plate-number.sc-road-plate-number{--margin-bottom:0}.plate-number-start.sc-road-plate-number,.plate-number-end.sc-road-plate-number{width:1.75rem;height:calc(3rem - 0.25rem);background:var(--road-info-50)}.input-group-prepend.sc-road-plate-number{margin-right:-1px}.input-group-prepend.sc-road-plate-number,.input-group-append.sc-road-plate-number{padding:0}.plate-number-start.sc-road-plate-number{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:0;margin-right:0;margin-left:1px;color:var(--road-icon-inverse);border-radius:0.125rem 0 0 0.125rem}.plate-number-icon.sc-road-plate-number{width:1.25rem;height:1.25rem;color:#f3db53}.plate-number-location.sc-road-plate-number{font-size:var(--road-button-medium);font-weight:700}.plate-number-end.sc-road-plate-number{margin-right:1px;border-radius:0 0.125rem 0.125rem 0}.plate-number-be.sc-road-plate-number .plate-number-input.sc-road-plate-number{color:var(--road-on-danger-surface)}.plate-number-be.sc-road-plate-number .plate-number-input.sc-road-plate-number,.plate-number-be.sc-road-plate-number .input-group-append.sc-road-plate-number,.plate-number-be.sc-road-plate-number .input-group-prepend.sc-road-plate-number{border-color:var(--road-danger-outline)}.plate-number-input.sc-road-plate-number{position:relative;display:block;height:3rem;margin:0;font-family:var(--road-font, sans-serif);font-size:var(--road-heading-04);font-weight:700;color:var(--road-on-surface);text-align:center;background:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0;box-shadow:none;appearance:none}.plate-number-input.sc-road-plate-number::placeholder{color:var(--road-on-surface-weak);opacity:1}.plate-number-input.sc-road-plate-number:disabled{color:var(--road-on-surface-disabled);cursor:not-allowed;background:var(--road-surface-disabled);opacity:1}.plate-number-input.sc-road-plate-number:disabled~.input-group-prepend.sc-road-plate-number,.plate-number-input.sc-road-plate-number:disabled~.input-group-append.sc-road-plate-number{cursor:not-allowed;background:var(--road-surface-disabled)}@media (hover: hover){.plate-number-input.sc-road-plate-number:not(:disabled):not([readonly]):hover{border-color:var(--road-input-outline-variant)}}.plate-number-input.sc-road-plate-number:not([readonly]):focus{outline:auto}.motorbike-plate.sc-road-plate-number .plate-number-input.sc-road-plate-number{height:6rem;padding:0.75rem 1rem 0;resize:none;border-left:0}.motorbike-plate.sc-road-plate-number .input-group-prepend.sc-road-plate-number,.motorbike-plate.sc-road-plate-number .input-group-append.sc-road-plate-number{align-items:flex-start;height:6rem;padding:0}.motorbike-plate.sc-road-plate-number .plate-number-start.sc-road-plate-number{margin-top:1px;border-radius:0.125rem 0 0}.motorbike-plate.sc-road-plate-number .plate-number-end.sc-road-plate-number{margin-top:1px;border-radius:0 0.125rem 0 0}";
32280
32574
 
32281
32575
  class PlateNumber {
@@ -37511,6 +37805,34 @@ class ToolbarTitle {
37511
37805
  }; }
37512
37806
  }
37513
37807
 
37808
+ const toolbarV2Css = "/*!@:host*/.sc-road-toolbar-v2-h{position:relative;box-sizing:border-box;display:flex;align-items:center;width:100%;height:72px;contain:content;padding:var(--road-spacing-04);color:var(--road-on-surface);background:var(--road-surface);border-bottom:1px solid var(--road-outline-weak)}/*!@.toolbar-container*/.toolbar-container.sc-road-toolbar-v2{position:relative;box-sizing:border-box;display:flex;flex-direction:row;align-items:center;justify-content:space-between;width:100%;min-height:3.73rem;contain:content;overflow:hidden}/*!@.toolbar-container-content-left*/.toolbar-container-content-left.sc-road-toolbar-v2{display:flex;flex:1}/*!@.toolbar-container-content-right*/.toolbar-container-content-right.sc-road-toolbar-v2{display:none}@media (min-width: 1200px){/*!@.toolbar-container-content-right*/.toolbar-container-content-right.sc-road-toolbar-v2{display:flex;flex:auto}}/*!@.toolbar-title-container*/.toolbar-title-container.sc-road-toolbar-v2{position:relative;top:0;left:0;display:flex;flex:1;align-items:center;width:100%;height:100%;text-align:center}/*!@.toolbar-title*/.toolbar-title.sc-road-toolbar-v2{display:block;width:100%;font-size:var(--road-font-size-18);font-weight:700;text-align:left;text-overflow:ellipsis;white-space:nowrap;pointer-events:auto}@media (min-width: 1200px){/*!@:host(.toolbar)*/.toolbar.sc-road-toolbar-v2-h{display:flex;align-items:center;width:calc(100% - 260px);justify-self:flex-end;height:80px;padding:var(--road-spacing-05)}/*!@:host(.toolbar-compact)*/.toolbar-compact.sc-road-toolbar-v2-h{display:flex;width:calc(100% - 5.5rem);justify-self:flex-end;height:80px;padding:var(--road-spacing-05)}/*!@.toolbar-title*/.toolbar-title.sc-road-toolbar-v2{font-size:var(--road-font-size-21);text-align:center}}/*!@.toolbar-content*/.toolbar-content.sc-road-toolbar-v2{display:none}@media (min-width: 1200px){/*!@.toolbar-content*/.toolbar-content.sc-road-toolbar-v2{display:flex;flex:2;min-width:0;max-width:100%}}/*!@.toolbar .logo*/.toolbar.sc-road-toolbar-v2 .logo.sc-road-toolbar-v2{position:relative;z-index:1;padding-left:1rem;margin-bottom:0;font-size:var(--road-font-size-14);font-weight:400}/*!@.toolbar .app-name*/.toolbar.sc-road-toolbar-v2 .app-name.sc-road-toolbar-v2{margin-left:1rem;font-size:var(--road-font-size-20);font-weight:700}/*!@::slotted([slot=\"start\"])*/.sc-road-toolbar-v2-s>[slot=\"start\"]{--margin-bottom:0;--padding-start:0.5rem;--padding-end:0.5rem;align-self:auto;margin-right:var(--road-spacing-05);font-size:var(--road-font-size-14);font-weight:400;border-right:1px solid var(--road-outline-weak);border-radius:0}/*!@::slotted([slot=\"primary\"])*/.sc-road-toolbar-v2-s>[slot=\"primary\"]{--margin-bottom:0;--padding-start:0.5rem;--padding-end:0.5rem;flex:1;align-self:auto}/*!@::slotted([slot=\"end\"])*/.sc-road-toolbar-v2-s>[slot=\"end\"]{--margin-bottom:0;--padding-start:0.5rem;--padding-end:0.5rem;flex:1;padding-left:var(--road-spacing-03);margin-left:var(--road-spacing-03);font-size:var(--road-font-size-14);font-weight:400;border-left:1px solid var(--road-outline-weak);border-radius:0}/*!@::slotted([slot=\"secondary\"])*/.sc-road-toolbar-v2-s>[slot=\"secondary\"]{--margin-bottom:0;--padding-start:0.5rem;--padding-end:0.5rem;flex:1;padding-left:var(--road-spacing-03);margin-left:var(--road-spacing-03);font-size:var(--road-font-size-14);font-weight:400;border-radius:0}/*!@:host(.toolbar-primary)*/.toolbar-primary.sc-road-toolbar-v2-h{color:var(--road-on-header-surface);background:var(--road-header-surface)}/*!@:host(.toolbar-secondary)*/.toolbar-secondary.sc-road-toolbar-v2-h{color:var(--road-on-secondary);background:var(--road-secondary)}";
37809
+
37810
+ /**
37811
+ *
37812
+ * @slot - Content is placed between the named slots if provided without a slot.
37813
+ * @slot start - Content is placed to the left of the toolbar text and left to primery slot if provided.
37814
+ * @slot primary - Content is placed to the left of the toolbar text.
37815
+ * @slot secondary - Content is placed to the right of the toolbar text.
37816
+ * @slot end - Content is placed to the right of the toolbar text and right to secondary slot if provided.
37817
+ */
37818
+ class ToolbarV2 {
37819
+ constructor(hostRef) {
37820
+ registerInstance(this, hostRef);
37821
+ }
37822
+ render() {
37823
+ return (hAsync(Host, { class: "toolbar" }, hAsync("div", { class: "toolbar-container" }, hAsync("div", { class: "toolbar-container-content-left" }, hAsync("slot", { name: "start" }), hAsync("slot", { name: "primary" })), hAsync("div", { class: "toolbar-content" }, hAsync("slot", null)), hAsync("div", { class: "toolbar-container-content-right" }, hAsync("slot", { name: "secondary" }), hAsync("slot", { name: "end" })))));
37824
+ }
37825
+ static get style() { return toolbarV2Css; }
37826
+ static get cmpMeta() { return {
37827
+ "$flags$": 9,
37828
+ "$tagName$": "road-toolbar-v2",
37829
+ "$members$": undefined,
37830
+ "$listeners$": undefined,
37831
+ "$lazyBundleId$": "-",
37832
+ "$attrsToReflect$": []
37833
+ }; }
37834
+ }
37835
+
37514
37836
  const tooltipCss = "/*!@:host*/.sc-road-tooltip-h{--max-width:85vw;--z-index:1;--width:max-content;position:relative;display:inline-block}/*!@:host(:hover)*/.sc-road-tooltip-h:hover{cursor:pointer}/*!@:host([trigger=\"hover\"]) .tooltip*/[trigger=\"hover\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{display:none}@media (min-width: 1200px){/*!@:host([trigger=\"hover\"]) .tooltip*/[trigger=\"hover\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{display:block}}/*!@.tooltip*/.tooltip.sc-road-tooltip{position:absolute;top:-0.5rem;left:50%;z-index:1;width:var(--width);min-width:100%;max-width:var(--max-width);padding:0.5rem;font-family:var(--road-font);font-size:var(--road-body-small);color:var(--road-on-surface);text-align:center;pointer-events:none;background:var(--road-surface);border:1px solid var(--road-outline-weak);border-radius:0.25rem;box-shadow:var(--road-elevation-low);opacity:0;transition:opacity 0.2s ease-in-out, transform 0.2s ease-in-out;transform:translateX(-50%) translateY(-100%)}/*!@:host([contentalign=\"left\"]) .tooltip*/[contentalign=\"left\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{text-align:left}/*!@.tooltip.tooltip-text-left::after*/.tooltip.tooltip-text-left.sc-road-tooltip::after{text-align:left}/*!@.tooltip-open*/.tooltip-open.sc-road-tooltip{visibility:visible;opacity:1}/*!@:host([data-tooltip-position=\"top\"]) .tooltip*/[data-tooltip-position=\"top\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{left:50%;transform:translateX(-50%) translateY(-70%)}/*!@:host([data-tooltip-position=\"top\"]) .tooltip-open*/[data-tooltip-position=\"top\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{left:50%;transform:translateX(-50%) translateY(-100%)}/*!@:host([data-tooltip-position=\"top-left\"]) .tooltip*/[data-tooltip-position=\"top-left\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{left:0%;transform:translateY(-70%)}/*!@:host([data-tooltip-position=\"top-left\"]) .tooltip-open*/[data-tooltip-position=\"top-left\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{transform:translateY(-100%)}/*!@:host([data-tooltip-position=\"top-right\"]) .tooltip*/[data-tooltip-position=\"top-right\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{left:50%;transform:translateY(-70%)}/*!@:host([data-tooltip-position=\"top-right\"]) .tooltip-open*/[data-tooltip-position=\"top-right\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{left:100%;transform:translateY(-100%)}/*!@:host([data-tooltip-position=\"left\"]) .tooltip*/[data-tooltip-position=\"left\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{top:50%;left:0%;margin-right:0.5rem;transform:translateX(-94%) translateY(-55%)}/*!@:host([data-tooltip-position=\"left\"]) .tooltip-open*/[data-tooltip-position=\"left\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{transform:translateX(-103%) translateY(-55%)}/*!@:host([data-tooltip-position=\"bottom\"]) .tooltip*/[data-tooltip-position=\"bottom\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{top:100%;left:50%;margin-top:0.5rem;transform:translateX(-50%) translateY(-40%)}/*!@:host([data-tooltip-position=\"bottom\"]) .tooltip-open*/[data-tooltip-position=\"bottom\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{transform:translateX(-50%) translateY(-6%)}/*!@:host([data-tooltip-position=\"bottom-left\"]) .tooltip*/[data-tooltip-position=\"bottom-left\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{top:100%;left:0;margin-top:0.5rem;transform:translateY(-40%)}/*!@:host([data-tooltip-position=\"bottom-left\"]) .tooltip-open*/[data-tooltip-position=\"bottom-left\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{transform:translateY(-6%)}/*!@:host([data-tooltip-position=\"bottom-right\"]) .tooltip*/[data-tooltip-position=\"bottom-right\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{top:100%;left:100%;margin-top:0.5rem;transform:translateY(-40%)}/*!@:host([data-tooltip-position=\"bottom-right\"]) .tooltip-open*/[data-tooltip-position=\"bottom-right\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{transform:translateY(-6%)}/*!@:host([data-tooltip-position=\"right\"]) .tooltip*/[data-tooltip-position=\"right\"].sc-road-tooltip-h .tooltip.sc-road-tooltip{top:50%;left:100%;margin-left:0.5rem;transform:translateX(-14%) translateY(-55%)}/*!@:host([data-tooltip-position=\"right\"]) .tooltip-open*/[data-tooltip-position=\"right\"].sc-road-tooltip-h .tooltip-open.sc-road-tooltip{transform:translateX(-4%) translateY(-55%)}";
37515
37837
 
37516
37838
  /**
@@ -37723,6 +38045,7 @@ registerComponents([
37723
38045
  Duration,
37724
38046
  Flap,
37725
38047
  GlobalNavigation,
38048
+ GlobalNavigationV2,
37726
38049
  Grid,
37727
38050
  Icon,
37728
38051
  Illustration,
@@ -37734,7 +38057,9 @@ registerComponents([
37734
38057
  List,
37735
38058
  Modal,
37736
38059
  Navbar,
38060
+ NavbarItem$1,
37737
38061
  NavbarItem,
38062
+ NavbarV2,
37738
38063
  PlateNumber,
37739
38064
  ProgressBar,
37740
38065
  ProgressIndicatorVertical,
@@ -37768,6 +38093,7 @@ registerComponents([
37768
38093
  Toolbar,
37769
38094
  ToolbarAppName,
37770
38095
  ToolbarTitle,
38096
+ ToolbarV2,
37771
38097
  Tooltip,
37772
38098
  toggle,
37773
38099
  ]);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@roadtrip/components",
3
- "version": "3.30.0",
3
+ "version": "3.31.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",