vexip-ui/lib/components/captcha/captcha-slider.vue2.cjs.map

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

{"version":3,"file":"captcha-slider.vue2.cjs","sources":["../../../components/captcha/captcha-slider.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Icon } from '@/components/icon'\nimport { useFieldStore } from '@/components/form'\nimport { Renderer } from '@/components/renderer'\n\nimport { computed, nextTick, ref, watch } from 'vue'\n\nimport {\n  createIconProp,\n  createSizeProp,\n  emitEvent,\n  useIcons,\n  useLocale,\n  useNameHelper,\n  useProps,\n} from '@vexip-ui/config'\nimport { useMoving, useSetTimeout } from '@vexip-ui/hooks'\nimport { boundRange, toFixed } from '@vexip-ui/utils'\nimport { captchaSliderProps } from './props'\n\nimport type { CaptchaSliderSlots } from './symbol'\n\ndefineOptions({ name: 'CaptchaSlider' })\n\nconst { idFor, labelId, disabled, loading, size, validateField, getFieldValue, setFieldValue } =\n  useFieldStore<boolean>(focus)\n\nconst _props = defineProps(captchaSliderProps)\nconst props = useProps('captcha', _props, {\n  size: createSizeProp(size),\n  target: {\n    default: 100,\n    validator: value => value >= 0 && value <= 100,\n  },\n  tip: null,\n  successTip: null,\n  tolerance: {\n    default: 1,\n    validator: value => value >= 0,\n  },\n  disabled: () => disabled.value,\n  loading: () => loading.value,\n  loadingIcon: createIconProp(),\n  loadingLock: false,\n  loadingEffect: null,\n  onBeforeTest: {\n    default: null,\n    isFunc: true,\n  },\n  slots: () => ({}),\n})\n\ndefineSlots<CaptchaSliderSlots>()\n\nconst nh = useNameHelper('captcha')\nconst locale = useLocale('captcha')\nconst icons = useIcons()\n\nconst { timer } = useSetTimeout()\n\nconst currentLeft = ref(0)\nconst testing = ref(false)\nconst resetting = ref(false)\nconst isSuccess = ref(false)\nconst testLoading = ref(false)\n\nconst track = ref<HTMLElement>()\n\nconst readonly = computed(() => props.disabled || (props.loading && props.loadingLock))\n\nlet widthLimit: number\n\nconst { target: trigger, moving: dragging } = useMoving({\n  onStart: (_, event) => {\n    if (\n      testing.value ||\n      readonly.value ||\n      !track.value ||\n      !trigger.value ||\n      isSuccess.value ||\n      resetting.value ||\n      event.button > 0\n    ) {\n      return false\n    }\n\n    widthLimit = track.value.getBoundingClientRect().width\n    currentLeft.value = 0\n    verifyPosition()\n    trigger.value.focus()\n    emitEvent(props.onDragStart, currentLeft.value)\n  },\n  onMove: state => {\n    if (testing.value || readonly.value || isSuccess.value || resetting.value) {\n      return false\n    }\n\n    currentLeft.value = (state.deltaX / widthLimit) * 100\n    verifyPosition()\n    emitEvent(props.onDrag, currentLeft.value)\n  },\n  onEnd: async () => {\n    if (testing.value || readonly.value) return\n\n    testing.value = true\n\n    const matched = matchTarget(currentLeft.value)\n    let customResult: unknown\n\n    if (typeof props.onBeforeTest === 'function') {\n      nextTick(() => {\n        testLoading.value = true\n      })\n      customResult = await props.onBeforeTest(currentLeft.value, matched)\n      nextTick(() => {\n        testLoading.value = false\n      })\n    }\n\n    if (currentLeft.value && (customResult === false || (!matched && customResult !== true))) {\n      resetting.value = true\n      currentLeft.value = 0\n      isSuccess.value = false\n\n      setFieldValue(false)\n      emitEvent(props.onFail)\n    } else if (matched || customResult === true) {\n      isSuccess.value = true\n\n      if (customResult && !matched) {\n        resetting.value = true\n        currentLeft.value = props.target\n      }\n\n      setFieldValue(true)\n      emitEvent(props.onSuccess, currentLeft.value)\n    }\n\n    validateField()\n    trigger.value?.blur()\n    emitEvent(props.onDragEnd, currentLeft.value)\n\n    clearTimeout(timer.testing)\n    testing.value = false\n  },\n})\n\nconst isLoading = computed(() => props.loading || testLoading.value)\nconst className = computed(() => {\n  const baseCls = nh.be('slider')\n\n  return {\n    [baseCls]: true,\n    [nh.bs('vars')]: true,\n    [`${baseCls}--success`]: isSuccess.value,\n    [`${baseCls}--disabled`]: props.disabled,\n    [`${baseCls}--loading`]: isLoading.value,\n    [`${baseCls}--${props.size}`]: props.size !== 'default',\n  }\n})\nconst fillerStyle = computed(() => {\n  return {\n    [nh.cv('filler-transition')]: resetting.value ? 'transform 250ms ease' : undefined,\n    transform: `scaleX(${currentLeft.value / 100})`,\n  }\n})\nconst tipStyle = computed(() => {\n  return {\n    [nh.cv('tip-transition')]: resetting.value ? 'background-position 250ms ease' : undefined,\n    backgroundPosition: `-${currentLeft.value}%`,\n  }\n})\nconst triggerStyle = computed(() => {\n  return {\n    left: `${currentLeft.value}%`,\n    [nh.cv('trigger-transition')]: resetting.value ? 'left 250ms ease' : undefined,\n  }\n})\n\nwatch(\n  () => getFieldValue(),\n  value => {\n    if (!value) {\n      reset()\n    } else {\n      if (!matchTarget(currentLeft.value)) {\n        resetting.value = true\n        currentLeft.value = props.target\n      }\n\n      isSuccess.value = true\n    }\n  },\n)\nwatch(readonly, value => value && reset())\n\ndefineExpose({\n  idFor,\n  currentLeft,\n  resetting,\n  isSuccess,\n  dragging,\n  isLoading,\n  track,\n  trigger,\n  focus,\n  reset,\n})\n\nfunction verifyPosition() {\n  currentLeft.value = toFixed(boundRange(currentLeft.value, 0, 100), 3)\n}\n\nfunction reset() {\n  resetting.value = true\n  currentLeft.value = 0\n  isSuccess.value = false\n}\n\nfunction afterReset() {\n  resetting.value = false\n}\n\nfunction matchTarget(value: number) {\n  return Math.abs(props.target - value) <= props.tolerance\n}\n\nfunction focus(options?: FocusOptions) {\n  trigger.value?.focus(options)\n}\n</script>\n\n<template>\n  <div\n    :id=\"idFor\"\n    ref=\"wrapper\"\n    :class=\"className\"\n    tabindex=\"-1\"\n    role=\"group\"\n    :aria-labelledby=\"labelId\"\n  >\n    <div\n      :class=\"{\n        [nh.be('filler')]: true,\n        [nh.bem('filler', 'loading')]: isLoading,\n        [nh.bem('filler', 'success')]: isSuccess\n      }\"\n      :style=\"fillerStyle\"\n    ></div>\n    <div\n      :class=\"{\n        [nh.be('tip')]: true,\n        [nh.bem('tip', 'focused')]: dragging,\n        [nh.bem('tip', 'loading')]: isLoading,\n        [nh.bem('tip', 'success')]: isSuccess\n      }\"\n      :style=\"tipStyle\"\n    >\n      <slot name=\"tip\" :success=\"isSuccess\">\n        <Renderer :renderer=\"props.slots.tip\" :data=\"{ success: isSuccess }\">\n          {{ isSuccess ? (props.successTip ?? locale.success) : (props.tip ?? locale.slideEnd) }}\n        </Renderer>\n      </slot>\n    </div>\n    <div ref=\"track\" :class=\"nh.be('track')\">\n      <div\n        ref=\"trigger\"\n        :class=\"{\n          [nh.be('trigger')]: true,\n          [nh.bem('trigger', 'focused')]: dragging,\n          [nh.bem('trigger', 'loading')]: isLoading,\n          [nh.bem('trigger', 'success')]: isSuccess\n        }\"\n        tabindex=\"0\"\n        :style=\"triggerStyle\"\n        @transitionend=\"afterReset\"\n      >\n        <slot name=\"trigger\" :success=\"isSuccess\">\n          <Renderer :renderer=\"props.slots.trigger\" :data=\"{ success: isSuccess }\">\n            <Icon v-if=\"isSuccess\" v-bind=\"icons.check\"></Icon>\n            <Icon\n              v-else-if=\"isLoading\"\n              v-bind=\"icons.loading\"\n              :effect=\"props.loadingEffect || icons.loading.effect\"\n              :icon=\"props.loadingIcon || icons.loading.icon\"\n            ></Icon>\n            <Icon v-else v-bind=\"icons.anglesRight\"></Icon>\n          </Renderer>\n        </slot>\n      </div>\n    </div>\n  </div>\n</template>\n"],"names":["idFor","labelId","disabled","loading","size","validateField","getFieldValue","setFieldValue","useFieldStore","focus","_props","__props","props","useProps","createSizeProp","value","createIconProp","nh","useNameHelper","locale","useLocale","icons","useIcons","timer","useSetTimeout","currentLeft","ref","testing","resetting","isSuccess","testLoading","track","readonly","computed","widthLimit","trigger","dragging","useMoving","_","event","verifyPosition","emitEvent","state","matched","matchTarget","customResult","nextTick","_a","isLoading","className","baseCls","fillerStyle","tipStyle","triggerStyle","watch","reset","__expose","toFixed","boundRange","afterReset","options","_createElementBlock","_unref","_createElementVNode","_normalizeClass","_renderSlot","_ctx","_createVNode","Renderer","_createTextVNode","_toDisplayString","_createBlock","Icon","_normalizeProps","_mergeProps","_openBlock"],"mappings":"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"}