{"version":3,"file":"Toggle.cjs","sources":["../../common/Toggle/Toggle.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed } from \"vue\";\n\nimport type { ToggleProps } from \"./types\";\n\nconst { modelValue = false, size = \"large\", labelEnabled = \"\", labelDisabled = \"\", showLabel = false, disabled = false } = defineProps<ToggleProps>();\n\nconst emits = defineEmits([\"update:modelValue\"]);\n\nconst model = computed({\n  get() {\n    return modelValue;\n  },\n  set(val) {\n    emits(\"update:modelValue\", val);\n  },\n});\n</script>\n\n<template>\n  <div v-if=\"size === 'small'\" class=\"flex cursor-pointer items-center\">\n    <label\n      class=\"switch relative cursor-pointer rounded-full\"\n      :class=\"[model ? 'bg-app-success' : 'bg-app-gray-400', { 'mr-2': showLabel, '!bg-app-gray-200 !cursor-not-allowed': disabled }]\"\n    >\n      <input v-model=\"model\" :disabled=\"disabled\" type=\"checkbox\" class=\"peer sr-only\" />\n      <div class=\"knob bg-app-white size-3 rounded-full\" :class=\"{ 'float-right': model }\" />\n    </label>\n    <div v-if=\"showLabel\" class=\"text-app-gray-600 dark:text-app-gray-100 text-base\">\n      <span v-if=\"model\">{{ labelEnabled || \"Enabled\" }}</span>\n      <span v-else>{{ labelDisabled || \"Disabled\" }}</span>\n    </div>\n  </div>\n  <label v-else class=\"toggle relative cursor-pointer\" :class=\"[`${size}`, { '!cursor-not-allowed': disabled }]\" :style=\"{ width: '300px' }\">\n    <input v-model=\"model\" :disabled=\"disabled\" type=\"checkbox\" class=\"peer sr-only\" />\n    <div class=\"toggle-tab\" :class=\"model ? 'selected' : 'unselected'\">\n      {{ labelEnabled || \"Select\" }}\n    </div>\n    <div class=\"toggle-tab\" :class=\"model ? 'unselected' : 'selected'\">\n      {{ labelDisabled || \"Unselect\" }}\n    </div>\n  </label>\n</template>\n\n<style scoped>\n@reference \"../../styles/main.css\";\n\n.toggle {\n  @apply flex rounded-md overflow-hidden cursor-pointer;\n}\n.toggle.medium {\n  @apply h-6 text-xs;\n}\n.toggle.large {\n  @apply h-11 text-sm;\n}\n.toggle-tab {\n  @apply grow items-center justify-center flex;\n}\n.toggle-tab.selected {\n  @apply text-app-white bg-app-primary-500;\n}\n.toggle-tab.unselected {\n  @apply text-app-gray-400 bg-app-gray-300;\n}\n.switch {\n  padding: 2px;\n  width: 34px;\n}\n.knob {\n  width: 14px;\n  height: 14px;\n}\n</style>\n"],"names":["emits","__emit","model","computed","__props","val","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","$event","_normalizeClass","_hoisted_3"],"mappings":"whBAOA,MAAMA,EAAQC,EAERC,EAAQC,EAAAA,SAAS,CACrB,KAAM,CACJ,OAAOC,EAAA,UACT,EACA,IAAIC,EAAK,CACPL,EAAM,oBAAqBK,CAAG,CAChC,CAAA,CACD,eAIYD,EAAA,OAAI,SAAfE,EAAAA,YAAAC,EAAAA,mBAYM,MAZNC,EAYM,CAXJC,EAAAA,mBAMQ,QAAA,CALN,wBAAM,8CAA6C,CAC1CP,QAAK,iBAAA,kBAAA,CAAA,OAAmDE,EAAA,iDAAmDA,EAAA,QAAA,CAAQ,CAAA,CAAA,CAAA,oBAE5HK,EAAAA,mBAAmF,QAAA,sCAAnEP,EAAK,MAAAQ,GAAG,SAAUN,EAAA,SAAU,KAAK,WAAW,MAAM,cAAA,+BAAlDF,EAAA,KAAK,CAAA,GACrBO,EAAAA,mBAAuF,MAAA,CAAlF,MAAKE,EAAAA,eAAA,CAAC,wCAAuC,CAAA,cAA0BT,EAAA,MAAK,CAAA,CAAA,cAExEE,EAAA,WAAXE,EAAAA,UAAA,EAAAC,EAAAA,mBAGM,MAHNK,EAGM,CAFQV,EAAA,OAAZI,YAAA,EAAAC,qBAAyD,2BAAnCH,EAAA,cAAY,SAAA,EAAA,CAAA,IAClCE,YAAA,EAAAC,qBAAqD,2BAArCH,EAAA,eAAa,UAAA,EAAA,CAAA,EAAA,kDAGjCG,EAAAA,mBAQQ,QAAA,OARM,MAAKI,EAAAA,eAAA,CAAC,iCAAgC,CAAA,GAAaP,EAAA,IAAI,0BAA6BA,EAAA,QAAA,CAAQ,CAAA,CAAA,EAAM,MAAO,CAAA,MAAA,OAAA,CAAA,oBACrHK,EAAAA,mBAAmF,QAAA,sCAAnEP,EAAK,MAAAQ,GAAG,SAAUN,EAAA,SAAU,KAAK,WAAW,MAAM,cAAA,+BAAlDF,EAAA,KAAK,CAAA,GACrBO,EAAAA,mBAEM,MAAA,CAFD,MAAKE,EAAAA,eAAA,CAAC,aAAqBT,EAAA,MAAK,WAAA,YAAA,CAAA,CAAA,oBAChCE,EAAA,cAAY,QAAA,EAAA,CAAA,EAEjBK,EAAAA,mBAEM,MAAA,CAFD,MAAKE,EAAAA,eAAA,CAAC,aAAqBT,EAAA,MAAK,aAAA,UAAA,CAAA,CAAA,oBAChCE,EAAA,eAAa,UAAA,EAAA,CAAA,CAAA"}