{"version":3,"file":"RegionSelector-Dm66bXcM.js","sources":["../../../app/frontend/components/inputs/RegionSelector.vue"],"sourcesContent":["<template>\n    <div class=\"flex flex-col bg-[#F3F4F6] p-[8px] mt-[10px] border-b-[1px] border-t-[1px] border-b-[#E5E7EB] border-t-[#E5E7EB]\">\n        <span class=\"text-[#1F2A37] font-md\">Add Region</span>\n        <div class=\"flex flex-wrap gap-[10px]\">\n            <label v-for=\"region in Object.keys(REGIONS)\" :key=\"region\" @click=\"setRegionStates(region)\">\n                <span class=\"block border-[1px] border-[#D0D5DD] rounded-[6px] px-[6px] py-[3px] bg-[#FFF] font-medium text-[#344054] cursor-pointer select-none flex items-center gap-[4px]\" :class=\"{'active': selectedRegions.includes(region) }\">\n                    <img width=\"8\" height=\"8\" src=\"@assets/images/icons/plus-2.svg\" alt=\"\">\n                    {{ region }}\n                </span>\n            </label>\n        </div>\n    </div>\n</template>\n<script>\nimport { REGIONS, STATES } from '@/utils/states';\n\nexport default {\n    props: {\n        modelValue: {\n            type: Array,\n            default: null\n        },\n    },\n    setup: () => ({ REGIONS }),\n    data: () => ({\n        regions: []\n    }),\n    computed: {\n        selectedRegions() {\n            return Object.entries(REGIONS)\n                .filter(([_, states]) => Object.keys(states)\n                .every(state => this.modelValue.includes(state)))\n                .map(([region, _]) => region);\n        }\n    },\n    methods: {\n        setRegionStates(region) {\n            let newStates = [...this.modelValue];\n\n            this.selectedRegions.includes(region)\n                ? newStates = newStates.filter((state) => !Object.keys(REGIONS[region]).includes(state))\n                : newStates.push(...Object.keys(STATES.regions([region, ...this.selectedRegions])));\n    \n            newStates = newStates.filter((o, index, self) => index === self.findIndex((t) => (t === o)));\n          \n            this.$emit('update:modelValue', newStates);\n            this.$emit('onSetRegions', newStates);\n        }\n    }\n}\n</script>\n<style scoped>\nspan.active {\n    background-color: #B9E6FE;\n}\nspan.active > img {\n    transform: rotate(45deg);\n}\n</style>"],"names":["_sfc_main","REGIONS","_","states","state","region","newStates","STATES","o","index","self","t","_hoisted_1","_hoisted_2","_withScopeId","_createElementVNode","_hoisted_3","_hoisted_4","_imports_0","_openBlock","_createElementBlock","_Fragment","_renderList","_ctx","$event","$options","_normalizeClass","_hoisted_5","_createTextVNode"],"mappings":"4QAgBA,MAAKA,EAAU,CACX,MAAO,CACH,WAAY,CACR,KAAM,MACN,QAAS,IACZ,CACJ,EACD,MAAO,KAAO,CAAE,QAAAC,IAChB,KAAM,KAAO,CACT,QAAS,CAAC,CACd,GACA,SAAU,CACN,iBAAkB,CACd,OAAO,OAAO,QAAQA,CAAO,EACxB,OAAO,CAAC,CAACC,EAAGC,CAAM,IAAM,OAAO,KAAKA,CAAM,EAC1C,MAAMC,GAAS,KAAK,WAAW,SAASA,CAAK,CAAC,CAAC,EAC/C,IAAI,CAAC,CAACC,EAAQH,CAAC,IAAMG,CAAM,CACpC,CACH,EACD,QAAS,CACL,gBAAgBA,EAAQ,CACpB,IAAIC,EAAY,CAAC,GAAG,KAAK,UAAU,EAEnC,KAAK,gBAAgB,SAASD,CAAM,EAC9BC,EAAYA,EAAU,OAAQF,GAAU,CAAC,OAAO,KAAKH,EAAQI,CAAM,CAAC,EAAE,SAASD,CAAK,CAAC,EACrFE,EAAU,KAAK,GAAG,OAAO,KAAKC,EAAO,QAAQ,CAACF,EAAQ,GAAG,KAAK,eAAe,CAAC,CAAC,CAAC,EAEtFC,EAAYA,EAAU,OAAO,CAACE,EAAGC,EAAOC,IAASD,IAAUC,EAAK,UAAWC,GAAOA,IAAMH,CAAE,CAAC,EAE3F,KAAK,MAAM,oBAAqBF,CAAS,EACzC,KAAK,MAAM,eAAgBA,CAAS,CACxC,CACJ,CACJ,0CAhDSM,EAAA,CAAA,MAAM,kHAAkH,EACzHC,EAAAC,EAAA,IAAAC,EAAsD,OAAhD,CAAA,MAAM,0BAAyB,aAAU,EAAA,CAAA,EAC1CC,EAAA,CAAA,MAAM,2BAA2B,EAH9CC,EAAA,CAAA,SAAA,UAMoBF,EAAuE,MAAA,CAAlE,MAAM,IAAI,OAAO,IAAI,IAAAG,EAAsC,IAAI,sCALpF,OAAAC,EAAA,EAAAC,EAUM,MAVNR,EAUM,CATFC,EACAE,EAOM,MAPNC,EAOM,QANFI,EAKQC,EAAA,KATpBC,EAIoC,OAAO,KAAKC,EAAA,OAAO,EAA7BlB,QAAde,EAKQ,QAAA,CALuC,IAAKf,EAAS,QAAKmB,GAAEC,EAAe,gBAACpB,CAAM,IACtFU,EAGO,OAAA,CAHD,MALtBW,GAK4B,kKAAiK,CAAA,OAAoBD,kBAAgB,SAASpB,CAAM,CAAA,CAAA,CAAA,IAC5NsB,EANpBC,EAM2F,MACpEvB,CAAM,EAAA,CAAA,KAP7B,EAAA,EAAAY,CAAA"}