@roadtrip/components 2.26.0 → 2.28.0

package/dist/types/components/duration/duration.d.ts

@@ -0,0 +1,44 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+export declare class Duration {
+  /**
+   * Current reference of the duration element
+   */
+  el: HTMLRoadDurationElement;
+  /**
+   * Set isOpen property to true to open the duration widget
+   */
+  isOpen: boolean;
+  /**
+   * title of the widget
+   */
+  header: string;
+  /**
+   * The minimum value, which must not be greater than its maximum (max attribute) value in minutes.
+   */
+  min: number;
+  /**
+   * The maximum value, which must not be less than its minimum (min attribute) value in minutes.
+   */
+  max: number;
+  /**
+   * Works with the min and max attributes to limit the increments at which a value can be set in minutes.
+   */
+  step: number;
+  handleClick(event: CustomEvent): void;
+  /**
+   * Emitt the value and label of the selected option.
+   */
+  roadselected: EventEmitter<{
+    value: string | undefined | null;
+    label: string;
+  }>;
+  /**
+   * Open the widget
+   */
+  open(): Promise<void>;
+  /**
+   * Close the widget
+   */
+  close(): Promise<void>;
+  render(): any;
+}

package/dist/types/components/flap/flap.d.ts

@@ -6,5 +6,9 @@ export declare class Flap {
    * Set the color of the flap.
    */
   color: 'promo' | 'exclu' | 'info' | 'ecology';
+  /**
+    * The button size.
+    */
+  size: 'sm' | 'md';
   render(): any;
 }

package/dist/types/components/input/input.d.ts

