@roadtrip/components 2.24.1 → 2.25.0

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

@@ -11,7 +11,7 @@ let Skeleton = class {
     index.registerInstance(this, hostRef);
   }
   render() {
-    return (index.h(index.Host, null, index.h("span", null, "\u00A0")));
+    return (index.h("span", null, "\u00A0"));
   }
 };
 Skeleton.style = skeletonCss;

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

@@ -11,7 +11,7 @@ let Spinner = class {
     index.registerInstance(this, hostRef);
   }
   render() {
-    return (index.h(index.Host, null, index.h("svg", { class: "spinner", viewBox: "25 25 50 50" }, index.h("circle", { class: "spinner-circle", cx: "50", cy: "50", r: "20" }))));
+    return (index.h("svg", { class: "spinner", viewBox: "25 25 50 50" }, index.h("circle", { class: "spinner-circle", cx: "50", cy: "50", r: "20" })));
   }
 };
 Spinner.style = spinnerCss;

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

@@ -11,7 +11,7 @@ let Table = class {
     index.registerInstance(this, hostRef);
   }
   render() {
-    return (index.h(index.Host, null, index.h("slot", null)));
+    return (index.h("slot", null));
   }
 };
 Table.style = tableCss;

package/dist/cjs/road-toolbar-title.cjs.entry.js

@@ -11,7 +11,7 @@ let ToolbarTitle = class {
     index.registerInstance(this, hostRef);
   }
   render() {
-    return (index.h(index.Host, null, index.h("div", { class: "toolbar-title" }, index.h("slot", null))));
+    return (index.h("div", { class: "toolbar-title" }, index.h("slot", null)));
   }
 };
 ToolbarTitle.style = toolbarTitleCss;

package/dist/cjs/roadtrip.cjs.js

@@ -83,5 +83,5 @@ const patchDynamicImport = (base, orgScriptElm) => {
 };
 
 patchBrowser().then(options => {
-  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],"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",[[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);
 });

package/dist/collection/components/autocomplete/autocomplete.js

@@ -14,7 +14,7 @@ export class Autocomplete {
       this.visible = false;
       this.roadSelected.emit({
         value: value.toString(),
-        label: label
+        label: label,
       });
     };
   }

package/dist/collection/components/autocomplete/autocomplete.stories.js

@@ -8,6 +8,7 @@ export default {
       handles: ['roadChange', 'roadBlur', 'roadFocus'],
     },
   },
