@extclp/vexip-ui/es/components/switch/switch.vue2.mjs.map

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

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