@roadtrip/components 2.25.1 → 2.27.1

package/dist/cjs/loader.cjs.js

@@ -29,7 +29,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return index.bootstrapLazy([["road-badge_11.cjs",[[33,"road-drawer",{"isOpen":[1028,"is-open"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64],"back":[64]},[[4,"keyup","onEscape"]]],[1,"road-item",{"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-badge",{"color":[1],"bubble":[4]}],[1,"road-col"],[1,"road-grid"],[1,"road-label"],[1,"road-list",{"lines":[1]}],[1,"road-row"],[1,"road-toolbar",{"color":[1]}],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]}]]],["road-counter.cjs",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[1],"max":[1],"step":[1],"value":[2],"size":[1]}]]],["road-plate-number.cjs",[[2,"road-plate-number",{"country":[1],"placeholder":[1],"value":[1032],"motorbike":[4]}]]],["road-accordion.cjs",[[1,"road-accordion",{"isOpen":[1028,"is-open"]}]]],["road-carousel.cjs",[[4,"road-carousel",{"options":[8],"pager":[4],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]}]]],["road-chip.cjs",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["road-collapse.cjs",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["road-dialog.cjs",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["road-modal.cjs",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["road-rating.cjs",[[1,"road-rating",{"rate":[2],"reviews":[2],"reviewsText":[1,"reviews-text"]}]]],["road-toast.cjs",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"position":[1],"open":[64],"close":[64]}]]],["road-alert.cjs",[[1,"road-alert",{"color":[1]}]]],["road-autocomplete.cjs",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[4,"click","onClickOutside"]]]]],["road-avatar.cjs",[[1,"road-avatar"]]],["road-card.cjs",[[1,"road-card",{"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["road-carousel-item.cjs",[[4,"road-carousel-item"]]],["road-checkbox.cjs",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"disabled":[4],"value":[1],"label":[1],"inverse":[4],"error":[1]}]]],["road-dropdown.cjs",[[1,"road-dropdown",{"isOpen":[1028,"is-open"]}]]],["road-flap.cjs",[[1,"road-flap",{"color":[1]}]]],["road-img.cjs",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]}]]],["road-navbar.cjs",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"]]]]],["road-navbar-item.cjs",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"]]]]],["road-progress.cjs",[[1,"road-progress",{"value":[2],"color":[1]}]]],["road-radio.cjs",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"inverse":[4],"error":[4],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"]]]]],["road-radio-group.cjs",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025]}]]],["road-range.cjs",[[2,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"]}]]],["road-select.cjs",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"label":[1],"error":[1],"value":[1032]}]]],["road-select-filter.cjs",[[6,"road-select-filter",{"options":[16],"parameters":[8],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadChange","handleChange"],[4,"click","onClickOutside"]]]]],["road-skeleton.cjs",[[1,"road-skeleton"]]],["road-spinner.cjs",[[1,"road-spinner"]]],["road-switch.cjs",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]}]]],["road-tab.cjs",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["road-tab-bar.cjs",[[1,"road-tab-bar",{"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]}]]],["road-tab-button.cjs",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"]]]]],["road-table.cjs",[[6,"road-table"]]],["road-tabs.cjs",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["road-text.cjs",[[1,"road-text",{"color":[1]}]]],["road-textarea.cjs",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1]}]]],["road-toolbar-title.cjs",[[1,"road-toolbar-title"]]],["road-tooltip.cjs",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["road-input.cjs",[[2,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"type":[1],"value":[1032],"label":[1],"error":[1],"debounce":[2]}]]],["road-input-group.cjs",[[1,"road-input-group"]]]], options);
+  return index.bootstrapLazy([["road-badge_11.cjs",[[1,"road-item",{"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-badge",{"color":[1],"bubble":[4]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[33,"road-drawer",{"isOpen":[1028,"is-open"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64],"back":[64]},[[4,"keyup","onEscape"]]],[1,"road-col"],[1,"road-grid"],[1,"road-label"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]}]]],["road-duration.cjs",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["road-counter.cjs",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[1],"max":[1],"step":[1],"value":[2],"size":[1]}]]],["road-plate-number.cjs",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]}]]],["road-accordion.cjs",[[1,"road-accordion",{"isOpen":[1028,"is-open"]}]]],["road-carousel.cjs",[[4,"road-carousel",{"options":[8],"pager":[4],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]}]]],["road-chip.cjs",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["road-collapse.cjs",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["road-dialog.cjs",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["road-modal.cjs",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["road-rating.cjs",[[1,"road-rating",{"rate":[2],"reviews":[2],"reviewsText":[1,"reviews-text"]}]]],["road-toast.cjs",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"position":[1],"open":[64],"close":[64]}]]],["road-alert.cjs",[[1,"road-alert",{"color":[1]}]]],["road-autocomplete.cjs",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["road-avatar.cjs",[[1,"road-avatar"]]],["road-carousel-item.cjs",[[4,"road-carousel-item"]]],["road-checkbox.cjs",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"disabled":[4],"value":[1],"label":[1],"inverse":[4],"error":[1]}]]],["road-dropdown.cjs",[[1,"road-dropdown",{"isOpen":[1028,"is-open"]}]]],["road-flap.cjs",[[1,"road-flap",{"color":[1]}]]],["road-img.cjs",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]}]]],["road-navbar.cjs",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]]]]],["road-navbar-item.cjs",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]]]]],["road-progress.cjs",[[1,"road-progress",{"value":[2],"color":[1]}]]],["road-radio.cjs",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"inverse":[4],"error":[4],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["road-radio-group.cjs",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025]}]]],["road-range.cjs",[[2,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"]}]]],["road-select.cjs",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"label":[1],"error":[1],"value":[1032]}]]],["road-select-filter.cjs",[[6,"road-select-filter",{"options":[16],"parameters":[8],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[4,"click","onClickOutside"]]]]],["road-skeleton.cjs",[[1,"road-skeleton"]]],["road-spinner.cjs",[[1,"road-spinner"]]],["road-switch.cjs",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]}]]],["road-tab.cjs",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["road-tab-bar.cjs",[[1,"road-tab-bar",{"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]}]]],["road-tab-button.cjs",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["road-table.cjs",[[6,"road-table"]]],["road-tabs.cjs",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["road-text.cjs",[[1,"road-text",{"color":[1]}]]],["road-textarea.cjs",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1]}]]],["road-toolbar-title.cjs",[[1,"road-toolbar-title"]]],["road-tooltip.cjs",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["road-card.cjs",[[1,"road-card",{"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["road-input.cjs",[[2,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"type":[1],"value":[1032],"label":[1],"error":[1],"debounce":[2]}]]],["road-input-group.cjs",[[1,"road-input-group"]]]], options);
   });
 };
 

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

@@ -9,6 +9,7 @@ const autocompleteCss = ".sc-road-autocomplete-h{position:relative;display:block
 let Autocomplete = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadselected = index.createEvent(this, "roadselected", 7);
     this.roadSelected = index.createEvent(this, "roadSelected", 7);
     this.visible = false;
     /**
@@ -18,6 +19,10 @@ let Autocomplete = class {
     this.onClick = (value, label) => {
       this.el.querySelector('road-input').value = value;
       this.visible = false;
+      this.roadselected.emit({
+        value: value.toString(),
+        label: label,
+      });
       this.roadSelected.emit({
         value: value.toString(),
         label: label,

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

@@ -30,7 +30,9 @@ const buttonCss = ":host{--border-radius:0.25rem;--font-size:1rem;--margin-botto
 let Button = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadfocus = index.createEvent(this, "roadfocus", 7);
     this.roadFocus = index.createEvent(this, "roadFocus", 7);
+    this.roadblur = index.createEvent(this, "roadblur", 7);
     this.roadBlur = index.createEvent(this, "roadBlur", 7);
     /**
      * The color to use from your application's color palette.
@@ -74,9 +76,11 @@ let Button = class {
       }
     };
     this.onFocus = () => {
+      this.roadfocus.emit();
       this.roadFocus.emit();
     };
     this.onBlur = () => {
+      this.roadblur.emit();
       this.roadBlur.emit();
     };
   }

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

@@ -9,6 +9,7 @@ const cardCss = ":host{position:relative;-webkit-box-sizing:border-box;box-sizin
 let Card = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadcardclick = index.createEvent(this, "roadcardclick", 7);
     this.roadCardClick = index.createEvent(this, "roadCardClick", 7);
     /**
      * If `true`, a button tag will be rendered and the card will be tappable.
@@ -19,12 +20,16 @@ let Card = class {
      */
     this.type = 'button';
     this.onClick = () => {
-      var _a;
+      var _a, _b;
       if (this.value !== undefined) {
-        this.roadCardClick.emit({
+        this.roadcardclick.emit({
           value: this.value,
           label: (_a = this.el.querySelector('road-label')) === null || _a === void 0 ? void 0 : _a.textContent,
         });
+        this.roadCardClick.emit({
+          value: this.value,
+          label: (_b = this.el.querySelector('road-label')) === null || _b === void 0 ? void 0 : _b.textContent,
+        });
       }
     };
   }

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

@@ -10,22 +10,22 @@ const carouselCss = "@font-face{font-family:swiper-icons;src:url('data:applicati
 let Carousel = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.roadSlidesDidLoad = index.createEvent(this, "roadSlidesDidLoad", 7);
-    this.roadSlideTap = index.createEvent(this, "roadSlideTap", 7);
-    this.roadSlideDoubleTap = index.createEvent(this, "roadSlideDoubleTap", 7);
-    this.roadSlideWillChange = index.createEvent(this, "roadSlideWillChange", 7);
-    this.roadSlideDidChange = index.createEvent(this, "roadSlideDidChange", 7);
-    this.roadSlideNextStart = index.createEvent(this, "roadSlideNextStart", 7);
-    this.roadSlidePrevStart = index.createEvent(this, "roadSlidePrevStart", 7);
-    this.roadSlideNextEnd = index.createEvent(this, "roadSlideNextEnd", 7);
-    this.roadSlidePrevEnd = index.createEvent(this, "roadSlidePrevEnd", 7);
-    this.roadSlideTransitionStart = index.createEvent(this, "roadSlideTransitionStart", 7);
-    this.roadSlideTransitionEnd = index.createEvent(this, "roadSlideTransitionEnd", 7);
-    this.roadSlideDrag = index.createEvent(this, "roadSlideDrag", 7);
-    this.roadSlideReachStart = index.createEvent(this, "roadSlideReachStart", 7);
-    this.roadSlideReachEnd = index.createEvent(this, "roadSlideReachEnd", 7);
-    this.roadSlideTouchStart = index.createEvent(this, "roadSlideTouchStart", 7);
-    this.roadSlideTouchEnd = index.createEvent(this, "roadSlideTouchEnd", 7);
+    this.roadslidesdidload = index.createEvent(this, "roadslidesdidload", 7);
+    this.roadslidetap = index.createEvent(this, "roadslidetap", 7);
+    this.roadslidedoubletap = index.createEvent(this, "roadslidedoubletap", 7);
+    this.roadslidewillchange = index.createEvent(this, "roadslidewillchange", 7);
+    this.roadslidedidchange = index.createEvent(this, "roadslidedidchange", 7);
+    this.roadslidenextstart = index.createEvent(this, "roadslidenextstart", 7);
+    this.roadslideprevstart = index.createEvent(this, "roadslideprevstart", 7);
+    this.roadslidenextend = index.createEvent(this, "roadslidenextend", 7);
+    this.roadslideprevend = index.createEvent(this, "roadslideprevend", 7);
+    this.roadslidetransitionstart = index.createEvent(this, "roadslidetransitionstart", 7);
+    this.roadslidetransitionend = index.createEvent(this, "roadslidetransitionend", 7);
+    this.roadslidedrag = index.createEvent(this, "roadslidedrag", 7);
+    this.roadslidereachstart = index.createEvent(this, "roadslidereachstart", 7);
+    this.roadslidereachend = index.createEvent(this, "roadslidereachend", 7);
+    this.roadslidetouchstart = index.createEvent(this, "roadslidetouchstart", 7);
+    this.roadslidetouchend = index.createEvent(this, "roadslidetouchend", 7);
     this.swiperReady = false;
     this.swiper = new Promise(resolve => {
       this.readySwiper = resolve;
@@ -349,39 +349,39 @@ let Carousel = class {
       on: {
         init: () => {
           setTimeout(() => {
-            this.roadSlidesDidLoad.emit();
+            this.roadslidesdidload.emit();
           }, 20);
         },
         // @ts-ignore
-        slideChangeTransitionStart: this.roadSlideWillChange.emit,
+        slideChangeTransitionStart: this.roadslidewillchange.emit,
         // @ts-ignore
-        slideChangeTransitionEnd: this.roadSlideDidChange.emit,
+        slideChangeTransitionEnd: this.roadslidedidchange.emit,
         // @ts-ignore
-        slideNextTransitionStart: this.roadSlideNextStart.emit,
+        slideNextTransitionStart: this.roadslidenextstart.emit,
         // @ts-ignore
-        slidePrevTransitionStart: this.roadSlidePrevStart.emit,
+        slidePrevTransitionStart: this.roadslideprevstart.emit,
         // @ts-ignore
-        slideNextTransitionEnd: this.roadSlideNextEnd.emit,
+        slideNextTransitionEnd: this.roadslidenextend.emit,
         // @ts-ignore
-        slidePrevTransitionEnd: this.roadSlidePrevEnd.emit,
+        slidePrevTransitionEnd: this.roadslideprevend.emit,
         // @ts-ignore
-        transitionStart: this.roadSlideTransitionStart.emit,
+        transitionStart: this.roadslidetransitionstart.emit,
         // @ts-ignore
-        transitionEnd: this.roadSlideTransitionEnd.emit,
+        transitionEnd: this.roadslidetransitionend.emit,
         // @ts-ignore
-        sliderMove: this.roadSlideDrag.emit,
+        sliderMove: this.roadslidedrag.emit,
         // @ts-ignore
-        reachBeginning: this.roadSlideReachStart.emit,
+        reachBeginning: this.roadslidereachstart.emit,
         // @ts-ignore
-        reachEnd: this.roadSlideReachEnd.emit,
+        reachEnd: this.roadslidereachend.emit,
         // @ts-ignore
-        touchStart: this.roadSlideTouchStart.emit,
+        touchStart: this.roadslidetouchstart.emit,
         // @ts-ignore
-        touchEnd: this.roadSlideTouchEnd.emit,
+        touchEnd: this.roadslidetouchend.emit,
         // @ts-ignore
-        tap: this.roadSlideTap.emit,
+        tap: this.roadslidetap.emit,
         // @ts-ignore
-        doubleTap: this.roadSlideDoubleTap.emit,
+        doubleTap: this.roadslidedoubletap.emit,
       },
     };
     const customEvents = (!!this.options && !!this.options.on) ? this.options.on : {};

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

@@ -10,8 +10,11 @@ const checkboxCss = ".sc-road-checkbox-h{position:relative;display:block;margin-
 let Checkbox = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadchange = index.createEvent(this, "roadchange", 7);
     this.roadChange = index.createEvent(this, "roadChange", 7);
+    this.roadfocus = index.createEvent(this, "roadfocus", 7);
     this.roadFocus = index.createEvent(this, "roadFocus", 7);
+    this.roadblur = index.createEvent(this, "roadblur", 7);
     this.roadBlur = index.createEvent(this, "roadBlur", 7);
     /**
      * The id of checkbox
@@ -49,13 +52,19 @@ let Checkbox = class {
       this.checked = !this.checked;
     };
     this.onFocus = () => {
+      this.roadfocus.emit();
       this.roadFocus.emit();
     };
     this.onBlur = () => {
+      this.roadblur.emit();
       this.roadBlur.emit();
     };
   }
   checkedChanged(isChecked) {
+    this.roadchange.emit({
+      checked: isChecked,
+      value: this.value,
+    });
     this.roadChange.emit({
       checked: isChecked,
       value: this.value,

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

@@ -9,7 +9,9 @@ const counterCss = ".sc-road-counter-h{--counter-margin-bottom:1rem;display:bloc
 let Counter = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadincrease = index.createEvent(this, "roadincrease", 7);
     this.roadIncrease = index.createEvent(this, "roadIncrease", 7);
+    this.roaddecrease = index.createEvent(this, "roaddecrease", 7);
     this.roadDecrease = index.createEvent(this, "roadDecrease", 7);
     /**
      * The id of counter
@@ -21,10 +23,12 @@ let Counter = class {
     this.value = 1;
     this.increase = () => {
       this.el.querySelector('input').stepUp();
+      this.roadincrease.emit();
       this.roadIncrease.emit();
     };
     this.decrease = () => {
       this.el.querySelector('input').stepDown();
+      this.roaddecrease.emit();
       this.roadDecrease.emit();
     };
   }

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

@@ -0,0 +1,60 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-9b63596c.js');
+
+const durationCss = ":host{display:block}road-drawer{--background:var(--background-second)}.duration-values{-ms-flex-wrap:nowrap;flex-wrap:nowrap;width:100%;padding:2.625rem 0 2.625rem 3rem;-webkit-scroll-snap-type:x proximity;-ms-scroll-snap-type:x proximity;scroll-snap-type:x proximity;overflow:scroll}.duration-values>road-col:first-child{scroll-snap-align:center}.duration-values>road-col:not(:first-child){scroll-snap-align:start}road-card{--margin-bottom:0}road-card::part(native){padding:1rem}";
+
+let Duration = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.roadselected = index.createEvent(this, "roadselected", 7);
+    /**
+     * Set isOpen property to true to open the duration widget
+     */
+    this.isOpen = false;
+    /**
+     * title of the widget
+     */
+    this.header = 'duration';
+    /**
+     * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.
+     */
+    this.min = 15;
+    /**
+     * The maximum value, which must not be less than its minimum (min attribute) value in minutes.
+     */
+    this.max = 300;
+    /**
+     * Works with the min and max attributes to limit the increments at which a value can be set in minutes.
+     */
+    this.step = 15;
+  }
+  handleClick(event) {
+    this.roadselected.emit({
+      value: event.detail.value.toString(),
+      label: event.detail.label,
+    });
+    this.close();
+  }
+  /**
+   * Open the widget
+   */
+  async open() {
+    this.isOpen = true;
+  }
+  /**
+   * Close the widget
+   */
+  async close() {
+    this.isOpen = false;
+  }
+  render() {
+    return (index.h("road-drawer", { "is-open": this.isOpen, position: "bottom", "drawer-title": this.header }, index.h("road-grid", null, index.h("road-row", { class: "duration-values" }, Array(Math.floor((this.max - this.min) / this.step) + 1).fill(this.min).map(((item, index) => (item + index * this.step))).map(item => index.h("road-col", { class: "col-3 col-md-2" }, index.h("road-card", { button: true, value: item }, index.h("road-label", null, Math.floor(item / 60).toLocaleString("en-GB", { minimumIntegerDigits: 2, useGrouping: false }), ":", (item % 60).toLocaleString("en-GB", { minimumIntegerDigits: 2, useGrouping: false })))))))));
+  }
+  get el() { return index.getElement(this); }
+};
+Duration.style = durationCss;
+
+exports.road_duration = Duration;

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

@@ -9,13 +9,18 @@ const imgCss = ":host{display:block;-o-object-fit:contain;object-fit:contain}.na
 let Img = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadimgwillload = index.createEvent(this, "roadimgwillload", 7);
     this.roadImgWillLoad = index.createEvent(this, "roadImgWillLoad", 7);
+    this.roadimgdidload = index.createEvent(this, "roadimgdidload", 7);
     this.roadImgDidLoad = index.createEvent(this, "roadImgDidLoad", 7);
+    this.roaderror = index.createEvent(this, "roaderror", 7);
     this.roadError = index.createEvent(this, "roadError", 7);
     this.onLoad = () => {
+      this.roadimgdidload.emit();
       this.roadImgDidLoad.emit();
     };
     this.onError = () => {
+      this.roaderror.emit();
       this.roadError.emit();
     };
   }
@@ -53,6 +58,7 @@ let Img = class {
   load() {
     this.loadError = this.onError;
     this.loadSrc = this.src;
+    this.roadimgwillload.emit();
     this.roadImgWillLoad.emit();
   }
   removeIO() {

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

@@ -23,9 +23,13 @@ const debounce = (func, wait = 0) => {
 let Input = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadinput = index.createEvent(this, "roadinput", 7);
     this.roadInput = index.createEvent(this, "roadInput", 7);
+    this.roadchange = index.createEvent(this, "roadchange", 7);
     this.roadChange = index.createEvent(this, "roadChange", 7);
+    this.roadblur = index.createEvent(this, "roadblur", 7);
     this.roadBlur = index.createEvent(this, "roadBlur", 7);
+    this.roadfocus = index.createEvent(this, "roadfocus", 7);
     this.roadFocus = index.createEvent(this, "roadFocus", 7);
     /**
      * The id of input
@@ -88,22 +92,27 @@ let Input = class {
       if (input) {
         this.value = input.value || '';
       }
+      this.roadinput.emit(ev);
       this.roadInput.emit(ev);
     };
     this.onBlur = () => {
+      this.roadblur.emit();
       this.roadBlur.emit();
     };
     this.onFocus = () => {
+      this.roadfocus.emit();
       this.roadFocus.emit();
     };
   }
   debounceChanged() {
+    this.roadchange = debounceEvent(this.roadchange, this.debounce);
     this.roadChange = debounceEvent(this.roadChange, this.debounce);
   }
   /**
    * Update the native input element when the value changes
    */
   valueChanged() {
+    this.roadchange.emit({ value: this.value == null ? this.value : this.value.toString() });
     this.roadChange.emit({ value: this.value == null ? this.value : this.value.toString() });
   }
   getValue() {

package/dist/cjs/road-navbar-item.cjs.entry.js

@@ -9,6 +9,7 @@ const navbarItemCss = ":host{-ms-flex:1 1 0%;flex:1 1 0%;-ms-flex-direction:colu
 let NavbarItem = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadnavbaritemclick = index.createEvent(this, "roadnavbaritemclick", 7);
     this.roadNavbarItemClick = index.createEvent(this, "roadNavbarItemClick", 7);
     /**
      * If `true`, the user cannot interact with the tab button.
@@ -33,6 +34,11 @@ let NavbarItem = class {
   selectTab(ev) {
     if (this.tab !== undefined) {
       if (!this.disabled) {
+        this.roadnavbaritemclick.emit({
+          tab: this.tab,
+          href: this.href,
+          selected: this.selected,
+        });
         this.roadNavbarItemClick.emit({
           tab: this.tab,
           href: this.href,

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

@@ -10,10 +10,14 @@ const navbarCss = ":host{--z-index:10;position:fixed;bottom:0;z-index:var(--z-in
 let Navbar = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadnavbarchanged = index.createEvent(this, "roadnavbarchanged", 7);
     this.roadNavbarChanged = index.createEvent(this, "roadNavbarChanged", 7);
   }
   selectedTabChanged() {
     if (this.selectedTab !== undefined) {
+      this.roadnavbarchanged.emit({
+        tab: this.selectedTab,
+      });
       this.roadNavbarChanged.emit({
         tab: this.selectedTab,
       });

package/dist/cjs/road-plate-number.cjs.entry.js

@@ -5,14 +5,18 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-9b63596c.js');
 const index$1 = require('./index-0181f02a.js');
 
-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:3rem;background:var(--info-text)}.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:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:0;margin-right:0;color:var(--info-contrast);border-radius:3px 0 0 3px}.plate-number-icon.sc-road-plate-number{width:1.25rem;height:1.25rem;color:#f3db53}.plate-number-location.sc-road-plate-number{font-size:0.875rem;font-weight:700}.plate-number-end.sc-road-plate-number{border-radius:0 3px 3px 0}.plate-number-input.sc-road-plate-number{position:relative;display:block;height:3rem;margin:0;font-family:Oswald, sans-serif;font-size:2rem;color:var(--text);text-align:center;background:var(--white);border:1px solid var(--border-form);border-radius:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.plate-number-input.sc-road-plate-number::-webkit-input-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number::-moz-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number:-ms-input-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number::-ms-input-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number::placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number:focus{border-color:var(--secondary);outline:0}.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{-ms-flex-align:start;align-items:flex-start;height:6rem;padding:0}.motorbike-plate.sc-road-plate-number .plate-number-start.sc-road-plate-number{border-radius:3px 0 0}.motorbike-plate.sc-road-plate-number .plate-number-end.sc-road-plate-number{border-radius:0 3px 0 0}";
+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:3rem;background:var(--info-text)}.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:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:0;margin-right:0;color:var(--info-contrast);border-radius:3px 0 0 3px}.plate-number-icon.sc-road-plate-number{width:1.25rem;height:1.25rem;color:#f3db53}.plate-number-location.sc-road-plate-number{font-size:0.875rem;font-weight:700}.plate-number-end.sc-road-plate-number{border-radius:0 3px 3px 0}.plate-number-input.sc-road-plate-number{position:relative;display:block;height:3rem;margin:0;font-family:var(--font, sans-serif);font-size:1.75rem;font-weight:700;color:var(--text);text-align:center;background:var(--white);border:1px solid var(--border-form);border-radius:0;outline:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.plate-number-input.sc-road-plate-number::-webkit-input-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number::-moz-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number:-ms-input-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number::-ms-input-placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number::placeholder{color:var(--border);opacity:1}.plate-number-input.sc-road-plate-number:disabled,.plate-number-input[readonly].sc-road-plate-number{color:var(--text);cursor:not-allowed;background:var(--background);border-color:var(--background);opacity:1}.plate-number-input.sc-road-plate-number:not([readonly]):focus{border-color:var(--secondary);outline:0}.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{-ms-flex-align:start;align-items:flex-start;height:6rem;padding:0}.motorbike-plate.sc-road-plate-number .plate-number-start.sc-road-plate-number{border-radius:3px 0 0}.motorbike-plate.sc-road-plate-number .plate-number-end.sc-road-plate-number{border-radius:0 3px 0 0}";
 
 let PlateNumber = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadinput = index.createEvent(this, "roadinput", 7);
     this.roadInput = index.createEvent(this, "roadInput", 7);
+    this.roadchange = index.createEvent(this, "roadchange", 7);
     this.roadChange = index.createEvent(this, "roadChange", 7);
+    this.roadblur = index.createEvent(this, "roadblur", 7);
     this.roadBlur = index.createEvent(this, "roadBlur", 7);
+    this.roadfocus = index.createEvent(this, "roadfocus", 7);
     this.roadFocus = index.createEvent(this, "roadFocus", 7);
     this.countries = [
       {
@@ -50,6 +54,14 @@ let PlateNumber = class {
      * country of the plate
      */
     this.country = 'FR';
+    /**
+     * If `true`, the user cannot interact with the input.
+     */
+    this.disabled = false;
+    /**
+     * If `true`, the user cannot modify the value.
+     */
+    this.readonly = false;
     /**
      * The value of the input.
      */
@@ -59,12 +71,15 @@ let PlateNumber = class {
       if (input) {
         this.value = input.value.toUpperCase() || '';
       }
+      this.roadinput.emit(ev);
       this.roadInput.emit(ev);
     };
     this.onBlur = () => {
+      this.roadblur.emit();
       this.roadBlur.emit();
     };
     this.onFocus = () => {
+      this.roadfocus.emit();
       this.roadFocus.emit();
     };
   }
@@ -72,6 +87,7 @@ let PlateNumber = class {
    * Update the native input element when the value changes
    */
   valueChanged() {
+    this.roadchange.emit({ value: this.value == null ? this.value : this.value.toString() });
     this.roadChange.emit({ value: this.value == null ? this.value : this.value.toString() });
   }
   getValue() {
@@ -84,8 +100,8 @@ let PlateNumber = class {
     const motorbikeClass = this.motorbike ? 'motorbike-plate' : '';
     return (index.h("road-input-group", { class: `plate-number ${motorbikeClass}` }, index.h("label", { slot: "prepend", class: "input-group-prepend" }, index.h("div", { class: "plate-number-start" }, index.h("road-icon", { class: "plate-number-icon", icon: index$1.licensePlateStarEu }), index.h("div", { class: "plate-number-location" }, this.countries
       .filter(item => item.country === this.country)[0].letter))), this.motorbike
-      ? (index.h("textarea", { class: "form-control plate-number-input mb-0", placeholder: this.placeholder != null ? this.placeholder : this.countries.filter(item => item.country === this.country)[0].placeholder, maxlength: "9", rows: 2, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus }))
-      : (index.h("input", { class: "plate-number-input mb-0", placeholder: this.placeholder != null ? this.placeholder : this.countries.filter(item => item.country === this.country)[0].placeholder, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus })), index.h("label", { slot: "append", class: "input-group-append" }, index.h("div", { class: "plate-number-end" }))));
+      ? (index.h("textarea", { class: "form-control plate-number-input mb-0", disabled: this.disabled, placeholder: this.placeholder != null ? this.placeholder : this.countries.filter(item => item.country === this.country)[0].placeholder, readOnly: this.readonly, maxlength: "9", rows: 2, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus }))
+      : (index.h("input", { class: "plate-number-input mb-0", disabled: this.disabled, placeholder: this.placeholder != null ? this.placeholder : this.countries.filter(item => item.country === this.country)[0].placeholder, readOnly: this.readonly, value: value, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus })), index.h("label", { slot: "append", class: "input-group-append" }, index.h("div", { class: "plate-number-end" }))));
   }
   static get assetsDirs() { return ["fonts"]; }
   static get watchers() { return {

package/dist/cjs/road-radio-group.cjs.entry.js

@@ -9,6 +9,7 @@ const radioGroupCss = ".sc-road-radio-group-h{--asterisk-color:var(--text);posit
 let RadioGroup = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadchange = index.createEvent(this, "roadchange", 7);
     this.roadChange = index.createEvent(this, "roadChange", 7);
     /**
      * The id of checkbox
@@ -46,6 +47,7 @@ let RadioGroup = class {
     };
   }
   valueChanged(value) {
+    this.roadchange.emit({ value });
     this.roadChange.emit({ value });
   }
   errorChanged() {

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

@@ -10,7 +10,9 @@ const radioCss = ".sc-road-radio-h{position:relative;display:block;margin-bottom
 let Radio = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadfocus = index.createEvent(this, "roadfocus", 7);
     this.roadFocus = index.createEvent(this, "roadFocus", 7);
+    this.roadblur = index.createEvent(this, "roadblur", 7);
     this.roadBlur = index.createEvent(this, "roadBlur", 7);
     this.radioGroup = null;
     /**
@@ -51,9 +53,11 @@ let Radio = class {
       }
     };
     this.onFocus = () => {
+      this.roadfocus.emit();
       this.roadFocus.emit();
     };
     this.onBlur = () => {
+      this.roadblur.emit();
       this.roadBlur.emit();
     };
   }

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

@@ -9,6 +9,7 @@ const rangeCss = ".sc-road-range-h{display:block}.form-range.sc-road-range{posit
 let Range = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadchange = index.createEvent(this, "roadchange", 7);
     this.roadChange = index.createEvent(this, "roadChange", 7);
     /**
      * The id of range
@@ -36,6 +37,7 @@ let Range = class {
    * Update the native input element when the value changes
    */
   valueChanged() {
+    this.roadchange.emit({ value: this.value == null ? this.value : this.value.toString() });
     this.roadChange.emit({ value: this.value == null ? this.value : this.value.toString() });
   }
   getValue() {

package/dist/cjs/road-select-filter.cjs.entry.js

@@ -1787,6 +1787,7 @@ const selectFilterCss = ".sc-road-select-filter-h{position:relative;display:bloc
 let SelectFilter = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadselected = index.createEvent(this, "roadselected", 7);
     this.roadSelected = index.createEvent(this, "roadSelected", 7);
     this.isOpen = false;
     this.currentValue = '';
@@ -1810,6 +1811,10 @@ let SelectFilter = class {
     this.onClick = (value, label) => {
       this.el.querySelector('road-input').value = label;
       this.isOpen = false;
+      this.roadselected.emit({
+        value: value.toString(),
+        label: label,
+      });
       this.roadSelected.emit({
         value: value.toString(),
         label: label,

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

@@ -9,8 +9,11 @@ const selectCss = ".sc-road-select-h{position:relative;display:block;margin-bott
 let Select = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
+    this.roadchange = index.createEvent(this, "roadchange", 7);
     this.roadChange = index.createEvent(this, "roadChange", 7);
+    this.roadfocus = index.createEvent(this, "roadfocus", 7);
     this.roadFocus = index.createEvent(this, "roadFocus", 7);
+    this.roadblur = index.createEvent(this, "roadblur", 7);
     this.roadBlur = index.createEvent(this, "roadBlur", 7);
     /**
      * The id of select
@@ -52,13 +55,18 @@ let Select = class {
       }
     };
     this.onBlur = () => {
+      this.roadblur.emit();
       this.roadBlur.emit();
     };
     this.onFocus = () => {
+      this.roadfocus.emit();
       this.roadFocus.emit();
     };
   }
   valueChanged() {
+    this.roadchange.emit({
+      value: this.value,
+    });
     this.roadChange.emit({
       value: this.value,
     });