{"version":3,"file":"JCheckbox.vue.cjs","sources":["../../../../src/components/atoms/JCheckbox.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { computed, ref, watch } from 'vue'\r\nimport { Checkbox } from '@/components/shadcn'\r\n\r\ntype StyleType =\r\n  | 'default'   // 기본 스타일\r\n  | 'primary'   // 강조 스타일 (파랑)\r\n  | 'success'   // 성공 스타일 (초록)\r\n  | 'danger'    // 위험 스타일 (빨강)\r\n  | 'sm'        // 작은 크기\r\n  | 'lg'        // 큰 크기\r\n\r\nconst props = withDefaults(\r\n  defineProps<{\r\n    modelValue?: string\r\n    disabled?: boolean\r\n    required?: boolean\r\n    name?: string\r\n    id?: string\r\n    class?: string\r\n    /** 스타일 프리셋 */\r\n    styletype?: StyleType\r\n  }>(),\r\n  {\r\n    modelValue: 'N',\r\n    disabled: false,\r\n    required: false,\r\n    styletype: 'default',\r\n  },\r\n)\r\n\r\nconst emit = defineEmits<{\r\n  'update:modelValue': [value: string]\r\n  'change': [value: string]\r\n}>()\r\n\r\n/**\r\n * styletype -> class 매핑\r\n */\r\nconst STYLE_PRESETS: Record<StyleType, { class: string }> = {\r\n  default: { class: '' },\r\n  primary: { \r\n    class: 'border-blue-500 data-[state=checked]:bg-blue-500',\r\n  },\r\n  success: { \r\n    class: 'border-green-500 data-[state=checked]:bg-green-600',\r\n  },\r\n  danger: { \r\n    class: 'border-destructive data-[state=checked]:bg-destructive',\r\n  },\r\n  sm: { \r\n    class: 'h-3.5 w-3.5',\r\n  },\r\n  lg: { \r\n    class: 'h-5 w-5',\r\n  },\r\n}\r\n\r\n/** 최종 바인딩 */\r\nconst computedClass = computed(() => {\r\n  const styleKey = props.styletype || 'default'\r\n  const preset = STYLE_PRESETS[styleKey] ?? STYLE_PRESETS.default\r\n  return [preset?.class, props.class].filter(Boolean).join(' ')\r\n})\r\n\r\n// 내부 상태로 boolean checked 관리\r\nconst internalChecked = ref<boolean>(props.modelValue === 'Y')\r\n\r\n// modelValue 변경 감지하여 내부 상태 동기화\r\nwatch(\r\n  () => props.modelValue,\r\n  (newValue) => {\r\n    const shouldBeChecked = newValue === 'Y'\r\n    if (internalChecked.value !== shouldBeChecked) {\r\n      internalChecked.value = shouldBeChecked\r\n    }\r\n  },\r\n  { immediate: true }\r\n)\r\n\r\n// 내부 상태 변경 시 modelValue로 emit\r\nwatch(internalChecked, (newChecked) => {\r\n  const value = newChecked ? 'Y' : 'N'\r\n  if (value !== props.modelValue) {\r\n    emit('update:modelValue', value)\r\n    emit('change', value)\r\n  }\r\n})\r\n</script>\r\n\r\n<template>\r\n  <Checkbox\r\n    :id=\"props.id\"\r\n    v-model=\"internalChecked\"\r\n    :disabled=\"props.disabled\"\r\n    :required=\"props.required\"\r\n    :name=\"props.name\"\r\n    :class=\"computedClass\"\r\n  />\r\n</template>\r\n"],"names":["props","__props","emit","__emit","STYLE_PRESETS","computedClass","computed","styleKey","internalChecked","ref","watch","newValue","shouldBeChecked","newChecked","value","_createBlock","_unref","Checkbox","$event"],"mappings":"2cAYA,MAAMA,EAAQC,EAmBRC,EAAOC,EAQPC,EAAsD,CAC1D,QAAS,CAAE,MAAO,EAAA,EAClB,QAAS,CACP,MAAO,kDAAA,EAET,QAAS,CACP,MAAO,oDAAA,EAET,OAAQ,CACN,MAAO,wDAAA,EAET,GAAI,CACF,MAAO,aAAA,EAET,GAAI,CACF,MAAO,SAAA,CACT,EAIIC,EAAgBC,EAAAA,SAAS,IAAM,CACnC,MAAMC,EAAWP,EAAM,WAAa,UAEpC,MAAO,EADQI,EAAcG,CAAQ,GAAKH,EAAc,UACxC,MAAOJ,EAAM,KAAK,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG,CAC9D,CAAC,EAGKQ,EAAkBC,EAAAA,IAAaT,EAAM,aAAe,GAAG,EAG7DU,OAAAA,EAAAA,MACE,IAAMV,EAAM,WACXW,GAAa,CACZ,MAAMC,EAAkBD,IAAa,IACjCH,EAAgB,QAAUI,IAC5BJ,EAAgB,MAAQI,EAE5B,EACA,CAAE,UAAW,EAAA,CAAK,EAIpBF,QAAMF,EAAkBK,GAAe,CACrC,MAAMC,EAAQD,EAAa,IAAM,IAC7BC,IAAUd,EAAM,aAClBE,EAAK,oBAAqBY,CAAK,EAC/BZ,EAAK,SAAUY,CAAK,EAExB,CAAC,wBAICC,EAAAA,YAOEC,EAAAA,MAAAC,EAAAA,OAAA,EAAA,CANC,GAAIjB,EAAM,cACFQ,EAAA,2CAAAA,EAAe,MAAAU,GACvB,SAAUlB,EAAM,SAChB,SAAUA,EAAM,SAChB,KAAMA,EAAM,KACZ,uBAAOK,EAAA,KAAa,CAAA"}