@@ -85,6 +85,10 @@ export declare class Input {
    * The initial size of the control. This value is in pixels unless the value of the type attribute is `"text"` or `"password"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
    */
   size?: number;
+  /**
+   * The sizes of the input.
+   */
+  sizes: 'lg' | 'xl';
   /**
    * The type of control to display. The default type is text.
    */

package/dist/types/components/plate-number/plate-number.d.ts

@@ -5,10 +5,18 @@ export declare class PlateNumber {
    * country of the plate
    */
   country: 'FR' | 'BE' | 'IT' | 'ES' | 'PT' | 'PL';
+  /**
+   * If `true`, the user cannot interact with the input.
+   */
+  disabled: boolean;
   /**
    * overwrite the default placeholder
    */
   placeholder?: string;
+  /**
+   * If `true`, the user cannot modify the value.
+   */
+  readonly: boolean;
   /**
    * The value of the input.
    */

package/dist/types/components/progress/progress.d.ts

@@ -1,4 +1,3 @@
-import { FeedbackColors } from '../../interface';
 export declare class ProgressBar {
   /**
    * The value determines how much of the active bar should display.
@@ -8,6 +7,6 @@ export declare class ProgressBar {
   /**
    * The color to use from your application's color palette.
    */
-  color: FeedbackColors;
+  color: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger';
   render(): any;
 }

package/dist/types/components/select/select.d.ts

@@ -33,6 +33,10 @@ export declare class Select {
    * this attribute represents the number of rows in the list that should be visible at one time.
    */
   size: number;
+  /**
+   * The sizes of the input.
+   */
+  sizes: 'lg' | 'xl';
   /**
    * Label for the field
    */

package/dist/types/components/textarea/textarea.d.ts

@@ -43,6 +43,10 @@ export declare class Textarea {
    * Instructional text that shows before the textarea has a value.
    */
   placeholder?: string;
+  /**
+   * The sizes of the input.
+   */
+  sizes: 'lg' | 'xl';
   /**
    * If `true`, the user cannot modify the value.
    */

package/dist/types/components/toggle/toggle.d.ts

@@ -0,0 +1,78 @@
+import { EventEmitter } from '../../stencil-public-runtime';
+import '../../utils/polyfill';
+import { FeedbackColors } from '../../interface';
+export declare class toggle {
+  /**
+   * The id of toggle
+   */
+  toggleId: string;
+  /**
+   * The name of the control, which is submitted with the form data.
+   */
+  name: string;
+  /**
+   * If `true`, the toggle is checked.
+   */
+  checked: boolean;
+  /**
+   * If `true`, the user cannot interact with the toggle.
+   */
+  disabled: boolean;
+  /**
+   * Label for the field
+   */
+  label: string;
+  /**
+   * Set the color of alert. e.g. info, success, warning, danger
+   */
+  color?: 'secondary' | FeedbackColors;
+  /**
+   * If `true`, the label is at left of the toggle
+   */
+  hasLeftLabel: boolean;
+  /**
+   * Add space between label and toggle element
+   */
+  isSpaced: boolean;
+  /**
+   * Value the form will get
+   */
+  value: string;
+  /**
+   * Text display for "`on`" state in the toggle lever
+   */
+  on: string;
+  /**
+   * Text display for "`off`" state in the toggle lever
+   */
+  off: string;
+  /**
+   * Emitted when the checked property has changed.
+   */
+  roadchange: EventEmitter<{
+    checked: boolean;
+    value: string | undefined | null;
+  }>;
+  /** @internal */
+  roadChange: EventEmitter<{
+    checked: boolean;
+    value: string | undefined | null;
+  }>;
+  /**
+   * Emitted when the toggle has focus.
+   */
+  roadfocus: EventEmitter<void>;
+  /** @internal */
+  roadFocus: EventEmitter<void>;
+  /**
+   * Emitted when the toggle loses focus.
+   */
+  roadblur: EventEmitter<void>;
+  /** @internal */
+  roadBlur: EventEmitter<void>;
+  checkedChanged(isChecked: boolean): void;
+  private onClick;
+  private onFocus;
+  private onBlur;
+  render(): any;
+}

package/dist/types/components.d.ts

@@ -48,7 +48,7 @@ export namespace Components {
         /**
           * The color to use from your application's color palette.
          */
-        "color"?: Color;
+        "color"?: 'primary' | 'secondary' | 'default';
         /**
           * If `true`, the user cannot interact with the button.
          */
@@ -76,7 +76,7 @@ export namespace Components {
         /**
           * The button size.
          */
-        "size"?: 'sm' | 'md' | 'lg';
+        "size"?: 'sm' | 'md' | 'lg' | 'xl';
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -220,6 +220,10 @@ export namespace Components {
           * Error message for the field
          */
         "error"?: string;
+        /**
+          * If `true`, the checkbox will visually appear as indeterminate.
+         */
+        "indeterminate": boolean;
         /**
           * If `true`, the label and the checkbox are inverse and spaced
          */
@@ -395,11 +399,45 @@ export namespace Components {
          */
         "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 {
         /**
           * Set the color of the flap.
          */
         "color": 'promo' | 'exclu' | 'info' | 'ecology';
+        /**
+          * The button size.
+         */
+        "size": 'sm' | 'md';
     }
     interface RoadGrid {
     }
@@ -540,6 +578,10 @@ export namespace Components {
           * The initial size of the control. This value is in pixels unless the value of the type attribute is `"text"` or `"password"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
          */
         "size"?: number;
+        /**
+          * The sizes of the input.
+         */
+        "sizes": 'lg' | 'xl';
         /**
           * If `true`, the element will have its spelling and grammar checked.
          */
@@ -684,6 +726,10 @@ export namespace Components {
           * country of the plate
          */
         "country": 'FR' | 'BE' | 'IT' | 'ES' | 'PT' | 'PL';
+        /**
+          * If `true`, the user cannot interact with the input.
+         */
+        "disabled": boolean;
         /**
           * Enable motorbike display
          */
@@ -692,6 +738,10 @@ export namespace Components {
           * overwrite the default placeholder
          */
         "placeholder"?: string;
+        /**
+          * If `true`, the user cannot modify the value.
+         */
+        "readonly": boolean;
         /**
           * The value of the input.
          */
@@ -701,7 +751,7 @@ export namespace Components {
         /**
           * The color to use from your application's color palette.
          */
-        "color": FeedbackColors;
+        "color": 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger';
         /**
           * The value determines how much of the active bar should display. The value should be between [0, 100].
          */
@@ -862,6 +912,10 @@ export namespace Components {
           * If the control is presented as a scrolling list box (e.g. when multiple is specified), this attribute represents the number of rows in the list that should be visible at one time.
          */
         "size": number;
+        /**
+          * The sizes of the input.
+         */
+        "sizes": 'lg' | 'xl';
         /**
           * the value of the select.
          */
@@ -1074,6 +1128,10 @@ export namespace Components {
           * The number of rows of the control.
          */
         "rows"?: number;
+        /**
+          * The sizes of the input.
+         */
+        "sizes": 'lg' | 'xl';
         /**
           * If `true`, the element will have its spelling and grammar checked.
          */
@@ -1121,6 +1179,52 @@ export namespace Components {
          */
         "timeout": number;
     }
+    interface RoadToggle {
+        /**
+          * If `true`, the toggle is checked.
+         */
+        "checked": boolean;
+        /**
+          * Set the color of alert. e.g. info, success, warning, danger
+         */
+        "color"?: 'secondary' | FeedbackColors;
+        /**
+          * If `true`, the user cannot interact with the toggle.
+         */
+        "disabled": boolean;
+        /**
+          * If `true`, the label is at left of the toggle
+         */
+        "hasLeftLabel": boolean;
+        /**
+          * Add space between label and toggle element
+         */
+        "isSpaced": boolean;
+        /**
+          * Label for the field
+         */
+        "label": string;
+        /**
+          * The name of the control, which is submitted with the form data.
+         */
+        "name": string;
+        /**
+          * Text display for "`off`" state in the toggle lever
+         */
+        "off": string;
+        /**
+          * Text display for "`on`" state in the toggle lever
+         */
+        "on": string;
+        /**
+          * The id of toggle
+         */
+        "toggleId": string;
+        /**
+          * Value the form will get
+         */
+        "value": string;
+    }
     interface RoadToolbar {
         /**
           * Background color of the toolbar
@@ -1266,6 +1370,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: {
@@ -1458,6 +1568,12 @@ declare global {
         prototype: HTMLRoadToastElement;
         new (): HTMLRoadToastElement;
     };
+    interface HTMLRoadToggleElement extends Components.RoadToggle, HTMLStencilElement {
+    }
+    var HTMLRoadToggleElement: {
+        prototype: HTMLRoadToggleElement;
+        new (): HTMLRoadToggleElement;
+    };
     interface HTMLRoadToolbarElement extends Components.RoadToolbar, HTMLStencilElement {
     }
     var HTMLRoadToolbarElement: {
@@ -1494,6 +1610,7 @@ declare global {
         "road-dialog": HTMLRoadDialogElement;
         "road-drawer": HTMLRoadDrawerElement;
         "road-dropdown": HTMLRoadDropdownElement;
+        "road-duration": HTMLRoadDurationElement;
         "road-flap": HTMLRoadFlapElement;
         "road-grid": HTMLRoadGridElement;
         "road-icon": HTMLRoadIconElement;
@@ -1526,6 +1643,7 @@ declare global {
         "road-text": HTMLRoadTextElement;
         "road-textarea": HTMLRoadTextareaElement;
         "road-toast": HTMLRoadToastElement;
+        "road-toggle": HTMLRoadToggleElement;
         "road-toolbar": HTMLRoadToolbarElement;
         "road-toolbar-title": HTMLRoadToolbarTitleElement;
         "road-tooltip": HTMLRoadTooltipElement;
@@ -1580,7 +1698,7 @@ declare namespace LocalJSX {
         /**
           * The color to use from your application's color palette.
          */
-        "color"?: Color;
+        "color"?: 'primary' | 'secondary' | 'default';
         /**
           * If `true`, the user cannot interact with the button.
          */
@@ -1616,7 +1734,7 @@ declare namespace LocalJSX {
         /**
           * The button size.
          */
-        "size"?: 'sm' | 'md' | 'lg';
+        "size"?: 'sm' | 'md' | 'lg' | 'xl';
         /**
           * Specifies where to display the linked URL. Only applies when an `href` is provided. Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
          */
@@ -1756,6 +1874,10 @@ declare namespace LocalJSX {
           * Error message for the field
          */
         "error"?: string;
+        /**
+          * If `true`, the checkbox will visually appear as indeterminate.
+         */
+        "indeterminate"?: boolean;
         /**
           * If `true`, the label and the checkbox are inverse and spaced
          */
@@ -1950,11 +2072,44 @@ declare namespace LocalJSX {
          */
         "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.
          */
         "color"?: 'promo' | 'exclu' | 'info' | 'ecology';
+        /**
+          * The button size.
+         */
+        "size"?: 'sm' | 'md';
     }
     interface RoadGrid {
     }
@@ -2125,6 +2280,10 @@ declare namespace LocalJSX {
           * The initial size of the control. This value is in pixels unless the value of the type attribute is `"text"` or `"password"`, in which case it is an integer number of characters. This attribute applies only when the `type` attribute is set to `"text"`, `"search"`, `"tel"`, `"url"`, `"email"`, or `"password"`, otherwise it is ignored.
          */
         "size"?: number;
+        /**
+          * The sizes of the input.
+         */
+        "sizes"?: 'lg' | 'xl';
         /**
           * If `true`, the element will have its spelling and grammar checked.
          */
@@ -2265,6 +2424,10 @@ declare namespace LocalJSX {
           * country of the plate
          */
         "country"?: 'FR' | 'BE' | 'IT' | 'ES' | 'PT' | 'PL';
+        /**
+          * If `true`, the user cannot interact with the input.
+         */
+        "disabled"?: boolean;
         /**
           * Enable motorbike display
          */
@@ -2291,6 +2454,10 @@ declare namespace LocalJSX {
           * overwrite the default placeholder
          */
         "placeholder"?: string;
+        /**
+          * If `true`, the user cannot modify the value.
+         */
+        "readonly"?: boolean;
         /**
           * The value of the input.
          */
@@ -2300,7 +2467,7 @@ declare namespace LocalJSX {
         /**
           * The color to use from your application's color palette.
          */
-        "color"?: FeedbackColors;
+        "color"?: 'primary' | 'secondary' | 'info' | 'success' | 'warning' | 'danger';
         /**
           * The value determines how much of the active bar should display. The value should be between [0, 100].
          */
@@ -2495,6 +2662,10 @@ declare namespace LocalJSX {
           * If the control is presented as a scrolling list box (e.g. when multiple is specified), this attribute represents the number of rows in the list that should be visible at one time.
          */
         "size"?: number;
+        /**
+          * The sizes of the input.
+         */
+        "sizes"?: 'lg' | 'xl';
         /**
           * the value of the select.
          */
@@ -2736,6 +2907,10 @@ declare namespace LocalJSX {
           * The number of rows of the control.
          */
         "rows"?: number;
+        /**
+          * The sizes of the input.
+         */
+        "sizes"?: 'lg' | 'xl';
         /**
           * If `true`, the element will have its spelling and grammar checked.
          */
@@ -2779,6 +2954,67 @@ declare namespace LocalJSX {
          */
         "timeout"?: number;
     }
+    interface RoadToggle {
+        /**
+          * If `true`, the toggle is checked.
+         */
+        "checked"?: boolean;
+        /**
+          * Set the color of alert. e.g. info, success, warning, danger
+         */
+        "color"?: 'secondary' | FeedbackColors;
+        /**
+          * If `true`, the user cannot interact with the toggle.
+         */
+        "disabled"?: boolean;
+        /**
+          * If `true`, the label is at left of the toggle
+         */
+        "hasLeftLabel"?: boolean;
+        /**
+          * Add space between label and toggle element
+         */
+        "isSpaced"?: boolean;
+        /**
+          * Label for the field
+         */
+        "label"?: string;
+        /**
+          * The name of the control, which is submitted with the form data.
+         */
+        "name"?: string;
+        /**
+          * Text display for "`off`" state in the toggle lever
+         */
+        "off"?: string;
+        /**
+          * Text display for "`on`" state in the toggle lever
+         */
+        "on"?: string;
+        /**
+          * Emitted when the toggle loses focus.
+         */
+        "onRoadblur"?: (event: CustomEvent<void>) => void;
+        /**
+          * Emitted when the checked property has changed.
+         */
+        "onRoadchange"?: (event: CustomEvent<{
+    checked: boolean;
+    value: string | undefined | null
+  }>) => void;
+        /**
+          * Emitted when the toggle has focus.
+         */
+        "onRoadfocus"?: (event: CustomEvent<void>) => void;
+        /**
+          * The id of toggle
+         */
+        "toggleId"?: string;
+        /**
+          * Value the form will get
+         */
+        "value"?: string;
+    }
     interface RoadToolbar {
         /**
           * Background color of the toolbar
@@ -2830,6 +3066,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;
@@ -2862,6 +3099,7 @@ declare namespace LocalJSX {
         "road-text": RoadText;
         "road-textarea": RoadTextarea;
         "road-toast": RoadToast;
+        "road-toggle": RoadToggle;
         "road-toolbar": RoadToolbar;
         "road-toolbar-title": RoadToolbarTitle;
         "road-tooltip": RoadTooltip;
@@ -2888,6 +3126,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>;
@@ -2920,6 +3159,7 @@ declare module "@stencil/core" {
             "road-text": LocalJSX.RoadText & JSXBase.HTMLAttributes<HTMLRoadTextElement>;
             "road-textarea": LocalJSX.RoadTextarea & JSXBase.HTMLAttributes<HTMLRoadTextareaElement>;
             "road-toast": LocalJSX.RoadToast & JSXBase.HTMLAttributes<HTMLRoadToastElement>;
+            "road-toggle": LocalJSX.RoadToggle & JSXBase.HTMLAttributes<HTMLRoadToggleElement>;
             "road-toolbar": LocalJSX.RoadToolbar & JSXBase.HTMLAttributes<HTMLRoadToolbarElement>;
             "road-toolbar-title": LocalJSX.RoadToolbarTitle & JSXBase.HTMLAttributes<HTMLRoadToolbarTitleElement>;
             "road-tooltip": LocalJSX.RoadTooltip & JSXBase.HTMLAttributes<HTMLRoadTooltipElement>;