+  decorators: [(story) => html`<div style="margin-bottom: 20rem">${story()}</div>`],
 };
 
 export const Playground = (args) => {
@@ -36,9 +37,6 @@ export const Playground = (args) => {
       
     ></road-input>
   </road-autocomplete>
-
-  <!-- br are here only until we find how to add a margin only for Storybook docs block, do not copy them -->
-  <br><br><br><br><br><br><br><br><br><br><br><br><br>
   `;
 };
 Playground.argTypes = {

package/dist/collection/components/avatar/avatar.js

@@ -1,11 +1,10 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 /**
  * @slot  - Image of the avatar.
  */
 export class Avatar {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h("slot", null));
   }
   static get is() { return "road-avatar"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/card/card.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Prop, Event, Element } from '@stencil/core';
+import { Component, h, Prop, Event, Element } from '@stencil/core';
 /**
  * @slot  - Content of the card.
  *
@@ -48,7 +48,7 @@ export class Card {
       h("slot", null)));
   }
   render() {
-    return (h(Host, null, this.renderCard()));
+    return (this.renderCard());
   }
   static get is() { return "road-card"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/col/col.js

@@ -1,11 +1,10 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 /**
  * @slot  - Content of the column.
  */
 export class Col {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h("slot", null));
   }
   static get is() { return "road-col"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/counter/counter.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Prop, Element, Event } from '@stencil/core';
+import { Component, h, Prop, Element, Event } from '@stencil/core';
 export class Counter {
   constructor() {
     /**
@@ -19,11 +19,10 @@ export class Counter {
     };
   }
   render() {
-    return (h(Host, null,
-      h("road-input-group", { class: this.size && `counter-${this.size}` },
-        h("road-button", { slot: "prepend", size: this.size, onClick: this.decrease }, "-"),
-        h("road-input", { type: "number", min: this.min, max: this.max, step: this.step, value: this.value }),
-        h("road-button", { slot: "append", size: this.size, onClick: this.increase }, "+"))));
+    return (h("road-input-group", { class: this.size && `counter-${this.size}` },
+      h("road-button", { slot: "prepend", size: this.size, onClick: this.decrease }, "-"),
+      h("road-input", { type: "number", min: this.min, max: this.max, step: this.step, value: this.value }),
+      h("road-button", { slot: "append", size: this.size, onClick: this.increase }, "+")));
   }
   static get is() { return "road-counter"; }
   static get encapsulation() { return "scoped"; }

package/dist/collection/components/dropdown/dropdown.stories.js

@@ -3,6 +3,7 @@ import { html } from 'lit-html';
 export default {
   title: 'Expand/Dropdown',
   component: 'road-dropdown',
+  decorators: [(story) => html`<div style="margin-bottom: 20rem">${story()}</div>`],
 };
 
 export const Playground = (args) => html`

package/dist/collection/components/grid/grid.js

@@ -1,11 +1,10 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 /**
  * @slot  - Content to add row components.
  */
 export class Grid {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h("slot", null));
   }
   static get is() { return "road-grid"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/input/input.js

@@ -3,7 +3,7 @@ const debounceEvent = (event, wait) => {
   const original = event._original || event;
   return {
     _original: event,
-    emit: debounce(original.emit.bind(original), wait)
+    emit: debounce(original.emit.bind(original), wait),
   };
 };
 const debounce = (func, wait = 0) => {

package/dist/collection/components/label/label.js

@@ -1,11 +1,10 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 /**
  * @slot  - Content of the label.
  */
 export class Label {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h("slot", null));
   }
   static get is() { return "road-label"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/plate-number/plate-number.js

@@ -1,4 +1,4 @@
-import { Component, Host, h, Prop, Event, Watch } from '@stencil/core';
+import { Component, h, Prop, Event, Watch } from '@stencil/core';
 import { licensePlateStarEu } from '../../../icons';
 export class PlateNumber {
   constructor() {
@@ -70,18 +70,17 @@ export class PlateNumber {
   render() {
     const value = this.getValue();
     const motorbikeClass = this.motorbike ? 'motorbike-plate' : '';
-    return (h(Host, null,
-      h("road-input-group", { class: `plate-number ${motorbikeClass}` },
-        h("label", { slot: "prepend", class: "input-group-prepend" },
-          h("div", { class: "plate-number-start" },
-            h("road-icon", { class: "plate-number-icon", icon: licensePlateStarEu }),
-            h("div", { class: "plate-number-location" }, this.countries
-              .filter(item => item.country === this.country)[0].letter))),
-        this.motorbike
-          ? (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 }))
-          : (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 })),
-        h("label", { slot: "append", class: "input-group-append" },
-          h("div", { class: "plate-number-end" })))));
+    return (h("road-input-group", { class: `plate-number ${motorbikeClass}` },
+      h("label", { slot: "prepend", class: "input-group-prepend" },
+        h("div", { class: "plate-number-start" },
+          h("road-icon", { class: "plate-number-icon", icon: licensePlateStarEu }),
+          h("div", { class: "plate-number-location" }, this.countries
+            .filter(item => item.country === this.country)[0].letter))),
+      this.motorbike
+        ? (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 }))
+        : (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 })),
+      h("label", { slot: "append", class: "input-group-append" },
+        h("div", { class: "plate-number-end" }))));
   }
   static get is() { return "road-plate-number"; }
   static get encapsulation() { return "scoped"; }

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

