npm - @roadtrip/components - Versions diffs - 3.13.1 → 3.13.2 - Mend

@roadtrip/components 3.13.1 → 3.13.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (11) hide show

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

@@ -56,7 +56,7 @@ const Select = class {
   }
   addSelected() {
     var _a, _b;
-    const selectedOption = this.options.find(option => option.value === this.value);
+    const selectedOption = this.options.find(option => option.value == this.value);
     const selectedOption2 = this.options.find(option => option.selected);
     if (selectedOption) {
       selectedOption.selected = true;
@@ -64,7 +64,7 @@ const Select = class {
     if (selectedOption2) {
       selectedOption2.selected = false;
     }
-    return (_b = (_a = this.options.find(option => option.value === this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+    return (_b = (_a = this.options.find(option => option.value == this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
   }
   render() {
     const labelId = this.selectId + '-label';

package/dist/cjs/road-select.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"road-select.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/select/select.css?tag=road-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["/\n Select\n \n Index\n * - Select\n * - Label\n * - Sizes\n * - Error\n /\n\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/ SELECT\n -------------------- /\n\n.form-select {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: auto;\n padding: 0.75rem 3rem 0 1rem;\n margin: 0;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=\") no-repeat right 1rem center/1.5rem 2rem;\n background-color: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n.form-select:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 #000000;\n}\n\n.form-select::-ms-expand { / IE fix remove native arrow /\n display: none;\n}\n\n/\n Placeholder\n /\n\n.form-select::placeholder {\n color: var(--road-on-surface-extra-weak);\n}\n\n/\n Hover state\n /\n\n@media (hover: hover) {\n\n .form-select:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/\n Focus state\n /\n\n.form-select:focus ~ .form-select-label,\n.form-select[required]:valid ~ .form-select-label,\n.form-select.has-value ~ .form-select-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-select:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/\n Disabled state\n /\n\n.form-select:disabled,\n.form-select[readonly] {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background-color: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/ LABEL\n -------------------- /\n\n.form-select-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-label-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n.form-select:required ~ .form-select-label::after{\n color: var(--road-on-danger-surface);\n content: \" \";\n}\n\n/* SIZES\n -------------------- /\n\n:host(.select-xl) .form-select {\n min-height: 3.5rem;\n padding: 1rem 1rem 0;\n}\n\n:host(.select-xl) .form-select-label {\n top: 1rem;\n}\n\n:host(.select-xl) .form-select:focus ~ .form-select-label,\n:host(.select-xl) .form-select[required]:valid ~ .form-select-label,\n:host(.select-xl) .form-select.has-value ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-xl) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-lg) .form-select {\n min-height: 3rem;\n}\n\n:host(.select-md) .form-select {\n min-height: 2.5rem;\n padding: 1rem 1rem 0;\n font-size: var(--road-body-small);\n}\n\n:host(.select-md) .form-select-label {\n top: 0.5rem;\n}\n\n:host(.select-md) .form-select:focus ~ .form-select-label,\n:host(.select-md) .form-select[required]:valid ~ .form-select-label,\n:host(.select-md) .form-select.has-value ~ .form-select-label,\n:host(.select-md) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-md) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-md) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n/ ERROR\n -------------------- /\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-body-small);\n color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid,\n.was-validated .form-select:invalid {\n border-color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid ~ .invalid-feedback,\n.was-validated .form-select:invalid ~ .invalid-feedback {\n display: block;\n}\n","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value === this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value === this.value)?.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}
1	+ {"file":"road-select.entry.cjs.js","mappings":"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","names":["h","Host"],"sources":["src/components/select/select.css?tag=road-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["/\n Select\n \n Index\n * - Select\n * - Label\n * - Sizes\n * - Error\n /\n\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/ SELECT\n -------------------- /\n\n.form-select {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: auto;\n padding: 0.75rem 3rem 0 1rem;\n margin: 0;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=\") no-repeat right 1rem center/1.5rem 2rem;\n background-color: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n.form-select:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 #000000;\n}\n\n.form-select::-ms-expand { / IE fix remove native arrow /\n display: none;\n}\n\n/\n Placeholder\n /\n\n.form-select::placeholder {\n color: var(--road-on-surface-extra-weak);\n}\n\n/\n Hover state\n /\n\n@media (hover: hover) {\n\n .form-select:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/\n Focus state\n /\n\n.form-select:focus ~ .form-select-label,\n.form-select[required]:valid ~ .form-select-label,\n.form-select.has-value ~ .form-select-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-select:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/\n Disabled state\n /\n\n.form-select:disabled,\n.form-select[readonly] {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background-color: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/ LABEL\n -------------------- /\n\n.form-select-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-label-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n.form-select:required ~ .form-select-label::after{\n color: var(--road-on-danger-surface);\n content: \" \";\n}\n\n/* SIZES\n -------------------- /\n\n:host(.select-xl) .form-select {\n min-height: 3.5rem;\n padding: 1rem 1rem 0;\n}\n\n:host(.select-xl) .form-select-label {\n top: 1rem;\n}\n\n:host(.select-xl) .form-select:focus ~ .form-select-label,\n:host(.select-xl) .form-select[required]:valid ~ .form-select-label,\n:host(.select-xl) .form-select.has-value ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-xl) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-lg) .form-select {\n min-height: 3rem;\n}\n\n:host(.select-md) .form-select {\n min-height: 2.5rem;\n padding: 1rem 1rem 0;\n font-size: var(--road-body-small);\n}\n\n:host(.select-md) .form-select-label {\n top: 0.5rem;\n}\n\n:host(.select-md) .form-select:focus ~ .form-select-label,\n:host(.select-md) .form-select[required]:valid ~ .form-select-label,\n:host(.select-md) .form-select.has-value ~ .form-select-label,\n:host(.select-md) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-md) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-md) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n/ ERROR\n -------------------- /\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-body-small);\n color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid,\n.was-validated .form-select:invalid {\n border-color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid ~ .invalid-feedback,\n.was-validated .form-select:invalid ~ .invalid-feedback {\n display: block;\n}\n","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value == this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value == this.value)?.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}

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

@@ -42,7 +42,7 @@ export class Select {
   }
   addSelected() {
     var _a, _b;
-    const selectedOption = this.options.find(option => option.value === this.value);
+    const selectedOption = this.options.find(option => option.value == this.value);
     const selectedOption2 = this.options.find(option => option.selected);
     if (selectedOption) {
       selectedOption.selected = true;
@@ -50,7 +50,7 @@ export class Select {
     if (selectedOption2) {
       selectedOption2.selected = false;
     }
-    return (_b = (_a = this.options.find(option => option.value === this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+    return (_b = (_a = this.options.find(option => option.value == this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
   }
   render() {
     const labelId = this.selectId + '-label';

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

	@@ -1 +1 @@
1	- {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,MAAM,eAAe,CAAC;AAOtF,MAAM,OAAO,MAAM;;IAwHT,aAAQ,GAAG,CAAC,EAAS,EAAE,EAAE;MAC/B,MAAM,MAAM,GAAG,EAAE,CAAC,MAAkC,CAAC;MACrD,IAAI,MAAM,EAAE;QACV,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;OACjC;IACH,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;oBAlIyB,eAAe,SAAS,EAAE,EAAE;mBASlD,EAAE;qBAKsB,KAAK;oBAKN,KAAK;gBAKV,IAAI,CAAC,QAAQ;oBAKR,KAAK;gBAMV,CAAC;iBAKa,IAAI;iBAKjB,GAAG,IAAI,CAAC,QAAQ,QAAQ;;;;EAsChD,YAAY;IACV,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACnB,KAAK,EAAE,IAAI,CAAC,KAAK;KAClB,CAAC,CAAC;IACH,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACnB,KAAK,EAAE,IAAI,CAAC,KAAK;KAClB,CAAC,CAAC;EACL,CAAC;EAGD,iBAAiB;IACf,IAAG,IAAI,CAAC,KAAK,EAAC;MACZ,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;EACH,CAAC;EAED,WAAW;;IACT,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,~~KAAK~~,IAAI,CAAC,KAAK,CAAC,CAAC;~~IAChF~~,MAAM,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAErE,IAAI,cAAc,EAAE;MAChB,cAAc,CAAC,QAAQ,GAAG,IAAI,CAAC;KAClC;IACD,IAAG,eAAe,EAAC;MACjB,eAAe,CAAC,QAAQ,GAAG,KAAK,CAAA;KACjC;IAGD,OAAO,MAAA,MAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,~~KAAK~~,IAAI,CAAC,KAAK,CAAC,0CAAE,KAAK,mCAAI,EAAE,CAAC;~~EAE/E~~,CAAC;EAmBD,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACzC,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IACzE,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAEzF,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,UAAU,IAAI,CAAC,KAAK,EAAE;MAC/C,cACE,KAAK,EAAE,eAAe,aAAa,IAAI,cAAc,EAAE,EACvD,EAAE,EAAE,IAAI,CAAC,QAAQ,mBACF,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,EAC5C,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM;QAEnB,cAAQ,QAAQ,QAAC,QAAQ,QAAC,MAAM,QAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,EAAC,EAAE,GAAU;QAC9E,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAC1C,cAAQ,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAG,MAAM,CAAC,KAAK,CAAU,CAChF,CAAC,CACK;MACT,aAAO,KAAK,EAAC,mBAAmB,EAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,IAAG,IAAI,CAAC,KAAK,CAAS;MACzF,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,IAAI,SAAG,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,KAAK,CAAK,CAC3E,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF;AAED,IAAI,SAAS,GAAG,CAAC,CAAC","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value ~~===~~ this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value ~~===~~ this.value)?.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"]}
1	+ {"version":3,"file":"select.js","sourceRoot":"","sources":["../../../src/components/select/select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,GAAG,MAAM,eAAe,CAAC;AAOtF,MAAM,OAAO,MAAM;;IAwHT,aAAQ,GAAG,CAAC,EAAS,EAAE,EAAE;MAC/B,MAAM,MAAM,GAAG,EAAE,CAAC,MAAkC,CAAC;MACrD,IAAI,MAAM,EAAE;QACV,IAAI,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,EAAE,CAAC;OACjC;IACH,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;oBAlIyB,eAAe,SAAS,EAAE,EAAE;mBASlD,EAAE;qBAKsB,KAAK;oBAKN,KAAK;gBAKV,IAAI,CAAC,QAAQ;oBAKR,KAAK;gBAMV,CAAC;iBAKa,IAAI;iBAKjB,GAAG,IAAI,CAAC,QAAQ,QAAQ;;;;EAsChD,YAAY;IACV,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACnB,KAAK,EAAE,IAAI,CAAC,KAAK;KAClB,CAAC,CAAC;IACH,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC;MACnB,KAAK,EAAE,IAAI,CAAC,KAAK;KAClB,CAAC,CAAC;EACL,CAAC;EAGD,iBAAiB;IACf,IAAG,IAAI,CAAC,KAAK,EAAC;MACZ,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;EACH,CAAC;EAED,WAAW;;IACT,MAAM,cAAc,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC;IAC/E,MAAM,eAAe,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC;IAErE,IAAI,cAAc,EAAE;MAChB,cAAc,CAAC,QAAQ,GAAG,IAAI,CAAC;KAClC;IACD,IAAG,eAAe,EAAC;MACjB,eAAe,CAAC,QAAQ,GAAG,KAAK,CAAA;KACjC;IAGD,OAAO,MAAA,MAAA,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,CAAC,0CAAE,KAAK,mCAAI,EAAE,CAAC;EAE9E,CAAC;EAmBD,MAAM;IACJ,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,GAAG,QAAQ,CAAC;IACzC,MAAM,aAAa,GAAG,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,EAAE,CAAC;IACzE,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,KAAK,SAAS,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,EAAE,CAAC;IAEzF,OAAO,CACL,EAAC,IAAI,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,UAAU,IAAI,CAAC,KAAK,EAAE;MAC/C,cACE,KAAK,EAAE,eAAe,aAAa,IAAI,cAAc,EAAE,EACvD,EAAE,EAAE,IAAI,CAAC,QAAQ,mBACF,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,EAC5C,SAAS,EAAE,IAAI,CAAC,SAAS,EACzB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,MAAM,EAAE,IAAI,CAAC,MAAM;QAEnB,cAAQ,QAAQ,QAAC,QAAQ,QAAC,MAAM,QAAC,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,EAAC,EAAE,GAAU;QAC9E,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,CAC1C,cAAQ,KAAK,EAAE,MAAM,CAAC,KAAK,EAAE,QAAQ,EAAE,MAAM,CAAC,QAAQ,IAAG,MAAM,CAAC,KAAK,CAAU,CAChF,CAAC,CACK;MACT,aAAO,KAAK,EAAC,mBAAmB,EAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,CAAC,QAAQ,IAAG,IAAI,CAAC,KAAK,CAAS;MACzF,IAAI,CAAC,KAAK,IAAI,IAAI,CAAC,KAAK,KAAK,EAAE,IAAI,SAAG,KAAK,EAAC,kBAAkB,IAAE,IAAI,CAAC,KAAK,CAAK,CAC3E,CACR,CAAC;EACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAEF;AAED,IAAI,SAAS,GAAG,CAAC,CAAC","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value == this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value == this.value)?.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"]}

package/dist/esm/road-select.entry.js CHANGED Viewed

@@ -52,7 +52,7 @@ const Select = class {
   }
   addSelected() {
     var _a, _b;
-    const selectedOption = this.options.find(option => option.value === this.value);
+    const selectedOption = this.options.find(option => option.value == this.value);
     const selectedOption2 = this.options.find(option => option.selected);
     if (selectedOption) {
       selectedOption.selected = true;
@@ -60,7 +60,7 @@ const Select = class {
     if (selectedOption2) {
       selectedOption2.selected = false;
     }
-    return (_b = (_a = this.options.find(option => option.value === this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+    return (_b = (_a = this.options.find(option => option.value == this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
   }
   render() {
     const labelId = this.selectId + '-label';

package/dist/esm/road-select.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"road-select.entry.js","mappings":"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","names":[],"sources":["src/components/select/select.css?tag=road-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["/\n Select\n \n Index\n * - Select\n * - Label\n * - Sizes\n * - Error\n /\n\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/ SELECT\n -------------------- /\n\n.form-select {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: auto;\n padding: 0.75rem 3rem 0 1rem;\n margin: 0;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=\") no-repeat right 1rem center/1.5rem 2rem;\n background-color: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n.form-select:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 #000000;\n}\n\n.form-select::-ms-expand { / IE fix remove native arrow /\n display: none;\n}\n\n/\n Placeholder\n /\n\n.form-select::placeholder {\n color: var(--road-on-surface-extra-weak);\n}\n\n/\n Hover state\n /\n\n@media (hover: hover) {\n\n .form-select:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/\n Focus state\n /\n\n.form-select:focus ~ .form-select-label,\n.form-select[required]:valid ~ .form-select-label,\n.form-select.has-value ~ .form-select-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-select:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/\n Disabled state\n /\n\n.form-select:disabled,\n.form-select[readonly] {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background-color: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/ LABEL\n -------------------- /\n\n.form-select-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-label-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n.form-select:required ~ .form-select-label::after{\n color: var(--road-on-danger-surface);\n content: \" \";\n}\n\n/* SIZES\n -------------------- /\n\n:host(.select-xl) .form-select {\n min-height: 3.5rem;\n padding: 1rem 1rem 0;\n}\n\n:host(.select-xl) .form-select-label {\n top: 1rem;\n}\n\n:host(.select-xl) .form-select:focus ~ .form-select-label,\n:host(.select-xl) .form-select[required]:valid ~ .form-select-label,\n:host(.select-xl) .form-select.has-value ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-xl) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-lg) .form-select {\n min-height: 3rem;\n}\n\n:host(.select-md) .form-select {\n min-height: 2.5rem;\n padding: 1rem 1rem 0;\n font-size: var(--road-body-small);\n}\n\n:host(.select-md) .form-select-label {\n top: 0.5rem;\n}\n\n:host(.select-md) .form-select:focus ~ .form-select-label,\n:host(.select-md) .form-select[required]:valid ~ .form-select-label,\n:host(.select-md) .form-select.has-value ~ .form-select-label,\n:host(.select-md) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-md) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-md) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n/ ERROR\n -------------------- /\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-body-small);\n color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid,\n.was-validated .form-select:invalid {\n border-color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid ~ .invalid-feedback,\n.was-validated .form-select:invalid ~ .invalid-feedback {\n display: block;\n}\n","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value === this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value === this.value)?.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}
1	+ {"file":"road-select.entry.js","mappings":"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","names":[],"sources":["src/components/select/select.css?tag=road-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["/\n Select\n \n Index\n * - Select\n * - Label\n * - Sizes\n * - Error\n /\n\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/ SELECT\n -------------------- /\n\n.form-select {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: auto;\n padding: 0.75rem 3rem 0 1rem;\n margin: 0;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=\") no-repeat right 1rem center/1.5rem 2rem;\n background-color: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n.form-select:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 #000000;\n}\n\n.form-select::-ms-expand { / IE fix remove native arrow /\n display: none;\n}\n\n/\n Placeholder\n /\n\n.form-select::placeholder {\n color: var(--road-on-surface-extra-weak);\n}\n\n/\n Hover state\n /\n\n@media (hover: hover) {\n\n .form-select:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/\n Focus state\n /\n\n.form-select:focus ~ .form-select-label,\n.form-select[required]:valid ~ .form-select-label,\n.form-select.has-value ~ .form-select-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-select:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/\n Disabled state\n /\n\n.form-select:disabled,\n.form-select[readonly] {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background-color: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/ LABEL\n -------------------- /\n\n.form-select-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-label-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n.form-select:required ~ .form-select-label::after{\n color: var(--road-on-danger-surface);\n content: \" \";\n}\n\n/* SIZES\n -------------------- /\n\n:host(.select-xl) .form-select {\n min-height: 3.5rem;\n padding: 1rem 1rem 0;\n}\n\n:host(.select-xl) .form-select-label {\n top: 1rem;\n}\n\n:host(.select-xl) .form-select:focus ~ .form-select-label,\n:host(.select-xl) .form-select[required]:valid ~ .form-select-label,\n:host(.select-xl) .form-select.has-value ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-xl) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-lg) .form-select {\n min-height: 3rem;\n}\n\n:host(.select-md) .form-select {\n min-height: 2.5rem;\n padding: 1rem 1rem 0;\n font-size: var(--road-body-small);\n}\n\n:host(.select-md) .form-select-label {\n top: 0.5rem;\n}\n\n:host(.select-md) .form-select:focus ~ .form-select-label,\n:host(.select-md) .form-select[required]:valid ~ .form-select-label,\n:host(.select-md) .form-select.has-value ~ .form-select-label,\n:host(.select-md) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-md) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-md) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n/ ERROR\n -------------------- /\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-body-small);\n color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid,\n.was-validated .form-select:invalid {\n border-color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid ~ .invalid-feedback,\n.was-validated .form-select:invalid ~ .invalid-feedback {\n display: block;\n}\n","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value == this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value == this.value)?.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}

package/dist/roadtrip/{p-869a3d78.entry.js → p-e4c4b312.entry.js} RENAMED Viewed

@@ -1,2 +1,2 @@
-import{r as e,c as s,h as t,H as l}from"./p-f3d586b3.js";const r='.sc-road-select-h{position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);color:var(--road-on-surface)}.form-select.sc-road-select{box-sizing:border-box;display:block;width:100%;height:auto;padding:0.75rem 3rem 0 1rem;margin:0;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=") no-repeat right 1rem center/1.5rem 2rem;background-color:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0.25rem;box-shadow:none;-webkit-appearance:none;appearance:none}.form-select.sc-road-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000000}.form-select.sc-road-select::-ms-expand{display:none}.form-select.sc-road-select::placeholder{color:var(--road-on-surface-extra-weak)}@media (hover: hover){.form-select.sc-road-select:not(:disabled):hover{border-color:var(--road-input-outline-variant)}}.form-select.sc-road-select:focus~.form-select-label.sc-road-select,.form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.form-select.has-value.sc-road-select~.form-select-label.sc-road-select{transform:scale(0.625) translateY(-0.625rem)}.form-select.sc-road-select:not(:disabled):focus{border-color:var(--road-input-outline-variant);outline:0}.form-select.sc-road-select:disabled,.form-select[readonly].sc-road-select{color:var(--road-on-surface-disabled);cursor:not-allowed;background-color:var(--road-surface-disabled);opacity:1}.form-select-label.sc-road-select{position:absolute;top:0.75rem;left:1rem;display:block;font-size:var(--road-label-medium);line-height:1.5;color:var(--road-on-surface-extra-weak);pointer-events:none;transition:transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;transform-origin:0 0}.form-select.sc-road-select:required~.form-select-label.sc-road-select::after{color:var(--road-on-danger-surface);content:" *"}.select-xl.sc-road-select-h .form-select.sc-road-select{min-height:3.5rem;padding:1rem 1rem 0}.select-xl.sc-road-select-h .form-select-label.sc-road-select{top:1rem}.select-xl.sc-road-select-h .form-select.sc-road-select:focus~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select.has-value.sc-road-select~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[type="date"].sc-road-select~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[type="time"].sc-road-select~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-xl.sc-road-select-h .form-select.sc-road-select:placeholder-shown~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-lg.sc-road-select-h .form-select.sc-road-select{min-height:3rem}.select-md.sc-road-select-h .form-select.sc-road-select{min-height:2.5rem;padding:1rem 1rem 0;font-size:var(--road-body-small)}.select-md.sc-road-select-h .form-select-label.sc-road-select{top:0.5rem}.select-md.sc-road-select-h .form-select.sc-road-select:focus~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select.has-value.sc-road-select~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[type="date"].sc-road-select~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[type="time"].sc-road-select~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-md.sc-road-select-h .form-select.sc-road-select:placeholder-shown~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.invalid-feedback.sc-road-select{display:none;width:100%;margin-top:0.5rem;font-size:var(--road-body-small);color:var(--road-on-danger-surface)}.form-select.is-invalid.sc-road-select,.was-validated.sc-road-select .form-select.sc-road-select:invalid{border-color:var(--road-on-danger-surface)}.form-select.is-invalid.sc-road-select~.invalid-feedback.sc-road-select,.was-validated.sc-road-select .form-select.sc-road-select:invalid~.invalid-feedback.sc-road-select{display:block}';const a=class{constructor(t){e(this,t);this.roadchange=s(this,"roadchange",7);this.roadChange=s(this,"roadChange",7);this.roadfocus=s(this,"roadfocus",7);this.roadFocus=s(this,"roadFocus",7);this.roadblur=s(this,"roadblur",7);this.roadBlur=s(this,"roadBlur",7);this.onChange=e=>{const s=e.target;if(s){this.value=s.value||""}};this.onBlur=()=>{this.roadblur.emit();this.roadBlur.emit()};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.selectId=`road-select-${c++}`;this.options=[];this.autofocus=false;this.disabled=false;this.name=this.selectId;this.required=false;this.size=0;this.sizes="xl";this.label=`${this.selectId}-label`;this.error=undefined;this.value=undefined}valueChanged(){this.roadchange.emit({value:this.value});this.roadChange.emit({value:this.value})}componentWillLoad(){if(this.value){this.addSelected()}}addSelected(){var e,s;const t=this.options.find((e=>e.value===this.value));const l=this.options.find((e=>e.selected));if(t){t.selected=true}if(l){l.selected=false}return(s=(e=this.options.find((e=>e.value===this.value)))===null||e===void 0?void 0:e.value)!==null&&s!==void 0?s:""}render(){const e=this.selectId+"-label";const s=this.value&&this.value!==""?"has-value":"";const r=this.error!==undefined&&this.error!==""?"is-invalid":"";return t(l,{class:this.sizes&&`select-${this.sizes}`},t("select",{class:`form-select ${s} ${r}`,id:this.selectId,"aria-disabled":this.disabled?"true":null,autoFocus:this.autofocus,disabled:this.disabled,name:this.name,required:this.required,size:this.size,onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur},t("option",{selected:true,disabled:true,hidden:true,style:{display:"none"},value:""}),this.options&&this.options.map((e=>t("option",{value:e.value,selected:e.selected},e.label)))),t("label",{class:"form-select-label",id:e,htmlFor:this.selectId},this.label),this.error&&this.error!==""&&t("p",{class:"invalid-feedback"},this.error))}static get watchers(){return{value:["valueChanged"]}}};let c=0;a.style=r;export{a as road_select};
-//# sourceMappingURL=p-869a3d78.entry.js.map
+import{r as e,c as s,h as t,H as l}from"./p-f3d586b3.js";const r='.sc-road-select-h{position:relative;display:block;margin-bottom:1rem;font-family:var(--road-font, sans-serif);color:var(--road-on-surface)}.form-select.sc-road-select{box-sizing:border-box;display:block;width:100%;height:auto;padding:0.75rem 3rem 0 1rem;margin:0;font-size:var(--road-body-medium);line-height:1.5;color:var(--road-on-surface);background:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=") no-repeat right 1rem center/1.5rem 2rem;background-color:var(--road-surface);border:1px solid var(--road-input-outline);border-radius:0.25rem;box-shadow:none;-webkit-appearance:none;appearance:none}.form-select.sc-road-select:-moz-focusring{color:transparent;text-shadow:0 0 0 #000000}.form-select.sc-road-select::-ms-expand{display:none}.form-select.sc-road-select::placeholder{color:var(--road-on-surface-extra-weak)}@media (hover: hover){.form-select.sc-road-select:not(:disabled):hover{border-color:var(--road-input-outline-variant)}}.form-select.sc-road-select:focus~.form-select-label.sc-road-select,.form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.form-select.has-value.sc-road-select~.form-select-label.sc-road-select{transform:scale(0.625) translateY(-0.625rem)}.form-select.sc-road-select:not(:disabled):focus{border-color:var(--road-input-outline-variant);outline:0}.form-select.sc-road-select:disabled,.form-select[readonly].sc-road-select{color:var(--road-on-surface-disabled);cursor:not-allowed;background-color:var(--road-surface-disabled);opacity:1}.form-select-label.sc-road-select{position:absolute;top:0.75rem;left:1rem;display:block;font-size:var(--road-label-medium);line-height:1.5;color:var(--road-on-surface-extra-weak);pointer-events:none;transition:transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;transform-origin:0 0}.form-select.sc-road-select:required~.form-select-label.sc-road-select::after{color:var(--road-on-danger-surface);content:" *"}.select-xl.sc-road-select-h .form-select.sc-road-select{min-height:3.5rem;padding:1rem 1rem 0}.select-xl.sc-road-select-h .form-select-label.sc-road-select{top:1rem}.select-xl.sc-road-select-h .form-select.sc-road-select:focus~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select.has-value.sc-road-select~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[type="date"].sc-road-select~.form-select-label.sc-road-select,.select-xl.sc-road-select-h .form-select[type="time"].sc-road-select~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-xl.sc-road-select-h .form-select.sc-road-select:placeholder-shown~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-lg.sc-road-select-h .form-select.sc-road-select{min-height:3rem}.select-md.sc-road-select-h .form-select.sc-road-select{min-height:2.5rem;padding:1rem 1rem 0;font-size:var(--road-body-small)}.select-md.sc-road-select-h .form-select-label.sc-road-select{top:0.5rem}.select-md.sc-road-select-h .form-select.sc-road-select:focus~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[required].sc-road-select:valid~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select.has-value.sc-road-select~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[type="date"].sc-road-select~.form-select-label.sc-road-select,.select-md.sc-road-select-h .form-select[type="time"].sc-road-select~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.select-md.sc-road-select-h .form-select.sc-road-select:placeholder-shown~.form-select-label.sc-road-select{transform:scale(0.75) translateY(-0.625rem)}.invalid-feedback.sc-road-select{display:none;width:100%;margin-top:0.5rem;font-size:var(--road-body-small);color:var(--road-on-danger-surface)}.form-select.is-invalid.sc-road-select,.was-validated.sc-road-select .form-select.sc-road-select:invalid{border-color:var(--road-on-danger-surface)}.form-select.is-invalid.sc-road-select~.invalid-feedback.sc-road-select,.was-validated.sc-road-select .form-select.sc-road-select:invalid~.invalid-feedback.sc-road-select{display:block}';const a=class{constructor(t){e(this,t);this.roadchange=s(this,"roadchange",7);this.roadChange=s(this,"roadChange",7);this.roadfocus=s(this,"roadfocus",7);this.roadFocus=s(this,"roadFocus",7);this.roadblur=s(this,"roadblur",7);this.roadBlur=s(this,"roadBlur",7);this.onChange=e=>{const s=e.target;if(s){this.value=s.value||""}};this.onBlur=()=>{this.roadblur.emit();this.roadBlur.emit()};this.onFocus=()=>{this.roadfocus.emit();this.roadFocus.emit()};this.selectId=`road-select-${c++}`;this.options=[];this.autofocus=false;this.disabled=false;this.name=this.selectId;this.required=false;this.size=0;this.sizes="xl";this.label=`${this.selectId}-label`;this.error=undefined;this.value=undefined}valueChanged(){this.roadchange.emit({value:this.value});this.roadChange.emit({value:this.value})}componentWillLoad(){if(this.value){this.addSelected()}}addSelected(){var e,s;const t=this.options.find((e=>e.value==this.value));const l=this.options.find((e=>e.selected));if(t){t.selected=true}if(l){l.selected=false}return(s=(e=this.options.find((e=>e.value==this.value)))===null||e===void 0?void 0:e.value)!==null&&s!==void 0?s:""}render(){const e=this.selectId+"-label";const s=this.value&&this.value!==""?"has-value":"";const r=this.error!==undefined&&this.error!==""?"is-invalid":"";return t(l,{class:this.sizes&&`select-${this.sizes}`},t("select",{class:`form-select ${s} ${r}`,id:this.selectId,"aria-disabled":this.disabled?"true":null,autoFocus:this.autofocus,disabled:this.disabled,name:this.name,required:this.required,size:this.size,onChange:this.onChange,onFocus:this.onFocus,onBlur:this.onBlur},t("option",{selected:true,disabled:true,hidden:true,style:{display:"none"},value:""}),this.options&&this.options.map((e=>t("option",{value:e.value,selected:e.selected},e.label)))),t("label",{class:"form-select-label",id:e,htmlFor:this.selectId},this.label),this.error&&this.error!==""&&t("p",{class:"invalid-feedback"},this.error))}static get watchers(){return{value:["valueChanged"]}}};let c=0;a.style=r;export{a as road_select};
+//# sourceMappingURL=p-e4c4b312.entry.js.map

package/dist/roadtrip/{p-869a3d78.entry.js.map → p-e4c4b312.entry.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["selectCss","Select","this","onChange","ev","select","target","value","onBlur","roadblur","emit","roadBlur","onFocus","roadfocus","roadFocus","selectIds","selectId","valueChanged","roadchange","roadChange","componentWillLoad","addSelected","selectedOption","options","find","option","selectedOption2","selected","_b","_a","render","labelId","hasValueClass","isInvalidClass","error","undefined","h","Host","class","sizes","id","disabled","autoFocus","autofocus","name","required","size","hidden","style","display","map","label","htmlFor"],"sources":["src/components/select/select.css?tag=road-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["/\n Select\n \n Index\n * - Select\n * - Label\n * - Sizes\n * - Error\n /\n\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/ SELECT\n -------------------- /\n\n.form-select {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: auto;\n padding: 0.75rem 3rem 0 1rem;\n margin: 0;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=\") no-repeat right 1rem center/1.5rem 2rem;\n background-color: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n.form-select:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 #000000;\n}\n\n.form-select::-ms-expand { / IE fix remove native arrow /\n display: none;\n}\n\n/\n Placeholder\n /\n\n.form-select::placeholder {\n color: var(--road-on-surface-extra-weak);\n}\n\n/\n Hover state\n /\n\n@media (hover: hover) {\n\n .form-select:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/\n Focus state\n /\n\n.form-select:focus ~ .form-select-label,\n.form-select[required]:valid ~ .form-select-label,\n.form-select.has-value ~ .form-select-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-select:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/\n Disabled state\n /\n\n.form-select:disabled,\n.form-select[readonly] {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background-color: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/ LABEL\n -------------------- /\n\n.form-select-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-label-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n.form-select:required ~ .form-select-label::after{\n color: var(--road-on-danger-surface);\n content: \" \";\n}\n\n/* SIZES\n -------------------- /\n\n:host(.select-xl) .form-select {\n min-height: 3.5rem;\n padding: 1rem 1rem 0;\n}\n\n:host(.select-xl) .form-select-label {\n top: 1rem;\n}\n\n:host(.select-xl) .form-select:focus ~ .form-select-label,\n:host(.select-xl) .form-select[required]:valid ~ .form-select-label,\n:host(.select-xl) .form-select.has-value ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-xl) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-lg) .form-select {\n min-height: 3rem;\n}\n\n:host(.select-md) .form-select {\n min-height: 2.5rem;\n padding: 1rem 1rem 0;\n font-size: var(--road-body-small);\n}\n\n:host(.select-md) .form-select-label {\n top: 0.5rem;\n}\n\n:host(.select-md) .form-select:focus ~ .form-select-label,\n:host(.select-md) .form-select[required]:valid ~ .form-select-label,\n:host(.select-md) .form-select.has-value ~ .form-select-label,\n:host(.select-md) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-md) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-md) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n/ ERROR\n -------------------- /\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-body-small);\n color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid,\n.was-validated .form-select:invalid {\n border-color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid ~ .invalid-feedback,\n.was-validated .form-select:invalid ~ .invalid-feedback {\n display: block;\n}\n","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value === this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value === this.value)?.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"],"mappings":"yDAAA,MAAMA,EAAY,4xI,MCOLC,EAAM,M,uPAwHTC,KAAAC,SAAYC,IAClB,MAAMC,EAASD,EAAGE,OAClB,GAAID,EAAQ,CACVH,KAAKK,MAAQF,EAAOE,OAAS,E,GAIzBL,KAAAM,OAAS,KACfN,KAAKO,SAASC,OACdR,KAAKS,SAASD,MAAM,EAGdR,KAAAU,QAAU,KAChBV,KAAKW,UAAUH,OACfR,KAAKY,UAAUJ,MAAM,E,cAjII,eAAeK,M,aASrC,G,eAKwB,M,cAKD,M,UAKLb,KAAKc,S,cAKA,M,UAML,E,WAKc,K,WAKb,GAAGd,KAAKc,iB,0CAsChC,YAAAC,GACEf,KAAKgB,WAAWR,KAAK,CACnBH,MAAOL,KAAKK,QAEdL,KAAKiB,WAAWT,KAAK,CACnBH,MAAOL,KAAKK,O,CAKhB,iBAAAa,GACE,GAAGlB,KAAKK,MAAM,CACZL,KAAKmB,a,EAIT,WAAAA,G,QACE,MAAMC,EAAiBpB,KAAKqB,QAAQC,MAAKC,GAAUA,EAAOlB,QAAUL,KAAKK,QACzE,MAAMmB,EAAkBxB,KAAKqB,QAAQC,MAAKC,GAAUA,EAAOE,WAE3D,GAAIL,EAAgB,CAChBA,EAAeK,SAAW,I,CAE9B,GAAGD,EAAgB,CACjBA,EAAgBC,SAAW,K,CAI7B,OAAOC,GAAAC,EAAA3B,KAAKqB,QAAQC,MAAKC,GAAUA,EAAOlB,QAAUL,KAAKK,WAAM,MAAAsB,SAAA,SAAAA,EAAEtB,SAAK,MAAAqB,SAAA,EAAAA,EAAI,E,CAqB5E,MAAAE,GACE,MAAMC,EAAU7B,KAAKc,SAAW,SAChC,MAAMgB,EAAgB9B,KAAKK,OAASL,KAAKK,QAAU,GAAK,YAAc,GACtE,MAAM0B,EAAiB/B,KAAKgC,QAAUC,WAAajC,KAAKgC,QAAU,GAAK,aAAe,GAEtF,OACEE,EAACC,EAAI,CAACC,MAAOpC,KAAKqC,OAAS,UAAUrC,KAAKqC,SACxCH,EAAA,UACEE,MAAO,eAAeN,KAAiBC,IACvCO,GAAItC,KAAKc,SAAQ,gBACFd,KAAKuC,SAAW,OAAS,KACxCC,UAAWxC,KAAKyC,UAChBF,SAAUvC,KAAKuC,SACfG,KAAM1C,KAAK0C,KACXC,SAAU3C,KAAK2C,SACfC,KAAM5C,KAAK4C,KACX3C,SAAUD,KAAKC,SACfS,QAASV,KAAKU,QACdJ,OAAQN,KAAKM,QAEb4B,EAAA,UAAQT,SAAQ,KAACc,SAAQ,KAACM,OAAM,KAACC,MAAO,CAAEC,QAAS,QAAU1C,MAAM,KAClEL,KAAKqB,SAAWrB,KAAKqB,QAAQ2B,KAAIzB,GAChCW,EAAA,UAAQ7B,MAAOkB,EAAOlB,MAAOoB,SAAUF,EAAOE,UAAWF,EAAO0B,UAGpEf,EAAA,SAAOE,MAAM,oBAAoBE,GAAIT,EAASqB,QAASlD,KAAKc,UAAWd,KAAKiD,OAC3EjD,KAAKgC,OAAShC,KAAKgC,QAAU,IAAME,EAAA,KAAGE,MAAM,oBAAoBpC,KAAKgC,O,wDAO9E,IAAInB,EAAY,E"}
1	+ {"version":3,"names":["selectCss","Select","this","onChange","ev","select","target","value","onBlur","roadblur","emit","roadBlur","onFocus","roadfocus","roadFocus","selectIds","selectId","valueChanged","roadchange","roadChange","componentWillLoad","addSelected","selectedOption","options","find","option","selectedOption2","selected","_b","_a","render","labelId","hasValueClass","isInvalidClass","error","undefined","h","Host","class","sizes","id","disabled","autoFocus","autofocus","name","required","size","hidden","style","display","map","label","htmlFor"],"sources":["src/components/select/select.css?tag=road-select&encapsulation=scoped","src/components/select/select.tsx"],"sourcesContent":["/\n Select\n \n Index\n * - Select\n * - Label\n * - Sizes\n * - Error\n /\n\n\n:host {\n position: relative;\n display: block;\n margin-bottom: 1rem;\n font-family: var(--road-font, sans-serif);\n color: var(--road-on-surface);\n}\n\n/ SELECT\n -------------------- /\n\n.form-select {\n box-sizing: border-box;\n display: block;\n width: 100%;\n height: auto;\n padding: 0.75rem 3rem 0 1rem;\n margin: 0;\n font-size: var(--road-body-medium);\n line-height: 1.5;\n color: var(--road-on-surface);\n background: url(\"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2NCA2NCIgZmlsbD0icmdiYSgyMywgMzAsIDUyLCAwLjcyKSI+PHBhdGggZD0iTTIzIDI2bDkgMTIgOS0xMnoiLz48L3N2Zz4=\") no-repeat right 1rem center/1.5rem 2rem;\n background-color: var(--road-surface);\n border: 1px solid var(--road-input-outline);\n border-radius: 0.25rem;\n box-shadow: none;\n appearance: none;\n}\n\n.form-select:-moz-focusring {\n color: transparent;\n text-shadow: 0 0 0 #000000;\n}\n\n.form-select::-ms-expand { / IE fix remove native arrow /\n display: none;\n}\n\n/\n Placeholder\n /\n\n.form-select::placeholder {\n color: var(--road-on-surface-extra-weak);\n}\n\n/\n Hover state\n /\n\n@media (hover: hover) {\n\n .form-select:not(:disabled):hover {\n border-color: var(--road-input-outline-variant);\n }\n}\n\n/\n Focus state\n /\n\n.form-select:focus ~ .form-select-label,\n.form-select[required]:valid ~ .form-select-label,\n.form-select.has-value ~ .form-select-label {\n transform: scale(0.625) translateY(-0.625rem);\n}\n\n.form-select:not(:disabled):focus {\n border-color: var(--road-input-outline-variant);\n outline: 0;\n}\n\n/\n Disabled state\n /\n\n.form-select:disabled,\n.form-select[readonly] {\n color: var(--road-on-surface-disabled);\n cursor: not-allowed;\n background-color: var(--road-surface-disabled);\n opacity: 1;\n}\n\n/ LABEL\n -------------------- /\n\n.form-select-label {\n position: absolute;\n top: 0.75rem;\n left: 1rem;\n display: block;\n font-size: var(--road-label-medium);\n line-height: 1.5;\n color: var(--road-on-surface-extra-weak);\n pointer-events: none;\n transition: transform 200ms cubic-bezier(0, 0, 0.2, 1) 0ms;\n transform-origin: 0 0;\n}\n\n.form-select:required ~ .form-select-label::after{\n color: var(--road-on-danger-surface);\n content: \" \";\n}\n\n/* SIZES\n -------------------- /\n\n:host(.select-xl) .form-select {\n min-height: 3.5rem;\n padding: 1rem 1rem 0;\n}\n\n:host(.select-xl) .form-select-label {\n top: 1rem;\n}\n\n:host(.select-xl) .form-select:focus ~ .form-select-label,\n:host(.select-xl) .form-select[required]:valid ~ .form-select-label,\n:host(.select-xl) .form-select.has-value ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-xl) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-xl) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-lg) .form-select {\n min-height: 3rem;\n}\n\n:host(.select-md) .form-select {\n min-height: 2.5rem;\n padding: 1rem 1rem 0;\n font-size: var(--road-body-small);\n}\n\n:host(.select-md) .form-select-label {\n top: 0.5rem;\n}\n\n:host(.select-md) .form-select:focus ~ .form-select-label,\n:host(.select-md) .form-select[required]:valid ~ .form-select-label,\n:host(.select-md) .form-select.has-value ~ .form-select-label,\n:host(.select-md) .form-select[type=\"date\"] ~ .form-select-label,\n:host(.select-md) .form-select[type=\"time\"] ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n:host(.select-md) .form-select:placeholder-shown ~ .form-select-label {\n transform: scale(0.75) translateY(-0.625rem);\n}\n\n/ ERROR\n -------------------- /\n\n.invalid-feedback {\n display: none;\n width: 100%;\n margin-top: 0.5rem;\n font-size: var(--road-body-small);\n color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid,\n.was-validated .form-select:invalid {\n border-color: var(--road-on-danger-surface);\n}\n\n.form-select.is-invalid ~ .invalid-feedback,\n.was-validated .form-select:invalid ~ .invalid-feedback {\n display: block;\n}\n","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\n componentWillLoad() {\n if(this.value){\n this.addSelected();\n }\n }\n \n addSelected() {\n const selectedOption = this.options.find(option => option.value == this.value);\n const selectedOption2 = this.options.find(option => option.selected);\n\n if (selectedOption) {\n selectedOption.selected = true;\n }\n if(selectedOption2){\n selectedOption2.selected = false\n }\n \n\n return this.options.find(option => option.value == this.value)?.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"],"mappings":"yDAAA,MAAMA,EAAY,4xI,MCOLC,EAAM,M,uPAwHTC,KAAAC,SAAYC,IAClB,MAAMC,EAASD,EAAGE,OAClB,GAAID,EAAQ,CACVH,KAAKK,MAAQF,EAAOE,OAAS,E,GAIzBL,KAAAM,OAAS,KACfN,KAAKO,SAASC,OACdR,KAAKS,SAASD,MAAM,EAGdR,KAAAU,QAAU,KAChBV,KAAKW,UAAUH,OACfR,KAAKY,UAAUJ,MAAM,E,cAjII,eAAeK,M,aASrC,G,eAKwB,M,cAKD,M,UAKLb,KAAKc,S,cAKA,M,UAML,E,WAKc,K,WAKb,GAAGd,KAAKc,iB,0CAsChC,YAAAC,GACEf,KAAKgB,WAAWR,KAAK,CACnBH,MAAOL,KAAKK,QAEdL,KAAKiB,WAAWT,KAAK,CACnBH,MAAOL,KAAKK,O,CAKhB,iBAAAa,GACE,GAAGlB,KAAKK,MAAM,CACZL,KAAKmB,a,EAIT,WAAAA,G,QACE,MAAMC,EAAiBpB,KAAKqB,QAAQC,MAAKC,GAAUA,EAAOlB,OAASL,KAAKK,QACxE,MAAMmB,EAAkBxB,KAAKqB,QAAQC,MAAKC,GAAUA,EAAOE,WAE3D,GAAIL,EAAgB,CAChBA,EAAeK,SAAW,I,CAE9B,GAAGD,EAAgB,CACjBA,EAAgBC,SAAW,K,CAI7B,OAAOC,GAAAC,EAAA3B,KAAKqB,QAAQC,MAAKC,GAAUA,EAAOlB,OAASL,KAAKK,WAAM,MAAAsB,SAAA,SAAAA,EAAEtB,SAAK,MAAAqB,SAAA,EAAAA,EAAI,E,CAqB3E,MAAAE,GACE,MAAMC,EAAU7B,KAAKc,SAAW,SAChC,MAAMgB,EAAgB9B,KAAKK,OAASL,KAAKK,QAAU,GAAK,YAAc,GACtE,MAAM0B,EAAiB/B,KAAKgC,QAAUC,WAAajC,KAAKgC,QAAU,GAAK,aAAe,GAEtF,OACEE,EAACC,EAAI,CAACC,MAAOpC,KAAKqC,OAAS,UAAUrC,KAAKqC,SACxCH,EAAA,UACEE,MAAO,eAAeN,KAAiBC,IACvCO,GAAItC,KAAKc,SAAQ,gBACFd,KAAKuC,SAAW,OAAS,KACxCC,UAAWxC,KAAKyC,UAChBF,SAAUvC,KAAKuC,SACfG,KAAM1C,KAAK0C,KACXC,SAAU3C,KAAK2C,SACfC,KAAM5C,KAAK4C,KACX3C,SAAUD,KAAKC,SACfS,QAASV,KAAKU,QACdJ,OAAQN,KAAKM,QAEb4B,EAAA,UAAQT,SAAQ,KAACc,SAAQ,KAACM,OAAM,KAACC,MAAO,CAAEC,QAAS,QAAU1C,MAAM,KAClEL,KAAKqB,SAAWrB,KAAKqB,QAAQ2B,KAAIzB,GAChCW,EAAA,UAAQ7B,MAAOkB,EAAOlB,MAAOoB,SAAUF,EAAOE,UAAWF,EAAO0B,UAGpEf,EAAA,SAAOE,MAAM,oBAAoBE,GAAIT,EAASqB,QAASlD,KAAKc,UAAWd,KAAKiD,OAC3EjD,KAAKgC,OAAShC,KAAKgC,QAAU,IAAME,EAAA,KAAGE,MAAM,oBAAoBpC,KAAKgC,O,wDAO9E,IAAInB,EAAY,E"}

package/dist/roadtrip/roadtrip.esm.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{p as e,b as a}from"./p-f3d586b3.js";export{s as setNonce}from"./p-f3d586b3.js";const o=()=>{const a=import.meta.url;const o={};if(a!==""){o.resourcesUrl=new URL(".",a).href}return e(o)};o().then((e=>a(JSON.parse('[["p-336f7def",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[2],"max":[2],"step":[1],"value":[2],"size":[1],"dustbin":[4],"readonly":[4],"leftIconClasses":[32],"rightIconClasses":[32],"isDustbinVisible":[32]},null,{"value":["onValueChange"]}],[1,"road-item",{"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-badge",{"color":[1],"bubble":[4]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[1,"road-drawer",{"isOpen":[1028,"is-open"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64],"back":[64]},[[4,"keyup","onEscape"]],{"isOpen":["handleOpen"]}],[1,"road-col"],[1,"road-grid"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"iconOnly":[516,"icon-only"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[6,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"sizes":[1],"type":[1],"value":[1032],"label":[1],"error":[1],"helper":[1],"debounce":[2]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}],[1,"road-input-group"],[1,"road-label"],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]},null,{"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["p-1c5ac353",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["p-96b80b11",[[2,"road-phone-number-input",{"disabled":[4],"countryData":[16],"language":[1],"codeLabel":[1,"code-label"],"phoneLabel":[1,"phone-label"],"phoneValue":[1,"phone-value"],"countryCode":[1,"country-code"],"errorMessage":[1,"error-message"],"required":[4],"selectedCountry":[32],"selectedCountryCode":[32],"phoneNumber":[32],"countryOptions":[32],"returnObject":[32]},null,{"errorMessage":["updateMessagePosition"]}]]],["p-33002e9d",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]},null,{"value":["valueChanged"]}]]],["p-2c8a6854",[[1,"road-profil-dropdown",{"isOpen":[1028,"is-open"]}]]],["p-cbc00bfb",[[1,"road-rating",{"size":[513],"rate":[2],"showreviews":[4],"readonly":[4],"reviews":[2],"reviewsText":[1,"reviews-text"],"url":[1]}]]],["p-2b5974fc",[[1,"road-accordion",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isLightSeparator":[4,"is-light-separator"],"isSmall":[4,"is-small"]}]]],["p-6177bb46",[[1,"road-banner",{"isOpen":[1028,"is-open"],"label":[1],"link":[1],"url":[1],"close":[64]}]]],["p-2c132382",[[1,"road-carousel",{"options":[8],"pager":[4],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]},null,{"options":["optionsChanged"]}]]],["p-414a2791",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"indeterminate":[4],"disabled":[4],"value":[1],"label":[1],"inverse":[4],"error":[1],"helper":[1]},null,{"checked":["checkedChanged"]}]]],["p-4f47f4f7",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["p-e2149bdf",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["p-6e3e0b40",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-00e51171",[[1,"road-dropdown",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isMedium":[4,"is-medium"],"position":[513],"direction":[513]}]]],["p-a73ef7de",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-ee7aaee5",[[6,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"],"showTick":[4,"show-tick"],"showLabels":[4,"show-labels"]},null,{"value":["valueChanged"]}]]],["p-82919e58",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"open":[64],"close":[64]},null,{"isOpen":["isOpenChanged"]}]]],["p-6f170c25",[[1,"road-alert",{"color":[1],"label":[1],"button":[1],"link":[1],"url":[1]}]]],["p-efe6e22f",[[2,"road-area-code",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1025],"triggerRender":[1026,"trigger-render"],"selectedValue":[32]},null,{"value":["valueChanged"]}]]],["p-7048f786",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["p-4ec82d24",[[1,"road-button-floating",{"position":[513],"href":[1],"rel":[1],"target":[1]},[[9,"scroll","onScroll"]]]]],["p-0fca389a",[[4,"road-carousel-item"]]],["p-25ade729",[[1,"road-flap",{"color":[1],"filled":[4],"size":[513]}]]],["p-40daa53b",[[1,"road-global-navigation",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-dcb280e3",[[1,"road-illustration",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"illustration":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"illustrationSvgContent":[32],"isVisible":[32]},null,{"name":["loadIllustration"],"src":["loadIllustration"],"illustration":["loadIllustration"]}]]],["p-bfcedcfb",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]},null,{"src":["srcChanged"]}]]],["p-60e25858",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-336aa5f6",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]]]]],["p-f5cce766",[[1,"road-progress",{"value":[2],"numbersteps":[1],"label":[1],"showstep":[4],"animation":[4],"light":[4],"fullwidth":[4],"color":[1]}]]],["p-254ba3c4",[[1,"road-progress-indicator-horizontal",{"color":[513],"numberStep":[2,"number-step"],"stateFirstStep":[1,"state-first-step"],"stateSecondStep":[1,"state-second-step"],"stateThirdStep":[1,"state-third-step"],"urlStep1":[1,"url-step-1"],"urlStep2":[1,"url-step-2"],"urlStep3":[1,"url-step-3"]}]]],["p-9bef58e1",[[1,"road-progress-indicator-vertical"]]],["p-68599145",[[4,"road-progress-indicator-vertical-item"]]],["p-b2e7bfcb",[[1,"road-progress-tracker"]]],["p-e42a9ec4",[[4,"road-progress-tracker-item"]]],["p-76ccfc61",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"inverse":[4],"error":[4],"helper":[1],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["p-96abbe85",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025],"helper":[1]},null,{"value":["valueChanged"],"error":["errorChanged"]}]]],["p-ea28a425",[[1,"road-segmented-button",{"size":[1],"selected":[1028],"tab":[1]},[[8,"roadSegmentedButtonBarChanged","onButtonBarChanged"],[8,"roadSegmentedButtonbarchanged","onButtonBarChanged"]]]]],["p-20b115ed",[[1,"road-segmented-button-bar",{"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-4ba769a9",[[1,"road-segmented-buttons",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-869a3d78",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1032]},null,{"value":["valueChanged"]}]]],["p-1a761fc0",[[6,"road-select-filter",{"options":[16],"parameters":[8],"isActive":[4,"is-active"],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadBlur","handleBlur"],[0,"roadblur","handleBlur"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[4,"click","onClickOutside"]]]]],["p-b614a9fb",[[1,"road-skeleton"]]],["p-f6d47cda",[[1,"road-spinner",{"size":[513],"color":[513]}]]],["p-30fa62f4",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-6a27b5fc",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["p-b65f0a62",[[1,"road-tab-bar",{"secondary":[4],"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-b09c076d",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["p-d651deea",[[6,"road-table"]]],["p-db7cb1c8",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-cbe0c628",[[1,"road-tag",{"color":[1],"contrast":[4]}]]],["p-5483109e",[[1,"road-text",{"color":[1]}]]],["p-acbc0a14",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"sizes":[1],"readonly":[4],"required":[4],"spellcheck":[4],"resize":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1],"helper":[1]},null,{"value":["valueChanged"]}]]],["p-64aa6fd0",[[2,"road-toggle",{"toggleId":[1,"toggle-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-e2c6d81f",[[1,"road-toolbar-title"]]],["p-25683dc7",[[1,"road-toolbar-title-page"]]],["p-46cccafc",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"contentAlign":[1,"content-align"],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["p-78e9bbd5",[[1,"road-avatar",{"size":[513]}]]],["p-91098d39",[[1,"road-card",{"elevation":[1],"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]]]'),e)));
+import{p as e,b as a}from"./p-f3d586b3.js";export{s as setNonce}from"./p-f3d586b3.js";const o=()=>{const a=import.meta.url;const o={};if(a!==""){o.resourcesUrl=new URL(".",a).href}return e(o)};o().then((e=>a(JSON.parse('[["p-336f7def",[[2,"road-counter",{"inputId":[1,"input-id"],"min":[2],"max":[2],"step":[1],"value":[2],"size":[1],"dustbin":[4],"readonly":[4],"leftIconClasses":[32],"rightIconClasses":[32],"isDustbinVisible":[32]},null,{"value":["onValueChange"]}],[1,"road-item",{"button":[4],"detail":[4],"active":[4],"detailIcon":[1,"detail-icon"],"disabled":[4],"download":[1],"href":[1],"rel":[1],"lines":[1],"target":[1],"type":[1],"multipleInputs":[32]}],[1,"road-badge",{"color":[1],"bubble":[4]}],[1,"road-list",{"lines":[1]}],[1,"road-toolbar",{"color":[1]}],[1,"road-drawer",{"isOpen":[1028,"is-open"],"position":[1],"drawerWidth":[2,"drawer-width"],"hasInverseHeader":[4,"has-inverse-header"],"hasBackIcon":[4,"has-back-icon"],"backText":[1,"back-text"],"drawerTitle":[1,"drawer-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64],"back":[64]},[[4,"keyup","onEscape"]],{"isOpen":["handleOpen"]}],[1,"road-col"],[1,"road-grid"],[1,"road-row"],[1,"road-button",{"color":[1],"size":[513],"buttonType":[1,"button-type"],"iconOnly":[516,"icon-only"],"disabled":[516],"expand":[516],"download":[1],"href":[1],"rel":[1],"target":[1],"outline":[4]}],[6,"road-input",{"inputId":[1,"input-id"],"autocapitalize":[1],"autocomplete":[1],"autocorrect":[1],"autofocus":[4],"disabled":[4],"enterkeyhint":[1],"inputmode":[1],"max":[1],"maxlength":[2],"min":[1],"minlength":[2],"name":[1],"pattern":[1],"placeholder":[1],"readonly":[4],"required":[4],"spellcheck":[4],"step":[1],"size":[2],"sizes":[1],"type":[1],"value":[1032],"label":[1],"error":[1],"helper":[1],"debounce":[2]},null,{"debounce":["debounceChanged"],"value":["valueChanged"]}],[1,"road-input-group"],[1,"road-label"],[1,"road-icon",{"color":[1],"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"icon":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"svgContent":[32],"isVisible":[32]},null,{"name":["loadIcon"],"src":["loadIcon"],"icon":["loadIcon"]}]]],["p-1c5ac353",[[1,"road-duration",{"isOpen":[1028,"is-open"],"header":[1],"min":[2],"max":[2],"step":[2],"open":[64],"close":[64]},[[0,"roadcardclick","handleClick"]]]]],["p-96b80b11",[[2,"road-phone-number-input",{"disabled":[4],"countryData":[16],"language":[1],"codeLabel":[1,"code-label"],"phoneLabel":[1,"phone-label"],"phoneValue":[1,"phone-value"],"countryCode":[1,"country-code"],"errorMessage":[1,"error-message"],"required":[4],"selectedCountry":[32],"selectedCountryCode":[32],"phoneNumber":[32],"countryOptions":[32],"returnObject":[32]},null,{"errorMessage":["updateMessagePosition"]}]]],["p-33002e9d",[[2,"road-plate-number",{"country":[1],"disabled":[4],"placeholder":[1],"readonly":[4],"value":[1032],"motorbike":[4]},null,{"value":["valueChanged"]}]]],["p-2c8a6854",[[1,"road-profil-dropdown",{"isOpen":[1028,"is-open"]}]]],["p-cbc00bfb",[[1,"road-rating",{"size":[513],"rate":[2],"showreviews":[4],"readonly":[4],"reviews":[2],"reviewsText":[1,"reviews-text"],"url":[1]}]]],["p-2b5974fc",[[1,"road-accordion",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isLightSeparator":[4,"is-light-separator"],"isSmall":[4,"is-small"]}]]],["p-6177bb46",[[1,"road-banner",{"isOpen":[1028,"is-open"],"label":[1],"link":[1],"url":[1],"close":[64]}]]],["p-2c132382",[[1,"road-carousel",{"options":[8],"pager":[4],"arrows":[4],"update":[64],"updateAutoHeight":[64],"slideTo":[64],"slideNext":[64],"slidePrev":[64],"getActiveIndex":[64],"getPreviousIndex":[64],"length":[64],"isEnd":[64],"isBeginning":[64],"startAutoplay":[64],"stopAutoplay":[64],"lockSwipeToNext":[64],"lockSwipeToPrev":[64],"lockSwipes":[64],"getSwiper":[64]},null,{"options":["optionsChanged"]}]]],["p-414a2791",[[6,"road-checkbox",{"checkboxId":[1,"checkbox-id"],"name":[1],"required":[4],"checked":[1028],"indeterminate":[4],"disabled":[4],"value":[1],"label":[1],"inverse":[4],"error":[1],"helper":[1]},null,{"checked":["checkedChanged"]}]]],["p-4f47f4f7",[[1,"road-chip",{"color":[1],"outline":[4],"size":[1],"hasCloseIcon":[4,"has-close-icon"]}]]],["p-e2149bdf",[[1,"road-collapse",{"isOpen":[1028,"is-open"],"showMore":[1,"show-more"],"showLess":[1,"show-less"],"centered":[4]}]]],["p-6e3e0b40",[[1,"road-dialog",{"isOpen":[1028,"is-open"],"hasCloseIcon":[4,"has-close-icon"],"color":[1],"icon":[1],"label":[1],"description":[1],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-00e51171",[[1,"road-dropdown",{"isOpen":[1028,"is-open"],"isLight":[4,"is-light"],"isMedium":[4,"is-medium"],"position":[513],"direction":[513]}]]],["p-a73ef7de",[[1,"road-modal",{"maxWidth":[2,"max-width"],"isOpen":[1028,"is-open"],"hasInverseHeader":[4,"has-inverse-header"],"modalTitle":[1,"modal-title"],"hasCloseIcon":[4,"has-close-icon"],"open":[64],"close":[64]},[[4,"keyup","onEscape"]]]]],["p-ee7aaee5",[[6,"road-range",{"rangeId":[1,"range-id"],"value":[1032],"min":[1],"max":[1],"step":[1],"showValue":[4,"show-value"],"showTick":[4,"show-tick"],"showLabels":[4,"show-labels"]},null,{"value":["valueChanged"]}]]],["p-82919e58",[[1,"road-toast",{"isOpen":[1028,"is-open"],"color":[1],"label":[1],"timeout":[2],"open":[64],"close":[64]},null,{"isOpen":["isOpenChanged"]}]]],["p-6f170c25",[[1,"road-alert",{"color":[1],"label":[1],"button":[1],"link":[1],"url":[1]}]]],["p-efe6e22f",[[2,"road-area-code",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1025],"triggerRender":[1026,"trigger-render"],"selectedValue":[32]},null,{"value":["valueChanged"]}]]],["p-7048f786",[[6,"road-autocomplete",{"options":[16],"visible":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[4,"click","onClickOutside"]]]]],["p-4ec82d24",[[1,"road-button-floating",{"position":[513],"href":[1],"rel":[1],"target":[1]},[[9,"scroll","onScroll"]]]]],["p-0fca389a",[[4,"road-carousel-item"]]],["p-25ade729",[[1,"road-flap",{"color":[1],"filled":[4],"size":[513]}]]],["p-40daa53b",[[1,"road-global-navigation",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-dcb280e3",[[1,"road-illustration",{"ariaLabel":[1537,"aria-label"],"ariaHidden":[513,"aria-hidden"],"name":[1],"src":[1],"illustration":[8],"size":[1],"rotate":[1],"lazy":[4],"sanitize":[4],"illustrationSvgContent":[32],"isVisible":[32]},null,{"name":["loadIllustration"],"src":["loadIllustration"],"illustration":["loadIllustration"]}]]],["p-bfcedcfb",[[1,"road-img",{"alt":[1],"src":[1],"loadSrc":[32],"loadError":[32]},null,{"src":["srcChanged"]}]]],["p-60e25858",[[1,"road-navbar",{"selectedTab":[1,"selected-tab"]},[[0,"roadNavbarItemClick","onNavbarChanged"],[0,"roadnavbaritemclick","onNavbarChanged"]],{"selectedTab":["selectedTabChanged"]}]]],["p-336aa5f6",[[1,"road-navbar-item",{"disabled":[4],"download":[1],"href":[1],"rel":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadNavbarChanged","onNavbarChanged"],[8,"roadnavbarchanged","onNavbarChanged"]]]]],["p-f5cce766",[[1,"road-progress",{"value":[2],"numbersteps":[1],"label":[1],"showstep":[4],"animation":[4],"light":[4],"fullwidth":[4],"color":[1]}]]],["p-254ba3c4",[[1,"road-progress-indicator-horizontal",{"color":[513],"numberStep":[2,"number-step"],"stateFirstStep":[1,"state-first-step"],"stateSecondStep":[1,"state-second-step"],"stateThirdStep":[1,"state-third-step"],"urlStep1":[1,"url-step-1"],"urlStep2":[1,"url-step-2"],"urlStep3":[1,"url-step-3"]}]]],["p-9bef58e1",[[1,"road-progress-indicator-vertical"]]],["p-68599145",[[4,"road-progress-indicator-vertical-item"]]],["p-b2e7bfcb",[[1,"road-progress-tracker"]]],["p-e42a9ec4",[[4,"road-progress-tracker-item"]]],["p-76ccfc61",[[2,"road-radio",{"radioId":[1,"radio-id"],"name":[1],"required":[4],"disabled":[4],"value":[8],"label":[1],"inverse":[4],"error":[4],"helper":[1],"inline":[4],"checked":[32]},[[8,"roadChange","onRoadChangedChanged"],[8,"roadchange","onRoadChangedChanged"]]]]],["p-96abbe85",[[6,"road-radio-group",{"radioGroupId":[1,"radio-group-id"],"allowEmptySelection":[4,"allow-empty-selection"],"name":[1],"value":[1032],"label":[1],"asterisk":[4],"ariaLabel":[513,"aria-label"],"error":[1025],"helper":[1]},null,{"value":["valueChanged"],"error":["errorChanged"]}]]],["p-ea28a425",[[1,"road-segmented-button",{"size":[1],"selected":[1028],"tab":[1]},[[8,"roadSegmentedButtonBarChanged","onButtonBarChanged"],[8,"roadSegmentedButtonbarchanged","onButtonBarChanged"]]]]],["p-20b115ed",[[1,"road-segmented-button-bar",{"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-4ba769a9",[[1,"road-segmented-buttons",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-e4c4b312",[[2,"road-select",{"selectId":[1,"select-id"],"options":[16],"autofocus":[4],"disabled":[4],"name":[1],"required":[4],"size":[2],"sizes":[1],"label":[1],"error":[1],"value":[1032]},null,{"value":["valueChanged"]}]]],["p-1a761fc0",[[6,"road-select-filter",{"options":[16],"parameters":[8],"isActive":[4,"is-active"],"onlySelect":[4,"only-select"],"isOpen":[32],"currentValue":[32]},[[0,"roadFocus","handleFocus"],[0,"roadfocus","handleFocus"],[0,"roadBlur","handleBlur"],[0,"roadblur","handleBlur"],[0,"roadChange","handleChange"],[0,"roadchange","handleChange"],[4,"click","onClickOutside"]]]]],["p-b614a9fb",[[1,"road-skeleton"]]],["p-f6d47cda",[[1,"road-spinner",{"size":[513],"color":[513]}]]],["p-30fa62f4",[[2,"road-switch",{"switchId":[1,"switch-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-6a27b5fc",[[1,"road-tab",{"active":[1028],"tab":[1],"setActive":[64]}]]],["p-b65f0a62",[[1,"road-tab-bar",{"secondary":[4],"expand":[4],"center":[4],"selectedTab":[1,"selected-tab"]},null,{"selectedTab":["selectedTabChanged"]}]]],["p-b09c076d",[[1,"road-tab-button",{"download":[1],"href":[1],"rel":[1],"layout":[1],"selected":[1028],"tab":[1],"target":[1]},[[8,"roadTabBarChanged","onTabBarChanged"],[8,"roadTabbarchanged","onTabBarChanged"]]]]],["p-d651deea",[[6,"road-table"]]],["p-db7cb1c8",[[1,"road-tabs",{"selectedTab":[32],"select":[64],"getTab":[64],"getSelected":[64]}]]],["p-cbe0c628",[[1,"road-tag",{"color":[1],"contrast":[4]}]]],["p-5483109e",[[1,"road-text",{"color":[1]}]]],["p-acbc0a14",[[2,"road-textarea",{"textareaId":[1,"textarea-id"],"autocapitalize":[1],"autofocus":[4],"disabled":[4],"inputmode":[1],"enterkeyhint":[1],"maxlength":[2],"minlength":[2],"name":[1],"placeholder":[1],"sizes":[1],"readonly":[4],"required":[4],"spellcheck":[4],"resize":[4],"cols":[2],"rows":[2],"wrap":[1],"value":[1025],"label":[1],"error":[1],"helper":[1]},null,{"value":["valueChanged"]}]]],["p-64aa6fd0",[[2,"road-toggle",{"toggleId":[1,"toggle-id"],"name":[1],"checked":[1028],"disabled":[4],"label":[1],"color":[1],"hasLeftLabel":[4,"has-left-label"],"isSpaced":[4,"is-spaced"],"value":[1],"on":[1],"off":[1]},null,{"checked":["checkedChanged"]}]]],["p-e2c6d81f",[[1,"road-toolbar-title"]]],["p-25683dc7",[[1,"road-toolbar-title-page"]]],["p-46cccafc",[[1,"road-tooltip",{"tooltipId":[1,"tooltip-id"],"content":[1],"position":[1],"contentAlign":[1,"content-align"],"isOpen":[1028,"is-open"],"trigger":[1],"open":[64],"close":[64]}]]],["p-78e9bbd5",[[1,"road-avatar",{"size":[513]}]]],["p-91098d39",[[1,"road-card",{"elevation":[1],"button":[4],"value":[1],"type":[1],"download":[1],"href":[1],"rel":[1],"target":[1]}]]]]'),e)));
 //# sourceMappingURL=roadtrip.esm.js.map

package/hydrate/index.js CHANGED Viewed

@@ -17098,7 +17098,7 @@ class Select {
   }
   addSelected() {
     var _a, _b;
-    const selectedOption = this.options.find(option => option.value === this.value);
+    const selectedOption = this.options.find(option => option.value == this.value);
     const selectedOption2 = this.options.find(option => option.selected);
     if (selectedOption) {
       selectedOption.selected = true;
@@ -17106,7 +17106,7 @@ class Select {
     if (selectedOption2) {
       selectedOption2.selected = false;
     }
-    return (_b = (_a = this.options.find(option => option.value === this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
+    return (_b = (_a = this.options.find(option => option.value == this.value)) === null || _a === void 0 ? void 0 : _a.value) !== null && _b !== void 0 ? _b : '';
   }
   render() {
     const labelId = this.selectId + '-label';

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@roadtrip/components",
-  "version": "3.13.1",
+  "version": "3.13.2",
   "description": "Web Component library for Roadtrip Design System",
   "license": "Apache-2.0",
   "homepage": "https://gitlab.com/mobivia-design/roadtrip/components",