@roadtrip/components 3.11.0 → 3.11.2

package/dist/collection/components/modal/modal.js

@@ -1,5 +1,5 @@
-import { h, Host } from '@stencil/core';
-import { navigationClose } from '../../../icons';
+import { h, Host } from "@stencil/core";
+import { navigationClose } from "../../../icons";
 /**
  * @slot  - Content of the modal.
  */
@@ -187,7 +187,8 @@ export class Modal {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"
@@ -203,7 +204,8 @@ export class Modal {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<void>"

package/dist/collection/components/modal/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Method, Prop, h, Host } from '@stencil/core';\nimport { navigationClose } from '../../../icons';\n\n/**\n * @slot  - Content of the modal.\n */\n\n@Component({\n  tag: 'road-modal',\n  styleUrl: 'modal.css',\n  shadow: true,\n})\nexport class Modal {\n\n  /**\n   * Current reference of the modal\n   */\n  @Element() el!: HTMLRoadModalElement;\n\n  /**\n   * Max width of the modal on desktop\n   */\n  @Prop() maxWidth: number = 696;\n\n  /**\n   * Set isOpen propertie to true to show the modal\n   */\n  @Prop({ mutable: true }) isOpen: boolean = false;\n\n  /**\n   * inverse header colors\n   */\n  @Prop() hasInverseHeader: boolean = false;\n\n  /**\n   * Title of the modal in the header bar\n   */\n  @Prop() modalTitle?: string;\n\n  /**\n   * Show / hide close icon\n   */\n  @Prop() hasCloseIcon: boolean = true;\n\n  /**\n   * Indicate when closing the modal\n   */\n  @Event({ eventName: 'close' }) onClose!: EventEmitter<void>;\n\n  /**\n   * Open the modal\n   */\n  @Method()\n  async open() {\n    this.isOpen = true;\n  }\n\n  /**\n   * Close the modal\n   */\n  @Method()\n  async close() {\n    this.isOpen = false;\n    this.el.addEventListener('transitionend', () => {\n      this.onClose.emit();\n    }, { once: true});\n  }\n\n  /**\n   * Close the dialog when clicking on the cross or layer\n   */\n  private onClick = (ev: UIEvent) => {\n    ev.stopPropagation();\n    ev.preventDefault();\n\n    this.close();\n  };\n\n  /**\n   * Close the dialog when press Escape key\n   */\n  @Listen('keyup', { target: 'document' })\n  onEscape(event: KeyboardEvent) {\n    if (event.key === 'Escape' || event.key === \"Esc\") {\n      this.close();\n    }\n  }\n\n  /**\n   * Call close function when clicking an element with data-dismiss=\"modal\" attribute\n   */\n  componentDidLoad() {\n    this.el.querySelectorAll('[data-dismiss=\"modal\"]').forEach(item => {\n      item.addEventListener('click', () => this.close());\n    });\n  }\n\n  render() {\n    const modalIsOpenClass = this.isOpen ? 'modal-open' : '';\n    const inverseHeaderClass = this.hasInverseHeader ? 'modal-header-inverse' : '';\n    const closeIconElement = this.hasCloseIcon ? <button type=\"button\" class=\"modal-close\" onClick={this.onClick} aria-label=\"Close\"><road-icon icon={navigationClose} aria-hidden=\"true\"></road-icon></button> : '';\n\n    return (\n      <Host class={`modal ${modalIsOpenClass}`} tabindex=\"-1\" role=\"dialog\">\n        <div class=\"modal-overlay\" onClick={this.onClick} tabindex=\"-1\"></div>\n        <div class=\"modal-dialog\" style={{ maxWidth: `${this.maxWidth}px` }} role=\"document\" tabindex=\"0\">\n          <div class=\"modal-content\">\n            <header class={`modal-header ${inverseHeaderClass}`}>\n              <h2 class=\"modal-title\">{this.modalTitle}</h2>\n              {closeIconElement}\n            </header>\n            <div class=\"modal-body\">\n              <slot/>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}"]}
+{"version":3,"file":"modal.js","sourceRoot":"","sources":["../../../src/components/modal/modal.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Listen, Method, Prop, h, Host } from '@stencil/core';\nimport { navigationClose } from '../../../icons';\n\n/**\n * @slot  - Content of the modal.\n */\n\n@Component({\n  tag: 'road-modal',\n  styleUrl: 'modal.css',\n  shadow: true,\n})\nexport class Modal {\n\n  /**\n   * Current reference of the modal\n   */\n  @Element() el!: HTMLRoadModalElement;\n\n  /**\n   * Max width of the modal on desktop\n   */\n  @Prop() maxWidth: number = 696;\n\n  /**\n   * Set isOpen propertie to true to show the modal\n   */\n  @Prop({ mutable: true }) isOpen: boolean = false;\n\n  /**\n   * inverse header colors\n   */\n  @Prop() hasInverseHeader: boolean = false;\n\n  /**\n   * Title of the modal in the header bar\n   */\n  @Prop() modalTitle?: string;\n\n  /**\n   * Show / hide close icon\n   */\n  @Prop() hasCloseIcon: boolean = true;\n\n  /**\n   * Indicate when closing the modal\n   */\n  @Event({ eventName: 'close' }) onClose!: EventEmitter<void>;\n\n  /**\n   * Open the modal\n   */\n  @Method()\n  async open() {\n    this.isOpen = true;\n  }\n\n  /**\n   * Close the modal\n   */\n  @Method()\n  async close() {\n    this.isOpen = false;\n    this.el.addEventListener('transitionend', () => {\n      this.onClose.emit();\n    }, { once: true});\n  }\n\n  /**\n   * Close the dialog when clicking on the cross or layer\n   */\n  private onClick = (ev: UIEvent) => {\n    ev.stopPropagation();\n    ev.preventDefault();\n\n    this.close();\n  };\n\n  /**\n   * Close the dialog when press Escape key\n   */\n  @Listen('keyup', { target: 'document' })\n  onEscape(event: KeyboardEvent) {\n    if (event.key === 'Escape' || event.key === \"Esc\") {\n      this.close();\n    }\n  }\n\n  /**\n   * Call close function when clicking an element with data-dismiss=\"modal\" attribute\n   */\n  componentDidLoad() {\n    this.el.querySelectorAll('[data-dismiss=\"modal\"]').forEach(item => {\n      item.addEventListener('click', () => this.close());\n    });\n  }\n\n  render() {\n    const modalIsOpenClass = this.isOpen ? 'modal-open' : '';\n    const inverseHeaderClass = this.hasInverseHeader ? 'modal-header-inverse' : '';\n    const closeIconElement = this.hasCloseIcon ? <button type=\"button\" class=\"modal-close\" onClick={this.onClick} aria-label=\"Close\"><road-icon icon={navigationClose} aria-hidden=\"true\"></road-icon></button> : '';\n\n    return (\n      <Host class={`modal ${modalIsOpenClass}`} tabindex=\"-1\" role=\"dialog\">\n        <div class=\"modal-overlay\" onClick={this.onClick} tabindex=\"-1\"></div>\n        <div class=\"modal-dialog\" style={{ maxWidth: `${this.maxWidth}px` }} role=\"document\" tabindex=\"0\">\n          <div class=\"modal-content\">\n            <header class={`modal-header ${inverseHeaderClass}`}>\n              <h2 class=\"modal-title\">{this.modalTitle}</h2>\n              {closeIconElement}\n            </header>\n            <div class=\"modal-body\">\n              <slot/>\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}"]}

package/dist/collection/components/navbar/navbar.js

@@ -1,5 +1,5 @@
-import { Host, h } from '@stencil/core';
-import './../../utils/polyfill';
+import { Host, h } from "@stencil/core";
+import "./../../utils/polyfill";
 /**
  * @slot  - Content of the navbar, it should be road-navbar-item elements. Max 5 items on Mobile
  */

package/dist/collection/components/navbar-item/navbar-item.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot  - Content of the item, it should be road-icon and road-label elements.
  *

package/dist/collection/components/phone-number-input/phone-number-input.js

@@ -1,5 +1,5 @@
-import { Host, h } from '@stencil/core';
-import { PhoneNumberFormat, PhoneNumberType, PhoneNumberUtil, } from 'google-libphonenumber';
+import { Host, h } from "@stencil/core";
+import { PhoneNumberFormat, PhoneNumberType, PhoneNumberUtil, } from "google-libphonenumber";
 export class RoadPhoneNumberInput {
   constructor() {
     this.countryData = [];
@@ -32,21 +32,6 @@ export class RoadPhoneNumberInput {
     if (this.numberType && this.numberType !== 'FIXED_LINE' && this.numberType !== 'MOBILE') {
       this.numberType = '';
     }
-    if (this.inputValue) {
-      this.phoneNumber = this.inputValue;
-      function recupererCaracteres(s) {
-        if (s.substring(0, 2) === "00") {
-          return s.substring(2, 4);
-        }
-        else {
-          return null;
-        }
-      }
-      const chaine = this.inputValue;
-      const resultat = recupererCaracteres(chaine);
-      this.areaValue = resultat;
-      this.selectedCountry = this.getPhoneCountryCode(this.areaValue);
-    }
     if (this.areaValue) {
       this.selectedCountry = this.getPhoneCountryCode(this.areaValue);
     }
@@ -55,6 +40,25 @@ export class RoadPhoneNumberInput {
         this.selectedCountry = this.countryData[0].countryCode;
       }
     }
+    if (this.inputValue) {
+      //   this.phoneNumber = this.inputValue;
+      //   function recupererCaracteres(s: string ) {
+      //     if (s.substring(0, 2) === "00") {
+      //       return s.substring(2, 4);
+      //     } else {
+      //       return null;
+      //     }
+      //   }
+      //   const chaine = this.inputValue;
+      //   const resultat = recupererCaracteres(chaine);
+      //   this.areaValue = resultat as string;
+      //   this.selectedCountry = this.getPhoneCountryCode(this.areaValue);
+      this.handleInput({
+        detail: {
+          value: this.inputValue,
+        },
+      });
+    }
     this.updateCountryOptions();
   }
   getPhoneCountryCode(phoneCode) {
@@ -152,6 +156,8 @@ export class RoadPhoneNumberInput {
     catch (_e) { }
     finally {
       this.roadPhoneNumberInput.emit(returnObject);
+      // console.log(returnObject.phone.phoneCode);
+      // returnObject.phone.phoneCode = '';
     }
   }
   setAndPlaceErrorMessage(message) {
@@ -220,7 +226,8 @@ export class RoadPhoneNumberInput {
           "resolved": "CountryType[]",
           "references": {
             "CountryType": {
-              "location": "global"
+              "location": "global",
+              "id": "global::CountryType"
             }
           }
         },
@@ -383,7 +390,8 @@ export class RoadPhoneNumberInput {
           "resolved": "{ isError: boolean; phone: PhoneReturnType; }",
           "references": {
             "PhoneReturnType": {
-              "location": "global"
+              "location": "global",
+              "id": "global::PhoneReturnType"
             }
           }
         }

package/dist/collection/components/phone-number-input/phone-number-input.js.map

@@ -1 +1 @@
-{"version":3,"file":"phone-number-input.js","sourceRoot":"","sources":["../../../src/components/phone-number-input/phone-number-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, Host, State, h, Watch, Event, EventEmitter } from '@stencil/core';\nimport {\n  PhoneNumberFormat,\n  PhoneNumberType,\n  PhoneNumberUtil,\n} from 'google-libphonenumber';\n\ntype CountryType = {\n  translations: { [key: string]: string },\n  countryCode: string,\n  phoneCode: string\n};\n\ninterface PhoneReturnType {\n  phoneNumberType: string;\n  countryCode: string;\n  nationalNumber: string;\n  phoneCode: string;\n  internationalNumber: string;\n}\n\ninterface Translations {\n  fixed: TranslationLanguages;\n  mobile: TranslationLanguages;\n  default: TranslationLanguages;\n}\n\ninterface TranslationLanguages {\n  fr: string;\n  en: string;\n  es: string;\n  pt: string;\n  nl: string;\n  de: string;\n  it: string;\n  [key: string]: string;\n}\n\n@Component({\n  tag: 'road-phone-number-input',\n  styleUrl: 'phone-number-input.css',\n  scoped: true,\n})\nexport class RoadPhoneNumberInput {\n\n  /**\n * Emitt object data.\n */\n  @Event() roadPhoneNumberInput!: EventEmitter<{\n    isError: boolean;\n    phone: PhoneReturnType;\n  }>;\n\n  @Element() el!: HTMLRoadPhoneNumberInputElement;\n\n  /**\n   * The country data \n   */\n  @Prop() countryData: CountryType[] = [];\n\n  /**\n   * The translation language of the countries\n   */\n  @Prop() language: string = 'fr';\n\n  /**\n   * The label display in the select area\n   */\n  @Prop() areaLabel: string = 'Country';\n\n  /**\n   * The indicatif display in the select area\n   */\n  @Prop({ mutable: true }) areaValue: string = '';\n\n  /**\n   * The label display in the input\n   */\n  @Prop() inputLabel: string = 'Number';\n\n  /**\n   * The value of the input\n   */\n  @Prop() inputValue: string = '';\n\n  /**\n   * Type of the phone number : FIXED_LINE, MOBILE\n   */\n  @Prop() numberType?: string;\n\n  /**\n * If `true`, the user must fill in a value before submitting a form.\n */\n  @Prop() required = false;\n\n  @State() selectedCountry: string = '';\n  @State() phoneNumber: string = '';\n\n  @State() inputError: string = '';\n\n  @State() countryOptions: { value: string; label: string; selected: boolean }[] = [];\n\n  @Watch('language')\n  languageChanged() {\n    this.updateCountryOptions();\n  }\n\n  updateCountryOptions() {\n    const validLanguage = this.language && this.countryData[0].translations[this.language] ? this.language : 'fr';\n    this.countryOptions = this.countryData.map(country => {\n      return {\n        value: country.phoneCode,\n        label: `${country.translations[validLanguage]} (+${country.phoneCode})`,\n        selected: country.countryCode === this.selectedCountry,  // Ici, nous marquons l'option par défaut comme sélectionnée\n      };\n    });\n  }\n\n  componentWillLoad() {\n    if (this.numberType && this.numberType !== 'FIXED_LINE' && this.numberType !== 'MOBILE') {\n      this.numberType = '';\n    }\n\n    if (this.inputValue) {\n      this.phoneNumber = this.inputValue;\n\n      function recupererCaracteres(s: string ) {\n        if (s.substring(0, 2) === \"00\") {\n          return s.substring(2, 4);\n        } else {\n          return null;\n        }\n      }\n      \n      const chaine = this.inputValue;\n      const resultat = recupererCaracteres(chaine);\n      \n      this.areaValue = resultat as string;\n      this.selectedCountry = this.getPhoneCountryCode(this.areaValue);\n    }\n\n    if (this.areaValue) {\n      this.selectedCountry = this.getPhoneCountryCode(this.areaValue);\n    } else {\n      if (this.countryData && this.countryData.length > 0) {\n        this.selectedCountry = this.countryData[0].countryCode;\n      }\n    }\n\n    this.updateCountryOptions();\n  }\n\n  getPhoneCountryCode(phoneCode: string): string {\n    return this.countryData.find((country) => country.phoneCode === phoneCode)?.countryCode ?? '';\n  }\n\n  handleSelect(event: any) {\n    const receivedPhoneCode = event.detail.value.replace('+', '');\n    const phoneCountryCode = this.getPhoneCountryCode(receivedPhoneCode);\n\n    this.selectedCountry = phoneCountryCode;\n\n    this.createReturnObject();\n  }\n\n  createReturnObject() {\n    const returnObject = {\n      isError: true,\n      phone: {\n        phoneNumberType: 'UNKNOWN',\n        countryCode: this.selectedCountry,\n        nationalNumber: this.phoneNumber,\n        phoneCode: this.countryData.find((country) => country.countryCode === this.selectedCountry)?.phoneCode ?? '',\n        internationalNumber: this.phoneNumber,\n      },\n    };\n\n    // create instance\n    const phoneUtil = PhoneNumberUtil.getInstance();\n    const PNF = PhoneNumberFormat;\n\n    // Parse and verify the phone number\n    try {\n      const parsedPhoneNumber = phoneUtil.parse(this.phoneNumber, this.selectedCountry as any);\n\n      const phoneCode = parsedPhoneNumber.getCountryCode() as any;\n\n      // get the phone's country code and updates the areaValue \n      if (phoneUtil.getRegionCodeForNumber(parsedPhoneNumber)) {\n        this.selectedCountry = phoneUtil.getRegionCodeForNumber(parsedPhoneNumber)!;\n\n        const computedPhoneCode = this.countryData.find(country => country.countryCode == this.selectedCountry)?.phoneCode ?? '';\n        this.areaValue = computedPhoneCode;\n      }\n\n      const errorTranslation: Translations = {\n        fixed: {\n          fr: 'N° de fixe attendu',\n          en: 'Expected landline number',\n          es: 'Número de teléfono fijo esperado',\n          pt: 'Número de telefone fixo esperado',\n          nl: 'Verwacht vast nummer',\n          de: 'Erwartete Festnetznummer',\n          it: 'Numero di rete fissa previsto',\n        },\n        mobile: {\n          fr: 'N° de mobile attendu',\n          en: 'Expected mobile number',\n          es: 'Número de móvil esperado',\n          pt: 'Número de celular esperado',\n          nl: 'Verwacht mobiel nummer',\n          de: 'Erwartete Handynummer',\n          it: 'Numero di cellulare previsto',\n        },\n        default: {\n          fr: 'Numéro de téléphone non valide',\n          en: 'Invalid phone number',\n          es: 'Numero de telefono invalido',\n          pt: 'Número de telefone inválido',\n          nl: 'Ongeldig telefoonnummer',\n          de: 'Ungültige Telefonnummer',\n          it: 'Numero di telefono invalido',\n        },\n      };\n\n      if (parsedPhoneNumber && phoneUtil.isValidNumber(parsedPhoneNumber)) {\n        this.setAndPlaceErrorMessage('');\n\n        const phoneType = Object.entries(PhoneNumberType).find(entry => entry[1] === phoneUtil.getNumberType(parsedPhoneNumber))!;\n        \n        returnObject.isError = false;\n        returnObject.phone = {\n          phoneNumberType: phoneType[0],\n          countryCode: phoneUtil.getRegionCodeForNumber(parsedPhoneNumber) as any,\n          phoneCode,\n          nationalNumber: phoneUtil.format(parsedPhoneNumber, PNF.NATIONAL),\n          internationalNumber: phoneUtil.format(parsedPhoneNumber, PNF.E164),\n        };\n        \n        if (phoneType[0] !== this.numberType) {\n          switch(this.numberType) {\n            case 'FIXED_LINE':\n              this.setAndPlaceErrorMessage(errorTranslation.fixed[this.language]);\n              break;\n            case 'MOBILE':\n              this.setAndPlaceErrorMessage(errorTranslation.mobile[this.language]);\n              break;\n            default:\n              this.setAndPlaceErrorMessage('');\n          }\n        }\n      }\n       else {\n        this.setAndPlaceErrorMessage(errorTranslation.default[this.language]);\n      }\n    }\n    catch {}\n    finally {\n      this.roadPhoneNumberInput.emit(returnObject);\n    }\n  }\n\n  setAndPlaceErrorMessage(message: string) {\n    this.inputError = message;\n\n    this.waitForElementToExist('.invalid-feedback').then((messError: HTMLElement) => {\n      messError.style.display = \"block\";\n      messError.style.marginTop = \"-0.5rem\";\n      const phoneNumberInput = (this.el as HTMLRoadPhoneNumberInputElement);\n      phoneNumberInput.appendChild(messError);\n    });\n  }\n\n  waitForElementToExist(selector: string): Promise<HTMLElement> {\n    return new Promise(resolve => {\n      if (document.querySelector(selector)) {\n        return resolve(document.querySelector(selector) as HTMLElement);\n      }\n  \n      const observer = new MutationObserver(() => {\n        if (document.querySelector(selector)) {\n          resolve(document.querySelector(selector) as HTMLElement);\n          observer.disconnect();\n        }\n      });\n  \n      observer.observe(document.body, {\n        subtree: true,\n        childList: true,\n      });\n    });\n  }\n\n  handleInput(event: any) {\n    this.updateCountryOptions();\n\n    this.phoneNumber = event.detail.value;\n\n    this.createReturnObject();\n  }\n\n  /**\n   * Emitted the value and label of the option selected.\n   */\n  @Event() roadselected!: EventEmitter<{\n    value: string | undefined | null,\n    label: string\n  }>;\n  /** @internal */\n  @Event() roadSelected!: EventEmitter<{\n    value: string | undefined | null,\n    label: string\n  }>;\n\n  extractCallingCode(countryString: string) {\n    const regex = /\\(([^)]+)\\)/;\n    const found = countryString.match(regex);\n    return found ? found[1] : '';\n  }\n\n  selectCountry(event: CustomEvent) {\n    const countryString = event.detail.value;  // Get the value from the custom event\n    this.selectedCountry = this.extractCallingCode(countryString);\n    (this.el.querySelector('.form-select-area-value') as HTMLElement).innerHTML = countryString;\n  }\n\n  render() {\n    return (\n      <Host\n      numberType={this.numberType}>\n        <road-input-group>\n          <road-area-code\n            slot=\"prepend\"\n            class={`form-select has-value`}\n            label={this.areaLabel}\n            value={this.areaValue}\n            sizes=\"xl\"\n            options={this.countryOptions}\n            onRoadchange={(event) => this.handleSelect(event)}\n          ></road-area-code>\n          <road-input\n            id=\"phone-number\"\n            sizes=\"xl\"\n            label={this.inputLabel}\n            value={this.inputValue}\n            onRoadChange={(event) => this.handleInput(event)}\n            required={this.required}\n            error={this.inputError}\n          >\n          </road-input>\n        </road-input-group>\n      </Host>\n    );\n  }\n}\n\n\n"]}
+{"version":3,"file":"phone-number-input.js","sourceRoot":"","sources":["../../../src/components/phone-number-input/phone-number-input.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, Element, Host, State, h, Watch, Event, EventEmitter } from '@stencil/core';\nimport {\n  PhoneNumberFormat,\n  PhoneNumberType,\n  PhoneNumberUtil,\n} from 'google-libphonenumber';\n\ntype CountryType = {\n  translations: { [key: string]: string },\n  countryCode: string,\n  phoneCode: string\n};\n\ninterface PhoneReturnType {\n  phoneNumberType: string;\n  countryCode: string;\n  nationalNumber: string;\n  phoneCode: string;\n  internationalNumber: string;\n}\n\ninterface Translations {\n  fixed: TranslationLanguages;\n  mobile: TranslationLanguages;\n  default: TranslationLanguages;\n}\n\ninterface TranslationLanguages {\n  fr: string;\n  en: string;\n  es: string;\n  pt: string;\n  nl: string;\n  de: string;\n  it: string;\n  [key: string]: string;\n}\n\n@Component({\n  tag: 'road-phone-number-input',\n  styleUrl: 'phone-number-input.css',\n  scoped: true,\n})\nexport class RoadPhoneNumberInput {\n\n  /**\n * Emitt object data.\n */\n  @Event() roadPhoneNumberInput!: EventEmitter<{\n    isError: boolean;\n    phone: PhoneReturnType;\n  }>;\n\n  @Element() el!: HTMLRoadPhoneNumberInputElement;\n\n  /**\n   * The country data \n   */\n  @Prop() countryData: CountryType[] = [];\n\n  /**\n   * The translation language of the countries\n   */\n  @Prop() language: string = 'fr';\n\n  /**\n   * The label display in the select area\n   */\n  @Prop() areaLabel: string = 'Country';\n\n  /**\n   * The indicatif display in the select area\n   */\n  @Prop({ mutable: true }) areaValue: string = '';\n\n  /**\n   * The label display in the input\n   */\n  @Prop() inputLabel: string = 'Number';\n\n  /**\n   * The value of the input\n   */\n  @Prop() inputValue: string = '';\n\n  /**\n   * Type of the phone number : FIXED_LINE, MOBILE\n   */\n  @Prop() numberType?: string;\n\n  /**\n * If `true`, the user must fill in a value before submitting a form.\n */\n  @Prop() required = false;\n\n  @State() selectedCountry: string = '';\n  @State() phoneNumber: string = '';\n\n  @State() inputError: string = '';\n\n  @State() countryOptions: { value: string; label: string; selected: boolean }[] = [];\n\n  @Watch('language')\n  languageChanged() {\n    this.updateCountryOptions();\n  }\n\n  updateCountryOptions() {\n    const validLanguage = this.language && this.countryData[0].translations[this.language] ? this.language : 'fr';\n    this.countryOptions = this.countryData.map(country => {\n      return {\n        value: country.phoneCode,\n        label: `${country.translations[validLanguage]} (+${country.phoneCode})`,\n        selected: country.countryCode === this.selectedCountry,  // Ici, nous marquons l'option par défaut comme sélectionnée\n      };\n    });\n  }\n\n  componentWillLoad() {\n    if (this.numberType && this.numberType !== 'FIXED_LINE' && this.numberType !== 'MOBILE') {\n      this.numberType = '';\n    }\n\n    if (this.areaValue) {\n      this.selectedCountry = this.getPhoneCountryCode(this.areaValue);\n    } else {\n      if (this.countryData && this.countryData.length > 0) {\n        this.selectedCountry = this.countryData[0].countryCode;\n      }\n    }\n\n    if (this.inputValue) {\n    //   this.phoneNumber = this.inputValue;\n\n    //   function recupererCaracteres(s: string ) {\n    //     if (s.substring(0, 2) === \"00\") {\n    //       return s.substring(2, 4);\n    //     } else {\n    //       return null;\n    //     }\n    //   }\n      \n    //   const chaine = this.inputValue;\n    //   const resultat = recupererCaracteres(chaine);\n      \n    //   this.areaValue = resultat as string;\n    //   this.selectedCountry = this.getPhoneCountryCode(this.areaValue);\n\n      this.handleInput({\n        detail: {\n          value: this.inputValue,\n        },\n      });\n    }\n\n    this.updateCountryOptions();\n  }\n\n  getPhoneCountryCode(phoneCode: string): string {\n    return this.countryData.find((country) => country.phoneCode === phoneCode)?.countryCode ?? '';\n  }\n\n  handleSelect(event: any) {\n    const receivedPhoneCode = event.detail.value.replace('+', '');\n    const phoneCountryCode = this.getPhoneCountryCode(receivedPhoneCode);\n\n    this.selectedCountry = phoneCountryCode;\n\n    this.createReturnObject();\n  }\n\n  createReturnObject() {\n    const returnObject = {\n      isError: true,\n      phone: {\n        phoneNumberType: 'UNKNOWN',\n        countryCode: this.selectedCountry,\n        nationalNumber: this.phoneNumber,\n        phoneCode: this.countryData.find((country) => country.countryCode === this.selectedCountry)?.phoneCode ?? '',\n        internationalNumber: this.phoneNumber,\n      },\n    };\n\n    // create instance\n    const phoneUtil = PhoneNumberUtil.getInstance();\n    const PNF = PhoneNumberFormat;\n\n    // Parse and verify the phone number\n    try {\n      const parsedPhoneNumber = phoneUtil.parse(this.phoneNumber, this.selectedCountry as any);\n\n      const phoneCode = parsedPhoneNumber.getCountryCode() as any;\n      // get the phone's country code and updates the areaValue \n      if (phoneUtil.getRegionCodeForNumber(parsedPhoneNumber)) {\n        this.selectedCountry = phoneUtil.getRegionCodeForNumber(parsedPhoneNumber)!;\n\n        const computedPhoneCode = this.countryData.find(country => country.countryCode == this.selectedCountry)?.phoneCode ?? '';\n\n        this.areaValue = computedPhoneCode;\n      }\n\n      const errorTranslation: Translations = {\n        fixed: {\n          fr: 'N° de fixe attendu',\n          en: 'Expected landline number',\n          es: 'Número de teléfono fijo esperado',\n          pt: 'Número de telefone fixo esperado',\n          nl: 'Verwacht vast nummer',\n          de: 'Erwartete Festnetznummer',\n          it: 'Numero di rete fissa previsto',\n        },\n        mobile: {\n          fr: 'N° de mobile attendu',\n          en: 'Expected mobile number',\n          es: 'Número de móvil esperado',\n          pt: 'Número de celular esperado',\n          nl: 'Verwacht mobiel nummer',\n          de: 'Erwartete Handynummer',\n          it: 'Numero di cellulare previsto',\n        },\n        default: {\n          fr: 'Numéro de téléphone non valide',\n          en: 'Invalid phone number',\n          es: 'Numero de telefono invalido',\n          pt: 'Número de telefone inválido',\n          nl: 'Ongeldig telefoonnummer',\n          de: 'Ungültige Telefonnummer',\n          it: 'Numero di telefono invalido',\n        },\n      };\n\n      if (parsedPhoneNumber && phoneUtil.isValidNumber(parsedPhoneNumber)) {\n        this.setAndPlaceErrorMessage('');\n\n        const phoneType = Object.entries(PhoneNumberType).find(entry => entry[1] === phoneUtil.getNumberType(parsedPhoneNumber))!;\n        \n        returnObject.isError = false;\n        returnObject.phone = {\n          phoneNumberType: phoneType[0],\n          countryCode: phoneUtil.getRegionCodeForNumber(parsedPhoneNumber) as any,\n          phoneCode,\n          nationalNumber: phoneUtil.format(parsedPhoneNumber, PNF.NATIONAL),\n          internationalNumber: phoneUtil.format(parsedPhoneNumber, PNF.E164),\n        };\n        \n        if (phoneType[0] !== this.numberType) {\n          switch(this.numberType) {\n            case 'FIXED_LINE':\n              this.setAndPlaceErrorMessage(errorTranslation.fixed[this.language]);\n              break;\n            case 'MOBILE':\n              this.setAndPlaceErrorMessage(errorTranslation.mobile[this.language]);\n              break;\n            default:\n              this.setAndPlaceErrorMessage('');\n          }\n        }\n      }\n       else {\n        this.setAndPlaceErrorMessage(errorTranslation.default[this.language]);\n      }\n    }\n    catch {}\n    finally {\n      this.roadPhoneNumberInput.emit(returnObject);\n      // console.log(returnObject.phone.phoneCode);\n      // returnObject.phone.phoneCode = '';\n      \n    }\n  }\n\n  setAndPlaceErrorMessage(message: string) {\n    this.inputError = message;\n\n    this.waitForElementToExist('.invalid-feedback').then((messError: HTMLElement) => {\n      messError.style.display = \"block\";\n      messError.style.marginTop = \"-0.5rem\";\n      const phoneNumberInput = (this.el as HTMLRoadPhoneNumberInputElement);\n      phoneNumberInput.appendChild(messError);\n    });\n  }\n\n  waitForElementToExist(selector: string): Promise<HTMLElement> {\n    return new Promise(resolve => {\n      if (document.querySelector(selector)) {\n        return resolve(document.querySelector(selector) as HTMLElement);\n      }\n  \n      const observer = new MutationObserver(() => {\n        if (document.querySelector(selector)) {\n          resolve(document.querySelector(selector) as HTMLElement);\n          observer.disconnect();\n        }\n      });\n  \n      observer.observe(document.body, {\n        subtree: true,\n        childList: true,\n      });\n    });\n  }\n\n  handleInput(event: any) {\n    this.updateCountryOptions();\n\n    this.phoneNumber = event.detail.value;\n    this.createReturnObject();\n  }\n\n  /**\n   * Emitted the value and label of the option selected.\n   */\n  @Event() roadselected!: EventEmitter<{\n    value: string | undefined | null,\n    label: string\n  }>;\n  /** @internal */\n  @Event() roadSelected!: EventEmitter<{\n    value: string | undefined | null,\n    label: string\n  }>;\n\n  extractCallingCode(countryString: string) {\n    const regex = /\\(([^)]+)\\)/;\n    const found = countryString.match(regex);\n    return found ? found[1] : '';\n  }\n\n  selectCountry(event: CustomEvent) {\n    const countryString = event.detail.value;  // Get the value from the custom event\n    this.selectedCountry = this.extractCallingCode(countryString);\n    (this.el.querySelector('.form-select-area-value') as HTMLElement).innerHTML = countryString;\n  }\n\n  render() {\n    return (\n      <Host\n      numberType={this.numberType}>\n        <road-input-group>\n          <road-area-code\n            slot=\"prepend\"\n            class={`form-select has-value`}\n            label={this.areaLabel}\n            value={this.areaValue}\n            sizes=\"xl\"\n            options={this.countryOptions}\n            onRoadchange={(event) => this.handleSelect(event)}\n          ></road-area-code>\n          <road-input\n            id=\"phone-number\"\n            sizes=\"xl\"\n            label={this.inputLabel}\n            value={this.inputValue}\n            onRoadChange={(event) => this.handleInput(event)}\n            required={this.required}\n            error={this.inputError}\n          >\n          </road-input>\n        </road-input-group>\n      </Host>\n    );\n  }\n}\n\n\n"]}

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

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { licensePlateStarEu } from '../../../icons';
+import { h } from "@stencil/core";
+import { licensePlateStarEu } from "../../../icons";
 export class PlateNumber {
   constructor() {
     this.countries = [
@@ -225,7 +225,8 @@ export class PlateNumber {
           "resolved": "KeyboardEvent",
           "references": {
             "KeyboardEvent": {
-              "location": "global"
+              "location": "global",
+              "id": "global::KeyboardEvent"
             }
           }
         }
@@ -247,7 +248,8 @@ export class PlateNumber {
           "resolved": "KeyboardEvent",
           "references": {
             "KeyboardEvent": {
-              "location": "global"
+              "location": "global",
+              "id": "global::KeyboardEvent"
             }
           }
         }

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

@@ -1 +1 @@
-{"version":3,"file":"plate-number.js","sourceRoot":"","sources":["../../../src/components/plate-number/plate-number.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,EAAgB,KAAK,EAAE,MAAM,eAAe,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAOpD,MAAM,OAAO,WAAW;;IAEd,cAAS,GAAG;MAClB;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,WAAW;OACzB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,WAAW;OACzB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,UAAU;OACxB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,UAAU;OACxB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,UAAU;OACxB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,IAAI;QACZ,WAAW,EAAE,UAAU;OACxB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,UAAU;OACxB;MACD;QACE,OAAO,EAAE,IAAI;QACb,MAAM,EAAE,GAAG;QACX,WAAW,EAAE,YAAY;OAC1B;KACF,CAAC;IA+EM,YAAO,GAAG,CAAC,EAAS,EAAE,EAAE;MAC9B,MAAM,KAAK,GAAG,EAAE,CAAC,MAAiC,CAAC;MACnD,IAAI,KAAK,EAAE;QACT,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,WAAW,EAAE,IAAI,EAAE,CAAC;OAC/C;MACD,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAmB,CAAC,CAAC;MACzC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,EAAmB,CAAC,CAAC;IAC3C,CAAC,CAAC;IAEM,WAAM,GAAG,GAAG,EAAE;MACpB,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;MACrB,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;IACvB,CAAC,CAAC;IAEM,YAAO,GAAG,GAAG,EAAE;MACrB,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;MACtB,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;IACxB,CAAC,CAAC;mBA3FuE,IAAI;oBAK1D,KAAK;;oBAUL,KAAK;iBAKkC,EAAE;;;EAO5D;;KAEG;EAEQ,YAAY;IACpB,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;IACzF,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC;EAC3F,CAAC;EAkCM,QAAQ;IACd,OAAO,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;MACnC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,EAAE;MACvB,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,QAAQ,EAAE,CAAC;EACpC,CAAC;EAqBD,MAAM;IACJ,MAAM,KAAK,GAAG,IAAI,CAAC,QAAQ,EAAE,CAAC;IAC9B,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,EAAE,CAAC;IAE/D,OAAO,CACL,wBAAkB,KAAK,EAAE,6BAA6B,IAAI,CAAC,OAAO,CAAC,WAAW,EAAE,IAAI,cAAc,EAAE;MAClG,aAAO,IAAI,EAAC,SAAS,EAAC,KAAK,EAAC,qBAAqB;QAC/C,WAAK,KAAK,EAAC,oBAAoB;UAC7B,iBAAW,KAAK,EAAC,mBAAmB,EAAC,IAAI,EAAE,kBAAkB,GAAc;UAC3E,WAAK,KAAK,EAAC,uBAAuB,IAC/B,IAAI,CAAC,SAAS;aACZ,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CACtD,CACF,CACA;MACP,IAAI,CAAC,SAAS;QACb,CAAC,CAAC,CACA,gBACE,KAAK,EAAC,sCAAsC,EAC5C,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,EACvI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,SAAS,EAAC,GAAG,EACb,IAAI,EAAE,CAAC,EACP,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,GAEZ,CACZ;QACD,CAAC,CAAC,CACA,aACE,KAAK,EAAC,yBAAyB,EAC/B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,WAAW,EAAE,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,CAAE,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,OAAO,KAAK,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,WAAW,EACvI,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,GACrB,CACH;MACH,aAAO,IAAI,EAAC,QAAQ,EAAC,KAAK,EAAC,oBAAoB;QAC7C,WAAK,KAAK,EAAC,kBAAkB,GAAO,CAC9B,CACS,CACpB,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Watch } from '@stencil/core';\nimport { licensePlateStarEu } from '../../../icons';\n\n@Component({\n  tag: 'road-plate-number',\n  styleUrl: 'plate-number.css',\n  scoped: true,\n})\nexport class PlateNumber {\n\n  private countries = [\n    {\n      country: 'FR',\n      letter: 'F',\n      placeholder: 'AT-857-YY',\n    },\n    {\n      country: 'BE',\n      letter: 'B',\n      placeholder: '1-AAA-001',\n    },\n    {\n      country: 'IT',\n      letter: 'I',\n      placeholder: 'AT 814TX',\n    },\n    {\n      country: 'ES',\n      letter: 'E',\n      placeholder: '9512 HVY',\n    },\n    {\n      country: 'PT',\n      letter: 'P',\n      placeholder: '13 24 PZ',\n    },\n    {\n      country: 'PL',\n      letter: 'PL',\n      placeholder: 'GD 921KF',\n    },\n    {\n      country: 'AT',\n      letter: 'A',\n      placeholder: 'FF 10 FF',\n    },\n    {\n      country: 'DE',\n      letter: 'D',\n      placeholder: 'RA KL 8136',\n    }\n  ];\n\n  /**\n   * country of the plate\n   */\n  @Prop() country: 'FR' | 'BE' | 'IT' | 'ES' | 'PT' | 'PL' | 'AT' | 'DE' = 'FR';\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * overwrite the default placeholder\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop() readonly = false;\n\n  /**\n   * The value of the input.\n   */\n  @Prop({ mutable: true }) value?: string | number | null = '';\n\n  /**\n   * Enable motorbike display\n   */\n   @Prop() motorbike?: boolean;\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n   protected valueChanged() {\n     this.roadchange.emit({ value: this.value == null ? this.value : this.value.toString() });\n     this.roadChange.emit({ value: this.value == null ? this.value : this.value.toString() });\n   }\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() roadinput!: EventEmitter<KeyboardEvent>;\n  /** @internal */\n  @Event() roadInput!: EventEmitter<KeyboardEvent>;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() roadchange!: EventEmitter<{\n    value: string | undefined | null;\n  }>;\n  /** @internal */\n  @Event() roadChange!: EventEmitter<{\n    value: string | undefined | null;\n  }>;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() roadblur!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() roadfocus!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadFocus!: EventEmitter<void>;\n\n  private getValue(): string {\n    return typeof this.value === 'number'\n      ? this.value.toString()\n      : (this.value || '').toString();\n  }\n\n  private onInput = (ev: Event) => {\n    const input = ev.target as HTMLInputElement | null;\n    if (input) {\n      input.value = input.value.toUpperCase() || \"\";\n    }\n    this.roadinput.emit(ev as KeyboardEvent);\n    this.roadInput.emit(ev as KeyboardEvent);\n  };\n\n  private onBlur = () => {\n    this.roadblur.emit();\n    this.roadBlur.emit();\n  };\n\n  private onFocus = () => {\n    this.roadfocus.emit();\n    this.roadFocus.emit();\n  };\n\n  render() {\n    const value = this.getValue();\n    const motorbikeClass = this.motorbike ? 'motorbike-plate' : '';\n\n    return (\n      <road-input-group class={`plate-number plate-number-${this.country.toLowerCase()} ${motorbikeClass}`}>\n        <label slot=\"prepend\" class=\"input-group-prepend\">\n          <div class=\"plate-number-start\">\n            <road-icon class=\"plate-number-icon\" icon={licensePlateStarEu}></road-icon>\n            <div class=\"plate-number-location\">\n              {this.countries\n                .filter(item => item.country === this.country)[0].letter}\n            </div>\n          </div>\n        </label>\n        {this.motorbike\n          ? (\n            <textarea\n              class=\"form-control plate-number-input mb-0\"\n              disabled={this.disabled}\n              placeholder={this.placeholder != null ? this.placeholder :  this.countries.filter(item => item.country === this.country)[0].placeholder}\n              readOnly={this.readonly}\n              maxlength=\"9\"\n              rows={2}\n              onInput={this.onInput}\n              onBlur={this.onBlur}\n              onFocus={this.onFocus}\n            >\n            </textarea>\n          )\n          : (\n            <input\n              class=\"plate-number-input mb-0\"\n              disabled={this.disabled}\n              placeholder={this.placeholder != null ? this.placeholder :  this.countries.filter(item => item.country === this.country)[0].placeholder}\n              readOnly={this.readonly}\n              value={value}\n              onInput={this.onInput}\n              onBlur={this.onBlur}\n              onFocus={this.onFocus}\n            />\n          )}\n        <label slot=\"append\" class=\"input-group-append\">\n          <div class=\"plate-number-end\"></div>\n        </label>\n      </road-input-group>\n    );\n  }\n\n}"]}
+{"version":3,"file":"plate-number.js","sourceRoot":"","sources":["../../../src/components/plate-number/plate-number.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop, Event, EventEmitter, Watch } from '@stencil/core';\nimport { licensePlateStarEu } from '../../../icons';\n\n@Component({\n  tag: 'road-plate-number',\n  styleUrl: 'plate-number.css',\n  scoped: true,\n})\nexport class PlateNumber {\n\n  private countries = [\n    {\n      country: 'FR',\n      letter: 'F',\n      placeholder: 'AT-857-YY',\n    },\n    {\n      country: 'BE',\n      letter: 'B',\n      placeholder: '1-AAA-001',\n    },\n    {\n      country: 'IT',\n      letter: 'I',\n      placeholder: 'AT 814TX',\n    },\n    {\n      country: 'ES',\n      letter: 'E',\n      placeholder: '9512 HVY',\n    },\n    {\n      country: 'PT',\n      letter: 'P',\n      placeholder: '13 24 PZ',\n    },\n    {\n      country: 'PL',\n      letter: 'PL',\n      placeholder: 'GD 921KF',\n    },\n    {\n      country: 'AT',\n      letter: 'A',\n      placeholder: 'FF 10 FF',\n    },\n    {\n      country: 'DE',\n      letter: 'D',\n      placeholder: 'RA KL 8136',\n    }\n  ];\n\n  /**\n   * country of the plate\n   */\n  @Prop() country: 'FR' | 'BE' | 'IT' | 'ES' | 'PT' | 'PL' | 'AT' | 'DE' = 'FR';\n\n  /**\n   * If `true`, the user cannot interact with the input.\n   */\n  @Prop() disabled = false;\n\n  /**\n   * overwrite the default placeholder\n   */\n  @Prop() placeholder?: string;\n\n  /**\n   * If `true`, the user cannot modify the value.\n   */\n  @Prop() readonly = false;\n\n  /**\n   * The value of the input.\n   */\n  @Prop({ mutable: true }) value?: string | number | null = '';\n\n  /**\n   * Enable motorbike display\n   */\n   @Prop() motorbike?: boolean;\n\n  /**\n   * Update the native input element when the value changes\n   */\n  @Watch('value')\n   protected valueChanged() {\n     this.roadchange.emit({ value: this.value == null ? this.value : this.value.toString() });\n     this.roadChange.emit({ value: this.value == null ? this.value : this.value.toString() });\n   }\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() roadinput!: EventEmitter<KeyboardEvent>;\n  /** @internal */\n  @Event() roadInput!: EventEmitter<KeyboardEvent>;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() roadchange!: EventEmitter<{\n    value: string | undefined | null;\n  }>;\n  /** @internal */\n  @Event() roadChange!: EventEmitter<{\n    value: string | undefined | null;\n  }>;\n\n  /**\n   * Emitted when the input loses focus.\n   */\n  @Event() roadblur!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadBlur!: EventEmitter<void>;\n\n  /**\n   * Emitted when the input has focus.\n   */\n  @Event() roadfocus!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadFocus!: EventEmitter<void>;\n\n  private getValue(): string {\n    return typeof this.value === 'number'\n      ? this.value.toString()\n      : (this.value || '').toString();\n  }\n\n  private onInput = (ev: Event) => {\n    const input = ev.target as HTMLInputElement | null;\n    if (input) {\n      input.value = input.value.toUpperCase() || \"\";\n    }\n    this.roadinput.emit(ev as KeyboardEvent);\n    this.roadInput.emit(ev as KeyboardEvent);\n  };\n\n  private onBlur = () => {\n    this.roadblur.emit();\n    this.roadBlur.emit();\n  };\n\n  private onFocus = () => {\n    this.roadfocus.emit();\n    this.roadFocus.emit();\n  };\n\n  render() {\n    const value = this.getValue();\n    const motorbikeClass = this.motorbike ? 'motorbike-plate' : '';\n\n    return (\n      <road-input-group class={`plate-number plate-number-${this.country.toLowerCase()} ${motorbikeClass}`}>\n        <label slot=\"prepend\" class=\"input-group-prepend\">\n          <div class=\"plate-number-start\">\n            <road-icon class=\"plate-number-icon\" icon={licensePlateStarEu}></road-icon>\n            <div class=\"plate-number-location\">\n              {this.countries\n                .filter(item => item.country === this.country)[0].letter}\n            </div>\n          </div>\n        </label>\n        {this.motorbike\n          ? (\n            <textarea\n              class=\"form-control plate-number-input mb-0\"\n              disabled={this.disabled}\n              placeholder={this.placeholder != null ? this.placeholder :  this.countries.filter(item => item.country === this.country)[0].placeholder}\n              readOnly={this.readonly}\n              maxlength=\"9\"\n              rows={2}\n              onInput={this.onInput}\n              onBlur={this.onBlur}\n              onFocus={this.onFocus}\n            >\n            </textarea>\n          )\n          : (\n            <input\n              class=\"plate-number-input mb-0\"\n              disabled={this.disabled}\n              placeholder={this.placeholder != null ? this.placeholder :  this.countries.filter(item => item.country === this.country)[0].placeholder}\n              readOnly={this.readonly}\n              value={value}\n              onInput={this.onInput}\n              onBlur={this.onBlur}\n              onFocus={this.onFocus}\n            />\n          )}\n        <label slot=\"append\" class=\"input-group-append\">\n          <div class=\"plate-number-end\"></div>\n        </label>\n      </road-input-group>\n    );\n  }\n\n}"]}

package/dist/collection/components/profil-dropdown/profil-dropdown.js

@@ -1,4 +1,4 @@
-import { h } from '@stencil/core';
+import { h } from "@stencil/core";
 /**
  * @slot  - Element how will open the dropdown when clicked
  * @slot list - List of item values (you can add border with lines=`full` but not on the last item)

package/dist/collection/components/progress/progress.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 export class ProgressBar {
   constructor() {
     this.value = 0;

package/dist/collection/components/progress-indicator-horizontal/progress-indicator-horizontal.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot progress-indicator-horizontal-icon - if the state of the step 1 is completed add
  * `<road-icon name="check-small" class="d-block" style="color: currentColor;"></road-icon>` by default.

package/dist/collection/components/progress-indicator-vertical/progress-indicator-vertical.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot  - content of the stepper item, it should be road-vertical-stepper-item elements.
  *

package/dist/collection/components/progress-indicator-vertical-item/progress-indicator-vertical-item.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot - Content of the progress indicator vertical item
  */

package/dist/collection/components/progress-tracker/progress-tracker.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot  - content of the progress stepper tracker item, it should be road-progress-tracker-item elements.
  *

package/dist/collection/components/progress-tracker-item/progress-tracker-item.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot - Content of the progress tracker item
  * it should be `<div class="progress-tracker-link">`

package/dist/collection/components/radio/radio.js

@@ -1,5 +1,5 @@
-import { Host, h } from '@stencil/core';
-import './../../utils/polyfill';
+import { Host, h } from "@stencil/core";
+import "./../../utils/polyfill";
 export class Radio {
   constructor() {
     this.radioGroup = null;

package/dist/collection/components/radio-group/radio-group.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot  - Used to add multiple radio components.
  */

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

@@ -1,5 +1,5 @@
-import { h } from '@stencil/core';
-import { navigationAddLessSolid, navigationAddMoreSolid } from '../../../icons';
+import { h } from "@stencil/core";
+import { navigationAddLessSolid, navigationAddMoreSolid } from "../../../icons";
 /**
  * @slot datalist - list of labels. also put show-labels="true" and max="10" for this exemple
  * `<datalist id="tickmarks" slot="datalist" class="tickmarks">`

package/dist/collection/components/rating/rating.js

@@ -1,5 +1,5 @@
-import { Host, h } from '@stencil/core';
-import { star, starHalfColor } from '../../../icons';
+import { Host, h } from "@stencil/core";
+import { star, starHalfColor } from "../../../icons";
 export class Rating {
   constructor() {
     this.size = 'medium';

package/dist/collection/components/row/row.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot  - Used to be able to add multiple columns for a row.
  */

package/dist/collection/components/segmented-button/segmented-button.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  *
  * @part native - The native HTML anchor element that wraps all child elements.

package/dist/collection/components/segmented-button-bar/segmented-button-bar.js

@@ -1,5 +1,5 @@
-import { Host, h } from '@stencil/core';
-import '../../utils/polyfill';
+import { Host, h } from "@stencil/core";
+import "../../utils/polyfill";
 /**
  * @slot  - Content of the segmentedButtonBar, it should be road-segmented-button elements.
  */

package/dist/collection/components/segmented-buttons/segmented-buttons.js

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 /**
  * @slot - Content is placed between the named slots if provided without a slot.
  * @slot top - Content is placed at the top of the screen.
@@ -189,10 +189,12 @@ export class Tabs {
             }],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             },
             "HTMLRoadTabElement": {
-              "location": "global"
+              "location": "global",
+              "id": "global::HTMLRoadTabElement"
             }
           },
           "return": "Promise<boolean>"
@@ -217,10 +219,12 @@ export class Tabs {
             }],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             },
             "HTMLRoadTabElement": {
-              "location": "global"
+              "location": "global",
+              "id": "global::HTMLRoadTabElement"
             }
           },
           "return": "Promise<HTMLRoadTabElement | undefined>"
@@ -239,7 +243,8 @@ export class Tabs {
           "parameters": [],
           "references": {
             "Promise": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Promise"
             }
           },
           "return": "Promise<string | undefined>"

package/dist/collection/components/segmented-buttons/segmented-buttons.js.map

@@ -1 +1 @@
-{"version":3,"file":"segmented-buttons.js","sourceRoot":"","sources":["../../../src/components/segmented-buttons/segmented-buttons.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, Method, State, h } from '@stencil/core';\n\n/**\n * @slot - Content is placed between the named slots if provided without a slot.\n * @slot top - Content is placed at the top of the screen.\n */\n@Component({\n  tag: 'road-segmented-buttons',\n  styleUrl: 'segmented-buttons.css',\n  shadow: true,\n})\nexport class Tabs {\n\n  private transitioning = false;\n  private leavingTab?: HTMLRoadTabElement;\n\n  @Element() el!: HTMLRoadTabsElement;\n\n  @State() selectedTab?: HTMLRoadTabElement;\n\n  /**\n   * Emitted when the navigation is about to transition to a new component.\n   */\n  @Event({ bubbles: false }) roadtabswillchange!: EventEmitter<{tab: string}>;\n  /** @internal */\n  @Event({ bubbles: false }) roadTabsWillChange!: EventEmitter<{tab: string}>;\n\n  /**\n   * Emitted when the navigation has finished transitioning to a new component.\n   */\n  @Event({ bubbles: false }) roadtabsdidchange!: EventEmitter<{tab: string}>;\n  /** @internal */\n  @Event({ bubbles: false }) roadTabsDidChange!: EventEmitter<{tab: string}>;\n\n  async componentWillLoad() {\n    const tabs = this.tabs;\n    if (tabs.length > 0) {\n      this.select(tabs[0]);\n    }\n  }\n\n  componentWillRender() {\n    const buttonBar = this.el.querySelector('road-segmented-button-bar');\n    if (buttonBar) {\n      const tab = this.selectedTab ? this.selectedTab.tab : undefined;\n      buttonBar.selectedTab = tab;\n    }\n  }\n\n  /**\n   * Select a tab by the value of its `tab` property or an element reference.\n   *\n   * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.\n   */\n  @Method()\n  async select(tab: string | HTMLRoadTabElement): Promise<boolean> {\n    const selectedTab = getTab(this.tabs, tab);\n    if (!this.shouldSwitch(selectedTab)) {\n      return false;\n    }\n    await this.setActive(selectedTab);\n    this.tabSwitch();\n\n    return true;\n  }\n\n  /**\n   * Get a specific tab by the value of its `tab` property or an element reference.\n   *\n   * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.\n   */\n  @Method()\n  async getTab(tab: string | HTMLRoadTabElement): Promise<HTMLRoadTabElement | undefined> {\n    return getTab(this.tabs, tab);\n  }\n\n  /**\n   * Get the currently selected tab.\n   */\n  @Method()\n  getSelected(): Promise<string | undefined> {\n    return Promise.resolve(this.selectedTab ? this.selectedTab.tab : undefined);\n  }\n\n  private setActive(selectedTab: HTMLRoadTabElement): Promise<void> {\n    if (this.transitioning) {\n      return Promise.reject('transitioning already happening');\n    }\n\n    this.transitioning = true;\n    this.leavingTab = this.selectedTab;\n    this.selectedTab = selectedTab;\n    this.roadTabsWillChange.emit({ tab: selectedTab.tab });\n    selectedTab.active = true;\n    return Promise.resolve();\n  }\n\n  private tabSwitch() {\n    const selectedTab = this.selectedTab;\n    const leavingTab = this.leavingTab;\n\n    this.leavingTab = undefined;\n    this.transitioning = false;\n    if (!selectedTab) {\n      return;\n    }\n\n    if (leavingTab !== selectedTab) {\n      if (leavingTab) {\n        leavingTab.active = false;\n      }\n      this.roadTabsDidChange.emit({ tab: selectedTab.tab });\n    }\n  }\n\n  private shouldSwitch(selectedTab: HTMLRoadTabElement | undefined): selectedTab is HTMLRoadTabElement {\n    const leavingTab = this.selectedTab;\n    return selectedTab !== undefined && selectedTab !== leavingTab && !this.transitioning;\n  }\n\n  private get tabs() {\n    return Array.from(this.el.querySelectorAll('road-tab'));\n  }\n\n  private onTabClicked = (ev: CustomEvent) => {\n    const { tab } = ev.detail;\n    this.select(tab);\n  };\n\n  render() {\n\n    return (\n      <Host\n        onRoadSegmentedButtonClick={this.onTabClicked}>\n        <slot name=\"top\"/>\n          <slot/>\n      </Host>\n    );\n  }\n}\n\nconst getTab = (tabs: HTMLRoadTabElement[], tab: string | HTMLRoadTabElement): HTMLRoadTabElement | undefined => {\n  const tabEl = (typeof tab === 'string')\n    ? tabs.find(t => t.tab === tab)\n    : tab;\n\n  if (!tabEl) {\n    console.error(`tab with id: \"${tabEl}\" does not exist`);\n  }\n  return tabEl;\n};"]}
+{"version":3,"file":"segmented-buttons.js","sourceRoot":"","sources":["../../../src/components/segmented-buttons/segmented-buttons.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Element, Event, EventEmitter, Host, Method, State, h } from '@stencil/core';\n\n/**\n * @slot - Content is placed between the named slots if provided without a slot.\n * @slot top - Content is placed at the top of the screen.\n */\n@Component({\n  tag: 'road-segmented-buttons',\n  styleUrl: 'segmented-buttons.css',\n  shadow: true,\n})\nexport class Tabs {\n\n  private transitioning = false;\n  private leavingTab?: HTMLRoadTabElement;\n\n  @Element() el!: HTMLRoadTabsElement;\n\n  @State() selectedTab?: HTMLRoadTabElement;\n\n  /**\n   * Emitted when the navigation is about to transition to a new component.\n   */\n  @Event({ bubbles: false }) roadtabswillchange!: EventEmitter<{tab: string}>;\n  /** @internal */\n  @Event({ bubbles: false }) roadTabsWillChange!: EventEmitter<{tab: string}>;\n\n  /**\n   * Emitted when the navigation has finished transitioning to a new component.\n   */\n  @Event({ bubbles: false }) roadtabsdidchange!: EventEmitter<{tab: string}>;\n  /** @internal */\n  @Event({ bubbles: false }) roadTabsDidChange!: EventEmitter<{tab: string}>;\n\n  async componentWillLoad() {\n    const tabs = this.tabs;\n    if (tabs.length > 0) {\n      this.select(tabs[0]);\n    }\n  }\n\n  componentWillRender() {\n    const buttonBar = this.el.querySelector('road-segmented-button-bar');\n    if (buttonBar) {\n      const tab = this.selectedTab ? this.selectedTab.tab : undefined;\n      buttonBar.selectedTab = tab;\n    }\n  }\n\n  /**\n   * Select a tab by the value of its `tab` property or an element reference.\n   *\n   * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.\n   */\n  @Method()\n  async select(tab: string | HTMLRoadTabElement): Promise<boolean> {\n    const selectedTab = getTab(this.tabs, tab);\n    if (!this.shouldSwitch(selectedTab)) {\n      return false;\n    }\n    await this.setActive(selectedTab);\n    this.tabSwitch();\n\n    return true;\n  }\n\n  /**\n   * Get a specific tab by the value of its `tab` property or an element reference.\n   *\n   * @param tab The tab instance to select. If passed a string, it should be the value of the tab's `tab` property.\n   */\n  @Method()\n  async getTab(tab: string | HTMLRoadTabElement): Promise<HTMLRoadTabElement | undefined> {\n    return getTab(this.tabs, tab);\n  }\n\n  /**\n   * Get the currently selected tab.\n   */\n  @Method()\n  getSelected(): Promise<string | undefined> {\n    return Promise.resolve(this.selectedTab ? this.selectedTab.tab : undefined);\n  }\n\n  private setActive(selectedTab: HTMLRoadTabElement): Promise<void> {\n    if (this.transitioning) {\n      return Promise.reject('transitioning already happening');\n    }\n\n    this.transitioning = true;\n    this.leavingTab = this.selectedTab;\n    this.selectedTab = selectedTab;\n    this.roadTabsWillChange.emit({ tab: selectedTab.tab });\n    selectedTab.active = true;\n    return Promise.resolve();\n  }\n\n  private tabSwitch() {\n    const selectedTab = this.selectedTab;\n    const leavingTab = this.leavingTab;\n\n    this.leavingTab = undefined;\n    this.transitioning = false;\n    if (!selectedTab) {\n      return;\n    }\n\n    if (leavingTab !== selectedTab) {\n      if (leavingTab) {\n        leavingTab.active = false;\n      }\n      this.roadTabsDidChange.emit({ tab: selectedTab.tab });\n    }\n  }\n\n  private shouldSwitch(selectedTab: HTMLRoadTabElement | undefined): selectedTab is HTMLRoadTabElement {\n    const leavingTab = this.selectedTab;\n    return selectedTab !== undefined && selectedTab !== leavingTab && !this.transitioning;\n  }\n\n  private get tabs() {\n    return Array.from(this.el.querySelectorAll('road-tab'));\n  }\n\n  private onTabClicked = (ev: CustomEvent) => {\n    const { tab } = ev.detail;\n    this.select(tab);\n  };\n\n  render() {\n\n    return (\n      <Host\n        onRoadSegmentedButtonClick={this.onTabClicked}>\n        <slot name=\"top\"/>\n          <slot/>\n      </Host>\n    );\n  }\n}\n\nconst getTab = (tabs: HTMLRoadTabElement[], tab: string | HTMLRoadTabElement): HTMLRoadTabElement | undefined => {\n  const tabEl = (typeof tab === 'string')\n    ? tabs.find(t => t.tab === tab)\n    : tab;\n\n  if (!tabEl) {\n    console.error(`tab with id: \"${tabEl}\" does not exist`);\n  }\n  return tabEl;\n};"]}

package/dist/collection/components/select/select.css

@@ -24,7 +24,7 @@
   box-sizing: border-box;
   display: block;
   width: 100%;
-  height: 3rem;
+  height: auto;
   padding: 0.75rem 3rem 0 1rem;
   margin: 0;
   font-size: var(--road-body-medium);
@@ -120,7 +120,7 @@
  -------------------- */
 
 :host(.select-xl) .form-select {
-  height: 3.5rem;
+  min-height: 3.5rem;
   padding: 1rem 1rem 0;
 }
 
@@ -140,8 +140,12 @@
   transform: scale(0.75) translateY(-0.625rem);
 }
 
+:host(.select-lg) .form-select {
+  min-height: 3rem;
+}
+
 :host(.select-md) .form-select {
-  height: 2.5rem;
+  min-height: 2.5rem;
   padding: 1rem 1rem 0;
   font-size: var(--road-body-small);
 }

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

@@ -1,4 +1,4 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 export class Select {
   constructor() {
     this.onChange = (ev) => {
@@ -81,7 +81,8 @@ export class Select {
           "resolved": "{ value: string | number; label: string; selected?: boolean | undefined; }[]",
           "references": {
             "Array": {
-              "location": "global"
+              "location": "global",
+              "id": "global::Array"
             }
           }
         },

package/dist/collection/components/select/select.js.map

@@ -1 +1 @@
-{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'road-select',\n  styleUrl: 'select.css',\n  scoped: true,\n})\nexport class Select {\n\n  /**\n   * The id of select\n   */\n  @Prop() selectId: string = `road-select-${selectIds++}`;\n\n  /**\n   * List of options of the select\n   */\n  @Prop() options: Array<{\n    value: string | number;\n    label: string;\n    selected?: boolean;\n  }> = [];\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus: boolean = false;\n\n  /**\n   * If `true`, the user cannot interact with the select.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.selectId;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * If the control is presented as a scrolling list box (e.g. when multiple is specified),\n   * this attribute represents the number of rows in the list that should be visible at one time.\n   */\n  @Prop() size: number = 0;\n\n  /**\n   * The sizes of the input.\n   */\n   @Prop() sizes: 'md' | 'lg' | 'xl' = 'xl';\n\n  /**\n   * Label for the field\n   */\n  @Prop() label: string = `${this.selectId}-label`;\n\n  /**\n   * Error message for the field\n   */\n  @Prop() error?: string;\n\n  /**\n   * the value of the select.\n   */\n  @Prop({ mutable: true }) value?: any | null;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() roadchange!: EventEmitter<{\n    value: string | undefined | null\n  }>;\n  /** @internal */\n  @Event() roadChange!: EventEmitter<{\n    value: string | undefined | null\n  }>;\n\n  /**\n   * Emitted when the select has focus.\n   */\n  @Event() roadfocus!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select loses focus.\n   */\n  @Event() roadblur!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadBlur!: EventEmitter<void>;\n\n  @Watch('value')\n  valueChanged() {\n    this.roadchange.emit({\n      value: this.value,\n    });\n    this.roadChange.emit({\n      value: this.value,\n    });\n  }\n\n  private onChange = (ev: Event) => {\n    const select = ev.target as HTMLSelectElement | null;\n    if (select) {\n      this.value = select.value || '';\n    }\n  };\n\n  private onBlur = () => {\n    this.roadblur.emit();\n    this.roadBlur.emit();\n  };\n\n  private onFocus = () => {\n    this.roadfocus.emit();\n    this.roadFocus.emit();\n  };\n\n  render() {\n    const labelId = this.selectId + '-label';\n    const hasValueClass = this.value && this.value !== '' ? 'has-value' : '';\n    const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';\n\n    return (\n      <Host class={this.sizes && `select-${this.sizes}`}>\n        <select\n          class={`form-select ${hasValueClass} ${isInvalidClass}`}\n          id={this.selectId}\n          aria-disabled={this.disabled ? 'true' : null}\n          autoFocus={this.autofocus}\n          disabled={this.disabled}\n          name={this.name}\n          required={this.required}\n          size={this.size}\n          onChange={this.onChange}\n          onFocus={this.onFocus}\n          onBlur={this.onBlur}\n        >\n          <option selected disabled hidden style={{ display: 'none' }} value=\"\"></option>\n          {this.options && this.options.map(option => (\n            <option value={option.value} selected={option.selected}>{option.label}</option>\n          ))}\n        </select>\n        <label class=\"form-select-label\" id={labelId} htmlFor={this.selectId}>{this.label}</label>\n        {this.error && this.error !== '' && <p class=\"invalid-feedback\">{this.error}</p>}\n      </Host>\n    );\n  }\n\n}\n\nlet selectIds = 0;\n"]}
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Event, EventEmitter, Host, Prop, Watch, h } from '@stencil/core';\n\n@Component({\n  tag: 'road-select',\n  styleUrl: 'select.css',\n  scoped: true,\n})\nexport class Select {\n\n  /**\n   * The id of select\n   */\n  @Prop() selectId: string = `road-select-${selectIds++}`;\n\n  /**\n   * List of options of the select\n   */\n  @Prop() options: Array<{\n    value: string | number;\n    label: string;\n    selected?: boolean;\n  }> = [];\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus: boolean = false;\n\n  /**\n   * If `true`, the user cannot interact with the select.\n   */\n  @Prop() disabled: boolean = false;\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.selectId;\n\n  /**\n   * If `true`, the user must fill in a value before submitting a form.\n   */\n  @Prop() required: boolean = false;\n\n  /**\n   * If the control is presented as a scrolling list box (e.g. when multiple is specified),\n   * this attribute represents the number of rows in the list that should be visible at one time.\n   */\n  @Prop() size: number = 0;\n\n  /**\n   * The sizes of the input.\n   */\n   @Prop() sizes: 'md' | 'lg' | 'xl' = 'xl';\n\n  /**\n   * Label for the field\n   */\n  @Prop() label: string = `${this.selectId}-label`;\n\n  /**\n   * Error message for the field\n   */\n  @Prop() error?: string;\n\n  /**\n   * the value of the select.\n   */\n  @Prop({ mutable: true }) value?: any | null;\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() roadchange!: EventEmitter<{\n    value: string | undefined | null\n  }>;\n  /** @internal */\n  @Event() roadChange!: EventEmitter<{\n    value: string | undefined | null\n  }>;\n\n  /**\n   * Emitted when the select has focus.\n   */\n  @Event() roadfocus!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadFocus!: EventEmitter<void>;\n\n  /**\n   * Emitted when the select loses focus.\n   */\n  @Event() roadblur!: EventEmitter<void>;\n  /** @internal */\n  @Event() roadBlur!: EventEmitter<void>;\n\n  @Watch('value')\n  valueChanged() {\n    this.roadchange.emit({\n      value: this.value,\n    });\n    this.roadChange.emit({\n      value: this.value,\n    });\n  }\n\n  private onChange = (ev: Event) => {\n    const select = ev.target as HTMLSelectElement | null;\n    if (select) {\n      this.value = select.value || '';\n    }\n  };\n\n  private onBlur = () => {\n    this.roadblur.emit();\n    this.roadBlur.emit();\n  };\n\n  private onFocus = () => {\n    this.roadfocus.emit();\n    this.roadFocus.emit();\n  };\n\n  render() {\n    const labelId = this.selectId + '-label';\n    const hasValueClass = this.value && this.value !== '' ? 'has-value' : '';\n    const isInvalidClass = this.error !== undefined && this.error !== '' ? 'is-invalid' : '';\n\n    return (\n      <Host class={this.sizes && `select-${this.sizes}`}>\n        <select\n          class={`form-select ${hasValueClass} ${isInvalidClass}`}\n          id={this.selectId}\n          aria-disabled={this.disabled ? 'true' : null}\n          autoFocus={this.autofocus}\n          disabled={this.disabled}\n          name={this.name}\n          required={this.required}\n          size={this.size}\n          onChange={this.onChange}\n          onFocus={this.onFocus}\n          onBlur={this.onBlur}\n        >\n          <option selected disabled hidden style={{ display: 'none' }} value=\"\"></option>\n          {this.options && this.options.map(option => (\n            <option value={option.value} selected={option.selected}>{option.label}</option>\n          ))}\n        </select>\n        <label class=\"form-select-label\" id={labelId} htmlFor={this.selectId}>{this.label}</label>\n        {this.error && this.error !== '' && <p class=\"invalid-feedback\">{this.error}</p>}\n      </Host>\n    );\n  }\n\n}\n\nlet selectIds = 0;\n"]}