@@ -1,4 +1,4 @@
-import { Component, Host, h, Element, Prop, Event, Watch } from '@stencil/core';
+import { Component, h, Element, Prop, Event, Watch } from '@stencil/core';
 export class Range {
   constructor() {
     /**
@@ -36,11 +36,10 @@ export class Range {
   }
   render() {
     const value = this.getValue();
-    return (h(Host, null,
-      h("div", { class: "form-range", style: { '--min:': this.min, '--max': this.max, '--value': value } },
-        this.showValue && h("output", null),
-        h("input", { type: "range", class: "form-range-input", id: this.rangeId, min: this.min, max: this.max, value: value, onInput: this.onInput }),
-        h("div", { class: "form-range-progress" }))));
+    return (h("div", { class: "form-range", style: { '--min:': this.min, '--max': this.max, '--value': value } },
+      this.showValue && h("output", null),
+      h("input", { type: "range", class: "form-range-input", id: this.rangeId, min: this.min, max: this.max, value: value, onInput: this.onInput }),
+      h("div", { class: "form-range-progress" })));
   }
   static get is() { return "road-range"; }
   static get encapsulation() { return "scoped"; }

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

@@ -1,4 +1,5 @@
 import { Component, Element, Host, Listen, Prop, State, h, Event } from '@stencil/core';
+import Fuse from 'fuse.js';
 /**
  * @slot  - Input element for the widget, it should be a road-input element.
  */
@@ -10,6 +11,15 @@ export class SelectFilter {
      * List of options of the select
      */
     this.options = [];
+    /**
+     * Options to pass to the fuse.js instance.
+     * See https://fusejs.io/api/options.html for valid options
+     */
+    this.parameters = {
+      keys: ["value", "label"],
+      threshold: 0.3,
+      ignoreLocation: true,
+    };
     /**
      * If `false`, the user can submit custom value
      */
@@ -32,16 +42,19 @@ export class SelectFilter {
   onClickOutside(event) {
     if (this.isOpen && !this.el.contains(event.target)) {
       this.isOpen = false;
-      if (this.onlySelect) {
+      const value = this.el.querySelector('road-input').value;
+      if (this.onlySelect && !this.options.some(option => option['label'] === value)) {
         this.el.querySelector('road-input').value = '';
       }
     }
   }
   render() {
+    const fuseSearch = new Fuse(this.options, this.parameters);
+    const options = this.currentValue === '' ? this.options.map((doc, idx) => ({ item: doc, score: 1, refIndex: idx })) : fuseSearch.search(this.currentValue);
     return (h(Host, null,
       h("slot", null),
       this.isOpen &&
-        h("ul", { class: "select-filter-list", role: "listbox" }, this.options && this.options.filter(element => element.label.replace(/(<([^>]+)>)/gi, "").toLowerCase().indexOf(this.currentValue) > -1).map(option => (h("li", { class: "select-filter-item", role: "option", onClick: () => this.onClick(option.value, option.label.replace(/(<([^>]+)>)/gi, "")), innerHTML: option.label }))))));
+        h("ul", { class: "select-filter-list", role: "listbox" }, options.map(option => (h("li", { class: "select-filter-item", role: "option", onClick: () => this.onClick(option.item.value, option.item.label.replace(/(<([^>]+)>)/gi, "")), innerHTML: option.item.label }))))));
   }
   static get is() { return "road-select-filter"; }
   static get encapsulation() { return "scoped"; }
@@ -72,6 +85,24 @@ export class SelectFilter {
       },
       "defaultValue": "[]"
     },
+    "parameters": {
+      "type": "any",
+      "mutable": false,
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Options to pass to the fuse.js instance.\nSee https://fusejs.io/api/options.html for valid options"
+      },
+      "attribute": "parameters",
+      "reflect": false,
+      "defaultValue": "{\n    keys: [\"value\", \"label\"],\n    threshold: 0.3,\n    ignoreLocation: true,\n  }"
+    },
     "onlySelect": {
       "type": "boolean",
       "mutable": false,

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

@@ -8,6 +8,7 @@ export default {
       handles: ['roadBlur', 'roadFocus'],
     },
   },
+  decorators: [(story) => html`<div style="margin-bottom: 20rem">${story()}</div>`],
 };
 
 export const Playground = (args) => {
@@ -29,9 +30,6 @@ export const Playground = (args) => {
       </label>
     </road-input-group>
   </road-select-filter>
-
-  <!-- br are here only until we find how to add a margin only for Storybook docs block, do not copy them -->
-  <br><br><br><br><br><br><br><br><br><br><br><br><br>
   `;
 };
 Playground.argTypes = {
@@ -131,8 +129,5 @@ export const withHTML = () => {
         </label>
       </road-input-group>
     </road-select-filter>
-
-    <!-- br are here only until we find how to add a margin only for Storybook docs block, do not copy them -->
-    <br><br><br><br><br><br><br><br><br><br><br><br><br>
   `;
 };

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

@@ -1,8 +1,7 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 export class Skeleton {
   render() {
-    return (h(Host, null,
-      h("span", null, "\u00A0")));
+    return (h("span", null, "\u00A0"));
   }
   static get is() { return "road-skeleton"; }
   static get encapsulation() { return "shadow"; }

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

@@ -1,9 +1,8 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 export class Spinner {
   render() {
-    return (h(Host, null,
-      h("svg", { class: "spinner", viewBox: "25 25 50 50" },
-        h("circle", { class: "spinner-circle", cx: "50", cy: "50", r: "20" }))));
+    return (h("svg", { class: "spinner", viewBox: "25 25 50 50" },
+      h("circle", { class: "spinner-circle", cx: "50", cy: "50", r: "20" })));
   }
   static get is() { return "road-spinner"; }
   static get encapsulation() { return "shadow"; }

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

@@ -1,11 +1,10 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 /**
  * @slot  - Content of table, it should be an html table (https://developer.mozilla.org/fr/docs/Web/HTML/Element/table).
  */
 export class Table {
   render() {
-    return (h(Host, null,
-      h("slot", null)));
+    return (h("slot", null));
   }
   static get is() { return "road-table"; }
   static get encapsulation() { return "scoped"; }

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

@@ -1,12 +1,11 @@
-import { Component, Host, h } from '@stencil/core';
+import { Component, h } from '@stencil/core';
 /**
  * @slot - Text of the title.
  */
 export class ToolbarTitle {
   render() {
-    return (h(Host, null,
-      h("div", { class: "toolbar-title" },
-        h("slot", null))));
+    return (h("div", { class: "toolbar-title" },
+      h("slot", null)));
   }
   static get is() { return "road-toolbar-title"; }
   static get encapsulation() { return "shadow"; }

package/dist/esm/loader.js

@@ -25,7 +25,7 @@ const patchEsm = () => {
 const defineCustomElements = (win, options) => {
   if (typeof window === 'undefined') return Promise.resolve();
   return patchEsm().then(() => {
-  return bootstrapLazy([["road-badge_11",[[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",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[1],"max":[1],"step":[1],"value":[2],"size":[1]}]]],["road-plate-number",[[2,"road-plate-number",{"country":[1],"placeholder":[1],"value":[1032],"motorbike":[4]}]]],["road-accordion",[[1,"road-accordion",{"isOpen":[1028,"is-open"]}]]],["road-carousel",[[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",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["road-collapse",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["road-dialog",[[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",[[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",[[1,"road-rating",{"rate":[2],"reviews":[2],"reviewsText":[1,"reviews-text"]}]]],["road-toast",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"position":[1],"open":[64],"close":[64]}]]],["road-alert",[[1,"road-alert",{"color":[1]}]]],["road-autocomplete",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[4,"click","onClickOutside"]]]]],["road-avatar",[[1,"road-avatar"]]],["road-card",[[1,"road-card",{"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["road-carousel-item",[[4,"road-carousel-item"]]],["road-checkbox",[[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",[[1,"road-dropdown",{"isOpen":[1028,"is-open"]}]]],["road-flap",[[1,"road-flap",{"color":[1]}]]],["road-img",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]}]]],["road-navbar",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"]]]]],["road-navbar-item",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"]]]]],["road-progress",[[1,"road-progress",{"value":[2],"color":[1]}]]],["road-radio",[[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",[[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",[[2,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"]}]]],["road-select",[[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",[[6,"road-select-filter",{"options":[16],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadChange","handleChange"],[4,"click","onClickOutside"]]]]],["road-skeleton",[[1,"road-skeleton"]]],["road-spinner",[[1,"road-spinner"]]],["road-switch",[[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",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["road-tab-bar",[[1,"road-tab-bar",{"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]}]]],["road-tab-button",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"]]]]],["road-table",[[6,"road-table"]]],["road-tabs",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["road-text",[[1,"road-text",{"color":[1]}]]],["road-textarea",[[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",[[1,"road-toolbar-title"]]],["road-tooltip",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["road-input",[[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",[[1,"road-input-group"]]]], options);
+  return bootstrapLazy([["road-badge_11",[[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",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[1],"max":[1],"step":[1],"value":[2],"size":[1]}]]],["road-plate-number",[[2,"road-plate-number",{"country":[1],"placeholder":[1],"value":[1032],"motorbike":[4]}]]],["road-accordion",[[1,"road-accordion",{"isOpen":[1028,"is-open"]}]]],["road-carousel",[[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",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["road-collapse",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["road-dialog",[[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",[[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",[[1,"road-rating",{"rate":[2],"reviews":[2],"reviewsText":[1,"reviews-text"]}]]],["road-toast",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"position":[1],"open":[64],"close":[64]}]]],["road-alert",[[1,"road-alert",{"color":[1]}]]],["road-autocomplete",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[4,"click","onClickOutside"]]]]],["road-avatar",[[1,"road-avatar"]]],["road-card",[[1,"road-card",{"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]],["road-carousel-item",[[4,"road-carousel-item"]]],["road-checkbox",[[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",[[1,"road-dropdown",{"isOpen":[1028,"is-open"]}]]],["road-flap",[[1,"road-flap",{"color":[1]}]]],["road-img",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]}]]],["road-navbar",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"]]]]],["road-navbar-item",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"]]]]],["road-progress",[[1,"road-progress",{"value":[2],"color":[1]}]]],["road-radio",[[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",[[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",[[2,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"]}]]],["road-select",[[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",[[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",[[1,"road-skeleton"]]],["road-spinner",[[1,"road-spinner"]]],["road-switch",[[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",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["road-tab-bar",[[1,"road-tab-bar",{"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]}]]],["road-tab-button",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"]]]]],["road-table",[[6,"road-table"]]],["road-tabs",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["road-text",[[1,"road-text",{"color":[1]}]]],["road-textarea",[[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",[[1,"road-toolbar-title"]]],["road-tooltip",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["road-input",[[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",[[1,"road-input-group"]]]], options);
   });
 };
 

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

@@ -16,7 +16,7 @@ let Autocomplete = class {
       this.visible = false;
       this.roadSelected.emit({
         value: value.toString(),
-        label: label
+        label: label,
       });
     };
   }

package/dist/esm/road-avatar.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-4e5ea092.js';
+import { r as registerInstance, h } from './index-4e5ea092.js';
 
 const avatarCss = ":host{--avatar-background:var(--background-second);--avatar-width:3rem;position:relative;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;width:var(--avatar-width);height:var(--avatar-width);background:var(--avatar-background);border-radius:var(--avatar-width)}::slotted(road-img),::slotted(img){width:100%;height:100%;-o-object-fit:cover;object-fit:cover;overflow:hidden;border-radius:var(--avatar-width)}::slotted(road-badge){position:absolute;top:0;right:0}";
 
@@ -7,7 +7,7 @@ let Avatar = class {
     registerInstance(this, hostRef);
   }
   render() {
-    return (h(Host, null, h("slot", null)));
+    return (h("slot", null));
   }
 };
 Avatar.style = avatarCss;

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

@@ -95,7 +95,7 @@ let Col = class {
     registerInstance(this, hostRef);
   }
   render() {
-    return (h(Host, null, h("slot", null)));
+    return (h("slot", null));
   }
 };
 Col.style = colCss;
@@ -222,7 +222,7 @@ let Grid = class {
     registerInstance(this, hostRef);
   }
   render() {
-    return (h(Host, null, h("slot", null)));
+    return (h("slot", null));
   }
 };
 Grid.style = gridCss;
@@ -454,7 +454,7 @@ let Label = class {
     registerInstance(this, hostRef);
   }
   render() {
-    return (h(Host, null, h("slot", null)));
+    return (h("slot", null));
   }
 };
 Label.style = labelCss;

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, e as getElement } from './index-4e5ea092.js';
+import { r as registerInstance, c as createEvent, h, e as getElement } from './index-4e5ea092.js';
 
 const cardCss = ":host{position:relative;-webkit-box-sizing:border-box;box-sizing:border-box;display:block;margin-bottom:var(--margin-bottom, 1rem)}.card-native{-webkit-box-sizing:border-box;box-sizing:border-box;display:block;width:100%;height:100%;padding:1.5rem;margin:0;font-family:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;color:inherit;text-align:center;text-decoration:inherit;text-indent:inherit;text-overflow:inherit;text-transform:inherit;letter-spacing:inherit;white-space:inherit;background:var(--white);border:0;border-radius:0.25rem;outline:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0)}a,button{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none}::slotted(road-icon){text-align:center}";
 
@@ -47,7 +47,7 @@ let Card = class {
     return (h(TagType, Object.assign({}, attrs, { class: "card-native", part: "native", onClick: this.onClick }), h("slot", null)));
   }
   render() {
-    return (h(Host, null, this.renderCard()));
+    return (this.renderCard());
   }
   get el() { return getElement(this); }
 };

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, e as getElement } from './index-4e5ea092.js';
+import { r as registerInstance, c as createEvent, h, e as getElement } from './index-4e5ea092.js';
 
 const counterCss = ".sc-road-counter-h{--counter-margin-bottom:1rem;display:block}road-input.sc-road-counter{--input-text-align:center;--border-radius:0;--margin-bottom:var(--counter-margin-bottom)}road-button.sc-road-counter{font-size:1.125rem;background:var(--background-second);border-color:var(--border-form)}road-button.sc-road-counter:hover{background:var(--background)}.counter-md.sc-road-counter road-input.sc-road-counter{--height:2.5rem}.counter-md.sc-road-counter road-button.sc-road-counter{min-width:2.5rem}.counter-sm.sc-road-counter road-input.sc-road-counter{--height:2rem}.counter-sm.sc-road-counter road-button.sc-road-counter{min-width:2rem}";
 
@@ -25,7 +25,7 @@ let Counter = class {
     };
   }
   render() {
-    return (h(Host, null, h("road-input-group", { class: this.size && `counter-${this.size}` }, h("road-button", { slot: "prepend", size: this.size, onClick: this.decrease }, "-"), h("road-input", { type: "number", min: this.min, max: this.max, step: this.step, value: this.value }), h("road-button", { slot: "append", size: this.size, onClick: this.increase }, "+"))));
+    return (h("road-input-group", { class: this.size && `counter-${this.size}` }, h("road-button", { slot: "prepend", size: this.size, onClick: this.decrease }, "-"), h("road-input", { type: "number", min: this.min, max: this.max, step: this.step, value: this.value }), h("road-button", { slot: "append", size: this.size, onClick: this.increase }, "+")));
   }
   get el() { return getElement(this); }
 };

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

@@ -6,7 +6,7 @@ const debounceEvent = (event, wait) => {
   const original = event._original || event;
   return {
     _original: event,
-    emit: debounce(original.emit.bind(original), wait)
+    emit: debounce(original.emit.bind(original), wait),
   };
 };
 const debounce = (func, wait = 0) => {