{"version":3,"file":"Select-DzN9oMK0.js","sources":["../../../app/javascript/src/components/Theme/Select.vue"],"sourcesContent":["<template>\n <div class=\"theme-select\">\n <label v-if=\"label\">\n {{ label }}\n </label>\n <div class=\"theme-select__body\">\n <select\n class=\"form-control select form-input\"\n :required=\"required\"\n :value=\"value\"\n @input=\"$emit('input', $event.target.value)\"\n @change=\"$emit('change', $event.target.value)\"\n :disabled=\"disabled\"\n :class=\"{ 'theme-select_error': error, 'theme-select_placeholder': placeholder && !value }\"\n >\n <option value=\"\" disabled v-if=\"blank\">{{ placeholder }}</option>\n <option v-for=\"option in options\" :key=\"optionKey(option)\" :value=\"optionValue(option)\">\n {{ optionLabel(option) }}\n </option>\n </select>\n <i class=\"icon icon-arrow-down-1\" />\n </div>\n </div>\n</template>\n\n<script setup>\ndefineProps({\n value: { type: [String, Number] },\n required: { type: Boolean, default: false },\n options: Array, // [{key, value, label}]\n blank: { type: Boolean, default: true },\n placeholder: { type: String, default: '' },\n disabled: { type: Boolean, default: false },\n label: { type: String, default: '' },\n error: { type: Boolean, default: false }\n});\ndefineEmits(['input', 'change']);\n\nfunction optionKey(option) {\n return typeof option === 'string' ? option : option.key;\n}\n\nfunction optionValue(option) {\n return typeof option === 'string' ? option : option.value;\n}\n\nfunction optionLabel(option) {\n return typeof option === 'string' ? option : option.label;\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.theme-select {\n label {\n color: $gray;\n text-transform: uppercase;\n font-weight: $font-bold;\n font-size: $text-xs;\n display: block;\n margin-bottom: $spacing-2;\n }\n}\n.theme-select__body {\n position: relative;\n}\n.theme-select .select {\n background: $white;\n}\n.theme-select .icon {\n position: absolute;\n right: $spacing-5;\n color: $gray;\n top: $spacing-3;\n pointer-events: none;\n}\n.theme-select_error {\n border-color: $brand-secondary;\n}\n.theme-select_placeholder {\n color: $gray;\n}\n</style>\n"],"names":["optionKey","option","optionValue","optionLabel"],"mappings":"+rBAsCA,SAASA,EAAUC,EAAQ,CACzB,OAAO,OAAOA,GAAW,SAAWA,EAASA,EAAO,GACtD,CAEA,SAASC,EAAYD,EAAQ,CAC3B,OAAO,OAAOA,GAAW,SAAWA,EAASA,EAAO,KACtD,CAEA,SAASE,EAAYF,EAAQ,CAC3B,OAAO,OAAOA,GAAW,SAAWA,EAASA,EAAO,KACtD"}