{"version":3,"file":"switch.vue2.mjs","sources":["../../../components/switch/switch.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Icon } from '@/components/icon'\nimport { Renderer } from '@/components/renderer'\nimport { useFieldStore } from '@/components/form'\n\nimport { computed, ref, watch } from 'vue'\n\nimport {\n  createIconProp,\n  createSizeProp,\n  createStateProp,\n  emitEvent,\n  useIcons,\n  useNameHelper,\n  useProps\n} from '@vexip-ui/config'\nimport { isPromise } from '@vexip-ui/utils'\nimport { switchProps } from './props'\n\nimport type { SwitchSlots } from './symbol'\n\ndefineOptions({ name: 'Switch' })\n\nconst {\n  idFor,\n  labelId,\n  state,\n  disabled,\n  loading,\n  size,\n  validateField,\n  getFieldValue,\n  setFieldValue\n} = useFieldStore<boolean>(() => input.value?.focus())\n\nconst _props = defineProps(switchProps)\nconst props = useProps('switch', _props, {\n  size: createSizeProp(size),\n  state: createStateProp(state),\n  value: {\n    default: () => getFieldValue(),\n    static: true\n  },\n  disabled: () => disabled.value,\n  openColor: '',\n  closeColor: '',\n  loading: () => loading.value,\n  loadingIcon: createIconProp(),\n  loadingEffect: null,\n  openIcon: createIconProp(),\n  closeIcon: createIconProp(),\n  openText: '',\n  closeText: '',\n  onBeforeChange: {\n    default: null,\n    isFunc: true\n  },\n  rectangle: false,\n  name: {\n    default: '',\n    static: true\n  },\n  slots: () => ({})\n})\n\nconst emit = defineEmits(['update:value'])\n\ndefineSlots<SwitchSlots>()\n\nconst nh = useNameHelper('switch')\nconst icons = useIcons()\nconst currentValue = ref(props.value)\n\nconst input = ref<HTMLInputElement>()\n\nconst className = computed(() => {\n  return [\n    nh.b(),\n    nh.bs('vars'),\n    {\n      [nh.bm('inherit')]: props.inherit,\n      [nh.bm('open')]: currentValue.value,\n      [nh.bm(props.size)]: props.size !== 'default',\n      [nh.bm(props.state)]: props.state !== 'default',\n      [nh.bm('disabled')]: props.disabled,\n      [nh.bm('loading')]: props.loading,\n      [nh.bm('rectangle')]: props.rectangle\n    }\n  ]\n})\nconst style = computed(() => {\n  return {\n    backgroundColor: currentValue.value ? props.openColor : props.closeColor\n  }\n})\nconst signalStyle = computed(() => {\n  return {\n    color: currentValue.value ? props.openColor : props.closeColor\n  }\n})\nconst isDisabled = computed(() => {\n  return props.disabled || props.loading\n})\n\nwatch(\n  () => props.value,\n  value => {\n    currentValue.value = value\n  }\n)\n\ndefineExpose({\n  idFor,\n  labelId,\n  currentValue,\n  input,\n  focus: (options?: FocusOptions) => input.value?.focus(options),\n  blur: () => input.value?.blur()\n})\n\nasync function handleChange(checked = !currentValue.value) {\n  if (checked === currentValue.value) return\n\n  let result: unknown = true\n\n  if (typeof props.onBeforeChange === 'function') {\n    result = props.onBeforeChange(checked)\n\n    if (isPromise(result)) {\n      result = await result\n    }\n  }\n\n  if (result !== false) {\n    currentValue.value = checked\n\n    emit('update:value', checked)\n    setFieldValue(checked)\n    emitEvent(props.onChange, checked)\n    validateField()\n  }\n}\n</script>\n\n<template>\n  <label\n    :id=\"idFor\"\n    :class=\"className\"\n    role=\"switch\"\n    :aria-checked=\"currentValue\"\n    :aria-disabled=\"isDisabled\"\n    :aria-labelledby=\"labelId\"\n    :style=\"style\"\n  >\n    <input\n      ref=\"input\"\n      type=\"checkbox\"\n      :class=\"nh.be('input')\"\n      :checked=\"currentValue\"\n      :disabled=\"isDisabled\"\n      :name=\"props.name\"\n      @submit.prevent\n      @change=\"handleChange()\"\n      @click.stop\n    />\n    <span :class=\"nh.be('placeholder')\" aria-hidden>\n      <span :class=\"nh.be('open-text')\">\n        <slot name=\"open\">\n          <Renderer :renderer=\"props.slots.open\">{{ props.openText }}</Renderer>\n        </slot>\n      </span>\n      <span :class=\"nh.be('close-text')\">\n        <slot name=\"close\">\n          <Renderer :renderer=\"props.slots.open\">{{ props.closeText }}</Renderer>\n        </slot>\n      </span>\n    </span>\n    <span :class=\"nh.be('signal')\" :style=\"signalStyle\">\n      <slot v-if=\"props.loading\" name=\"loading\">\n        <Renderer :renderer=\"props.slots.loading\">\n          <Icon\n            v-bind=\"icons.loading\"\n            :effect=\"props.loadingEffect || icons.loading.effect\"\n            :icon=\"props.loadingIcon || icons.loading.icon\"\n            label=\"loading\"\n          ></Icon>\n        </Renderer>\n      </slot>\n      <slot v-else name=\"icon\" :value=\"currentValue\">\n        <Renderer :renderer=\"props.slots.icon\" :data=\"{ value: currentValue }\">\n          <Icon v-if=\"currentValue && props.openIcon\" :icon=\"props.openIcon\"></Icon>\n          <Icon v-else-if=\"!currentValue && props.closeIcon\" :icon=\"props.closeIcon\"></Icon>\n        </Renderer>\n      </slot>\n    </span>\n    <span :class=\"nh.be('label')\">\n      <span v-if=\"currentValue\" :class=\"nh.be('open-text')\">\n        <slot name=\"open\">\n          <Renderer :renderer=\"props.slots.open\">{{ props.openText }}</Renderer>\n        </slot>\n      </span>\n      <span v-else :class=\"nh.be('close-text')\">\n        <slot name=\"close\">\n          <Renderer :renderer=\"props.slots.open\">{{ props.closeText }}</Renderer>\n        </slot>\n      </span>\n    </span>\n  </label>\n</template>\n"],"names":["idFor","labelId","state","disabled","loading","size","validateField","getFieldValue","setFieldValue","useFieldStore","_a","input","props","useProps","__props","createSizeProp","createStateProp","createIconProp","emit","__emit","nh","useNameHelper","icons","useIcons","currentValue","ref","className","computed","style","signalStyle","isDisabled","watch","value","__expose","options","handleChange","checked","result","isPromise","emitEvent"],"mappings":"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"}