@roadtrip/components 2.24.1 → 2.27.0

package/dist/types/components.d.ts

@@ -9,7 +9,7 @@ import { AutocompleteTypes, Color, FeedbackColors, TextFieldTypes } from "./inte
 export namespace Components {
     interface RoadAccordion {
         /**
-          * Set open to true to show the accordion element and to false to hide it.
+          * Set to `true` to open the accordion and to `false` to close it.
          */
         "isOpen": boolean;
     }
@@ -60,7 +60,7 @@ export namespace Components {
         /**
           * Set to `true` for a full-width button.
          */
-        "expand"?: boolean;
+        "expand": boolean;
         /**
           * Contains a URL or a URL fragment that the hyperlink points to. If this property is set, an anchor tag will be rendered.
          */
@@ -76,7 +76,7 @@ export namespace Components {
         /**
           * The button size.
          */
-        "size"?: 'sm' | 'md';
+        "size"?: 'sm' | 'md' | 'lg';
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -209,7 +209,7 @@ export namespace Components {
          */
         "checkboxId": string;
         /**
-          * If `true`, the checkbox is selected.
+          * If `true`, the checkbox is checked.
          */
         "checked": boolean;
         /**
@@ -247,15 +247,15 @@ export namespace Components {
          */
         "color"?: 'default' | 'secondary';
         /**
-          * Display close icon
+          * Display a close icon
          */
         "hasCloseIcon": boolean;
         /**
-          * Display an outline style button.
+          * Display an outline style chip.
          */
         "outline": boolean;
         /**
-          * Display an outline style button.
+          * The chip size.
          */
         "size": 'md' | 'lg';
     }
@@ -263,15 +263,15 @@ export namespace Components {
     }
     interface RoadCollapse {
         /**
-          * if "`true`" the button will be centered
+          * if `true` the button will be centered
          */
         "centered": boolean;
         /**
-          * Set open to true to show the accordion element and to false to hide it.
+          * Set to `true` to display the collapsed part and to `false` to hide it.
          */
         "isOpen": boolean;
         /**
-          * Text displayed in the button when the content is collapsed
+          * Text displayed in the button when the content is not collapsed
          */
         "showLess": string;
         /**
@@ -281,7 +281,7 @@ export namespace Components {
     }
     interface RoadCounter {
         /**
-          * The id of input
+          * The id of counter
          */
         "inputId": string;
         /**
@@ -301,7 +301,7 @@ export namespace Components {
          */
         "step"?: string;
         /**
-          * The value of the input.
+          * The value of the counter.
          */
         "value": number;
     }
@@ -391,9 +391,39 @@ export namespace Components {
     }
     interface RoadDropdown {
         /**
-          * Set open to true to show the dropdown menu.
+          * Set to `true` to open the dropdown menu and to `false` to close it.
+         */
+        "isOpen": boolean;
+    }
+    interface RoadDuration {
+        /**
+          * Close the widget
+         */
+        "close": () => Promise<void>;
+        /**
+          * title of the widget
+         */
+        "header": string;
+        /**
+          * Set isOpen property to true to open the duration widget
          */
         "isOpen": boolean;
+        /**
+          * The maximum value, which must not be less than its minimum (min attribute) value in minutes.
+         */
+        "max": number;
+        /**
+          * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.
+         */
+        "min": number;
+        /**
+          * Open the widget
+         */
+        "open": () => Promise<void>;
+        /**
+          * Works with the min and max attributes to limit the increments at which a value can be set in minutes.
+         */
+        "step": number;
     }
     interface RoadFlap {
         /**
@@ -879,6 +909,10 @@ export namespace Components {
     value: string | number;
     label: string;
   }>;
+        /**
+          * Options to pass to the fuse.js instance. See https://fusejs.io/api/options.html for valid options
+         */
+        "parameters": any;
     }
     interface RoadSkeleton {
     }
@@ -886,7 +920,7 @@ export namespace Components {
     }
     interface RoadSwitch {
         /**
-          * If `true`, the toggle is selected.
+          * If `true`, the switch is checked.
          */
         "checked": boolean;
         /**
@@ -894,7 +928,7 @@ export namespace Components {
          */
         "color"?: 'secondary' | FeedbackColors;
         /**
-          * If `true`, the user cannot interact with the toggle.
+          * If `true`, the user cannot interact with the switch.
          */
         "disabled": boolean;
         /**
@@ -922,7 +956,7 @@ export namespace Components {
          */
         "on": string;
         /**
-          * The id of input
+          * The id of switch
          */
         "switchId": string;
         /**
@@ -1015,7 +1049,7 @@ export namespace Components {
          */
         "autocapitalize": string;
         /**
-          * This Boolean attribute lets you specify that a form control should have input focus when the page loads.
+          * This Boolean attribute lets you specify that a form control should have focus when the page loads.
          */
         "autofocus": boolean;
         /**
@@ -1023,7 +1057,7 @@ export namespace Components {
          */
         "cols"?: number;
         /**
-          * If `true`, the user cannot interact with the input.
+          * If `true`, the user cannot interact with the textarea.
          */
         "disabled": boolean;
         /**
@@ -1055,7 +1089,7 @@ export namespace Components {
          */
         "name": string;
         /**
-          * Instructional text that shows before the input has a value.
+          * Instructional text that shows before the textarea has a value.
          */
         "placeholder"?: string;
         /**
@@ -1075,11 +1109,11 @@ export namespace Components {
          */
         "spellcheck": boolean;
         /**
-          * The id of input
+          * The id of textarea
          */
         "textareaId": string;
         /**
-          * The value of the input.
+          * The value of the textarea.
          */
         "value"?: string | null;
         /**
@@ -1093,11 +1127,11 @@ export namespace Components {
          */
         "close": () => Promise<void>;
         /**
-          * Set the color of toast. e.g. info, success, warning, danger
+          * Set the color of the toast. e.g. info, success, warning, danger
          */
         "color": FeedbackColors;
         /**
-          * Set open propertie to true to show the toast
+          * Set `open` propertie to `true` to open the toast
          */
         "isOpen": boolean;
         /**
@@ -1127,7 +1161,7 @@ export namespace Components {
     }
     interface RoadTooltip {
         /**
-          * Shows the tooltip.
+          * Close the tooltip.
          */
         "close": () => Promise<void>;
         /**
@@ -1139,7 +1173,7 @@ export namespace Components {
          */
         "isOpen": boolean;
         /**
-          * Shows the tooltip.
+          * Open the tooltip.
          */
         "open": () => Promise<void>;
         /**
@@ -1262,6 +1296,12 @@ declare global {
         prototype: HTMLRoadDropdownElement;
         new (): HTMLRoadDropdownElement;
     };
+    interface HTMLRoadDurationElement extends Components.RoadDuration, HTMLStencilElement {
+    }
+    var HTMLRoadDurationElement: {
+        prototype: HTMLRoadDurationElement;
+        new (): HTMLRoadDurationElement;
+    };
     interface HTMLRoadFlapElement extends Components.RoadFlap, HTMLStencilElement {
     }
     var HTMLRoadFlapElement: {
@@ -1490,6 +1530,7 @@ declare global {
         "road-dialog": HTMLRoadDialogElement;
         "road-drawer": HTMLRoadDrawerElement;
         "road-dropdown": HTMLRoadDropdownElement;
+        "road-duration": HTMLRoadDurationElement;
         "road-flap": HTMLRoadFlapElement;
         "road-grid": HTMLRoadGridElement;
         "road-icon": HTMLRoadIconElement;
@@ -1530,7 +1571,7 @@ declare global {
 declare namespace LocalJSX {
     interface RoadAccordion {
         /**
-          * Set open to true to show the accordion element and to false to hide it.
+          * Set to `true` to open the accordion and to `false` to close it.
          */
         "isOpen"?: boolean;
     }
@@ -1544,7 +1585,7 @@ declare namespace LocalJSX {
         /**
           * Emitted the value and label of the option selected.
          */
-        "onRoadSelected"?: (event: CustomEvent<{
+        "onRoadselected"?: (event: CustomEvent<{
     value: string | undefined | null,
     label: string
   }>) => void;
@@ -1596,11 +1637,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the button loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the button has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * Set to `true` for a transparent button with a border
          */
@@ -1612,7 +1653,7 @@ declare namespace LocalJSX {
         /**
           * The button size.
          */
-        "size"?: 'sm' | 'md';
+        "size"?: 'sm' | 'md' | 'lg';
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -1634,7 +1675,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the card is clicked and send the `value` of the card
          */
-        "onRoadCardClick"?: (event: CustomEvent<{
+        "onRoadcardclick"?: (event: CustomEvent<{
     value: string | undefined | null;
     label: string | undefined | null;
   }>) => void;
@@ -1663,67 +1704,67 @@ declare namespace LocalJSX {
         /**
           * Emitted after the active slide has changed.
          */
-        "onRoadSlideDidChange"?: (event: CustomEvent<void>) => void;
+        "onRoadslidedidchange"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the user double taps on the slide's container.
          */
-        "onRoadSlideDoubleTap"?: (event: CustomEvent<void>) => void;
+        "onRoadslidedoubletap"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the slider is actively being moved.
          */
-        "onRoadSlideDrag"?: (event: CustomEvent<void>) => void;
+        "onRoadslidedrag"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the next slide has ended.
          */
-        "onRoadSlideNextEnd"?: (event: CustomEvent<void>) => void;
+        "onRoadslidenextend"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the next slide has started.
          */
-        "onRoadSlideNextStart"?: (event: CustomEvent<void>) => void;
+        "onRoadslidenextstart"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the previous slide has ended.
          */
-        "onRoadSlidePrevEnd"?: (event: CustomEvent<void>) => void;
+        "onRoadslideprevend"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the previous slide has started.
          */
-        "onRoadSlidePrevStart"?: (event: CustomEvent<void>) => void;
+        "onRoadslideprevstart"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the slider is at the last slide.
          */
-        "onRoadSlideReachEnd"?: (event: CustomEvent<void>) => void;
+        "onRoadslidereachend"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the slider is at its initial position.
          */
-        "onRoadSlideReachStart"?: (event: CustomEvent<void>) => void;
+        "onRoadslidereachstart"?: (event: CustomEvent<void>) => void;
+        /**
+          * Emitted after Swiper initialization
+         */
+        "onRoadslidesdidload"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the user taps/clicks on the slide's container.
          */
-        "onRoadSlideTap"?: (event: CustomEvent<void>) => void;
+        "onRoadslidetap"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the user releases the touch.
          */
-        "onRoadSlideTouchEnd"?: (event: CustomEvent<void>) => void;
+        "onRoadslidetouchend"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the user first touches the slider.
          */
-        "onRoadSlideTouchStart"?: (event: CustomEvent<void>) => void;
+        "onRoadslidetouchstart"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the slide transition has ended.
          */
-        "onRoadSlideTransitionEnd"?: (event: CustomEvent<void>) => void;
+        "onRoadslidetransitionend"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the slide transition has started.
          */
-        "onRoadSlideTransitionStart"?: (event: CustomEvent<void>) => void;
+        "onRoadslidetransitionstart"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted before the active slide has changed.
          */
-        "onRoadSlideWillChange"?: (event: CustomEvent<void>) => void;
-        /**
-          * Emitted after Swiper initialization
-         */
-        "onRoadSlidesDidLoad"?: (event: CustomEvent<void>) => void;
+        "onRoadslidewillchange"?: (event: CustomEvent<void>) => void;
         /**
           * Options to pass to the swiper instance. See http://idangero.us/swiper/api/ for valid options
          */
@@ -1741,7 +1782,7 @@ declare namespace LocalJSX {
          */
         "checkboxId"?: string;
         /**
-          * If `true`, the checkbox is selected.
+          * If `true`, the checkbox is checked.
          */
         "checked"?: boolean;
         /**
@@ -1765,20 +1806,20 @@ declare namespace LocalJSX {
          */
         "name"?: string;
         /**
-          * Emitted when the toggle loses focus.
+          * Emitted when the checkbox loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the checked property has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     checked: boolean,
     value: string | undefined | null
   }>) => void;
         /**
-          * Emitted when the toggle has focus.
+          * Emitted when the checkbox has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * If `true`, the user must fill in a value before submitting a form.
          */
@@ -1794,15 +1835,15 @@ declare namespace LocalJSX {
          */
         "color"?: 'default' | 'secondary';
         /**
-          * Display close icon
+          * Display a close icon
          */
         "hasCloseIcon"?: boolean;
         /**
-          * Display an outline style button.
+          * Display an outline style chip.
          */
         "outline"?: boolean;
         /**
-          * Display an outline style button.
+          * The chip size.
          */
         "size"?: 'md' | 'lg';
     }
@@ -1810,15 +1851,15 @@ declare namespace LocalJSX {
     }
     interface RoadCollapse {
         /**
-          * if "`true`" the button will be centered
+          * if `true` the button will be centered
          */
         "centered"?: boolean;
         /**
-          * Set open to true to show the accordion element and to false to hide it.
+          * Set to `true` to display the collapsed part and to `false` to hide it.
          */
         "isOpen"?: boolean;
         /**
-          * Text displayed in the button when the content is collapsed
+          * Text displayed in the button when the content is not collapsed
          */
         "showLess"?: string;
         /**
@@ -1828,7 +1869,7 @@ declare namespace LocalJSX {
     }
     interface RoadCounter {
         /**
-          * The id of input
+          * The id of counter
          */
         "inputId"?: string;
         /**
@@ -1842,11 +1883,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the minus button is clicked
          */
-        "onRoadDecrease"?: (event: CustomEvent<void>) => void;
+        "onRoaddecrease"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the plus button is clicked
          */
-        "onRoadIncrease"?: (event: CustomEvent<void>) => void;
+        "onRoadincrease"?: (event: CustomEvent<void>) => void;
         /**
           * The size of the counter.
          */
@@ -1856,7 +1897,7 @@ declare namespace LocalJSX {
          */
         "step"?: string;
         /**
-          * The value of the input.
+          * The value of the counter.
          */
         "value"?: number;
     }
@@ -1942,10 +1983,39 @@ declare namespace LocalJSX {
     }
     interface RoadDropdown {
         /**
-          * Set open to true to show the dropdown menu.
+          * Set to `true` to open the dropdown menu and to `false` to close it.
          */
         "isOpen"?: boolean;
     }
+    interface RoadDuration {
+        /**
+          * title of the widget
+         */
+        "header"?: string;
+        /**
+          * Set isOpen property to true to open the duration widget
+         */
+        "isOpen"?: boolean;
+        /**
+          * The maximum value, which must not be less than its minimum (min attribute) value in minutes.
+         */
+        "max"?: number;
+        /**
+          * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.
+         */
+        "min"?: number;
+        /**
+          * Emitt the value and label of the selected option.
+         */
+        "onRoadselected"?: (event: CustomEvent<{
+    value: string | undefined | null,
+    label: string
+  }>) => void;
+        /**
+          * Works with the min and max attributes to limit the increments at which a value can be set in minutes.
+         */
+        "step"?: number;
+    }
     interface RoadFlap {
         /**
           * Set the color of the flap.
@@ -2004,15 +2074,15 @@ declare namespace LocalJSX {
         /**
           * Emitted when the img fails to load
          */
-        "onRoadError"?: (event: CustomEvent<void>) => void;
+        "onRoaderror"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the image has finished loading
          */
-        "onRoadImgDidLoad"?: (event: CustomEvent<void>) => void;
+        "onRoadimgdidload"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the img src has been set
          */
-        "onRoadImgWillLoad"?: (event: CustomEvent<void>) => void;
+        "onRoadimgwillload"?: (event: CustomEvent<void>) => void;
         /**
           * The image URL. This attribute is mandatory for the `<img>` element.
          */
@@ -2086,21 +2156,21 @@ declare namespace LocalJSX {
         /**
           * Emitted when the input loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     value: string | undefined | null;
   }>) => void;
         /**
           * Emitted when the input has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when a keyboard input occurred.
          */
-        "onRoadInput"?: (event: CustomEvent<KeyboardEvent>) => void;
+        "onRoadinput"?: (event: CustomEvent<KeyboardEvent>) => void;
         /**
           * A regular expression that the value is checked against. The pattern must match the entire value, not just some subset. Use the title attribute to describe the pattern to help the user. This attribute applies when the value of the type attribute is `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
          */
@@ -2268,21 +2338,21 @@ declare namespace LocalJSX {
         /**
           * Emitted when the input loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     value: string | undefined | null;
   }>) => void;
         /**
           * Emitted when the input has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when a keyboard input occurred.
          */
-        "onRoadInput"?: (event: CustomEvent<KeyboardEvent>) => void;
+        "onRoadinput"?: (event: CustomEvent<KeyboardEvent>) => void;
         /**
           * overwrite the default placeholder
          */
@@ -2330,11 +2400,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the radio button loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the radio button has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * The id of radio
          */
@@ -2376,7 +2446,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the value has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     value: string | undefined | null
   }>) => void;
         /**
@@ -2400,7 +2470,7 @@ declare namespace LocalJSX {
         /**
           * Emitted when the value has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     value: string | undefined | null;
   }>) => void;
         /**
@@ -2460,17 +2530,17 @@ declare namespace LocalJSX {
         /**
           * Emitted when the select loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     value: string | undefined | null
   }>) => void;
         /**
           * Emitted when the select has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * List of options of the select
          */
@@ -2500,7 +2570,7 @@ declare namespace LocalJSX {
         /**
           * Emitted the value and label of the option selected.
          */
-        "onRoadSelected"?: (event: CustomEvent<{
+        "onRoadselected"?: (event: CustomEvent<{
     value: string | undefined | null,
     label: string
   }>) => void;
@@ -2515,6 +2585,10 @@ declare namespace LocalJSX {
     value: string | number;
     label: string;
   }>;
+        /**
+          * Options to pass to the fuse.js instance. See https://fusejs.io/api/options.html for valid options
+         */
+        "parameters"?: any;
     }
     interface RoadSkeleton {
     }
@@ -2522,7 +2596,7 @@ declare namespace LocalJSX {
     }
     interface RoadSwitch {
         /**
-          * If `true`, the toggle is selected.
+          * If `true`, the switch is checked.
          */
         "checked"?: boolean;
         /**
@@ -2530,7 +2604,7 @@ declare namespace LocalJSX {
          */
         "color"?: 'secondary' | FeedbackColors;
         /**
-          * If `true`, the user cannot interact with the toggle.
+          * If `true`, the user cannot interact with the switch.
          */
         "disabled"?: boolean;
         /**
@@ -2558,22 +2632,22 @@ declare namespace LocalJSX {
          */
         "on"?: string;
         /**
-          * Emitted when the toggle loses focus.
+          * Emitted when the switch loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the checked property has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     checked: boolean;
     value: string | undefined | null
   }>) => void;
         /**
-          * Emitted when the toggle has focus.
+          * Emitted when the switch has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
-          * The id of input
+          * The id of switch
          */
         "switchId"?: string;
         /**
@@ -2637,11 +2711,11 @@ declare namespace LocalJSX {
         /**
           * Emitted when the navigation has finished transitioning to a new component.
          */
-        "onRoadTabsDidChange"?: (event: CustomEvent<{tab: string}>) => void;
+        "onRoadtabsdidchange"?: (event: CustomEvent<{tab: string}>) => void;
         /**
           * Emitted when the navigation is about to transition to a new component.
          */
-        "onRoadTabsWillChange"?: (event: CustomEvent<{tab: string}>) => void;
+        "onRoadtabswillchange"?: (event: CustomEvent<{tab: string}>) => void;
     }
     interface RoadText {
         /**
@@ -2655,7 +2729,7 @@ declare namespace LocalJSX {
          */
         "autocapitalize"?: string;
         /**
-          * This Boolean attribute lets you specify that a form control should have input focus when the page loads.
+          * This Boolean attribute lets you specify that a form control should have focus when the page loads.
          */
         "autofocus"?: boolean;
         /**
@@ -2663,7 +2737,7 @@ declare namespace LocalJSX {
          */
         "cols"?: number;
         /**
-          * If `true`, the user cannot interact with the input.
+          * If `true`, the user cannot interact with the textarea.
          */
         "disabled"?: boolean;
         /**
@@ -2695,25 +2769,25 @@ declare namespace LocalJSX {
          */
         "name"?: string;
         /**
-          * Emitted when the input loses focus.
+          * Emitted when the textarea loses focus.
          */
-        "onRoadBlur"?: (event: CustomEvent<void>) => void;
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when the value has changed.
          */
-        "onRoadChange"?: (event: CustomEvent<{
+        "onRoadchange"?: (event: CustomEvent<{
     value: string | undefined | null
   }>) => void;
         /**
-          * Emitted when the input has focus.
+          * Emitted when the textarea has focus.
          */
-        "onRoadFocus"?: (event: CustomEvent<void>) => void;
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
         /**
           * Emitted when a keyboard input occurred.
          */
-        "onRoadInput"?: (event: CustomEvent<KeyboardEvent>) => void;
+        "onRoadinput"?: (event: CustomEvent<KeyboardEvent>) => void;
         /**
-          * Instructional text that shows before the input has a value.
+          * Instructional text that shows before the textarea has a value.
          */
         "placeholder"?: string;
         /**
@@ -2733,11 +2807,11 @@ declare namespace LocalJSX {
          */
         "spellcheck"?: boolean;
         /**
-          * The id of input
+          * The id of textarea
          */
         "textareaId"?: string;
         /**
-          * The value of the input.
+          * The value of the textarea.
          */
         "value"?: string | null;
         /**
@@ -2747,11 +2821,11 @@ declare namespace LocalJSX {
     }
     interface RoadToast {
         /**
-          * Set the color of toast. e.g. info, success, warning, danger
+          * Set the color of the toast. e.g. info, success, warning, danger
          */
         "color"?: FeedbackColors;
         /**
-          * Set open propertie to true to show the toast
+          * Set `open` propertie to `true` to open the toast
          */
         "isOpen"?: boolean;
         /**
@@ -2822,6 +2896,7 @@ declare namespace LocalJSX {
         "road-dialog": RoadDialog;
         "road-drawer": RoadDrawer;
         "road-dropdown": RoadDropdown;
+        "road-duration": RoadDuration;
         "road-flap": RoadFlap;
         "road-grid": RoadGrid;
         "road-icon": RoadIcon;
@@ -2880,6 +2955,7 @@ declare module "@stencil/core" {
             "road-dialog": LocalJSX.RoadDialog & JSXBase.HTMLAttributes<HTMLRoadDialogElement>;
             "road-drawer": LocalJSX.RoadDrawer & JSXBase.HTMLAttributes<HTMLRoadDrawerElement>;
             "road-dropdown": LocalJSX.RoadDropdown & JSXBase.HTMLAttributes<HTMLRoadDropdownElement>;
+            "road-duration": LocalJSX.RoadDuration & JSXBase.HTMLAttributes<HTMLRoadDurationElement>;
             "road-flap": LocalJSX.RoadFlap & JSXBase.HTMLAttributes<HTMLRoadFlapElement>;
             "road-grid": LocalJSX.RoadGrid & JSXBase.HTMLAttributes<HTMLRoadGridElement>;
             "road-icon": LocalJSX.RoadIcon & JSXBase.HTMLAttributes<HTMLRoadIconElement>;