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

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

{"version":3,"file":"image-viewer.vue2.mjs","sources":["../../../components/image/image-viewer.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { Icon } from '@/components/icon'\r\nimport { Masker } from '@/components/masker'\r\nimport { Renderer } from '@/components/renderer'\r\nimport { Viewer } from '@/components/viewer'\r\n\r\nimport { computed, ref, watch } from 'vue'\r\n\r\nimport { emitEvent, useIcons, useNameHelper, useProps } from '@vexip-ui/config'\r\nimport { boundRange, ensureArray, isDefined } from '@vexip-ui/utils'\r\nimport { imageViewerProps } from './props'\r\n\r\nimport type { ImageViewerSlots } from './symbol'\r\n\r\ndefineOptions({ name: 'ImageViewer' })\r\n\r\nconst _props = defineProps(imageViewerProps)\r\nconst props = useProps('imageViewer', _props, {\r\n  active: false,\r\n  index: 0,\r\n  srcList: {\r\n    default: '',\r\n    static: true,\r\n  },\r\n  transfer: false,\r\n  viewerProps: () => ({}),\r\n  slots: () => ({}),\r\n})\r\n\r\nconst emit = defineEmits(['update:active', 'update:index'])\r\n\r\ndefineSlots<ImageViewerSlots>()\r\n\r\nconst nh = useNameHelper('image-viewer')\r\nconst icons = useIcons()\r\n\r\nconst currentActive = ref(props.active)\r\nconst currentIndex = ref(props.index)\r\n\r\nconst viewer = ref<InstanceType<typeof Viewer>>()\r\n\r\nconst className = computed(() => {\r\n  return [nh.b(), nh.ns('image-vars'), props.inherit && nh.bm('inherit')]\r\n})\r\nconst srcArray = computed(() => ensureArray(isDefined(props.srcList) ? props.srcList : ''))\r\nconst prevDisabled = computed(() => currentIndex.value <= 0)\r\nconst nextDisabled = computed(() => currentIndex.value >= srcArray.value.length - 1)\r\n\r\nwatch(\r\n  () => props.active,\r\n  value => {\r\n    currentActive.value = value\r\n  },\r\n)\r\nwatch(\r\n  () => props.index,\r\n  value => {\r\n    currentIndex.value = value\r\n  },\r\n)\r\nwatch(() => srcArray.value.length, verifyIndex)\r\n\r\ndefineExpose({\r\n  currentActive,\r\n  currentIndex,\r\n  prevDisabled,\r\n  nextDisabled,\r\n  viewer,\r\n})\r\n\r\nfunction setActive(active: boolean) {\r\n  if (currentActive.value === active) return\r\n\r\n  currentActive.value = active\r\n\r\n  emit('update:active', active)\r\n  emitEvent(props.onToggle, active)\r\n}\r\n\r\nfunction verifyIndex() {\r\n  currentIndex.value = boundRange(currentIndex.value, 0, srcArray.value.length - 1)\r\n}\r\n\r\nfunction handleChange() {\r\n  const value = currentIndex.value\r\n\r\n  viewer.value?.handleReset()\r\n  emit('update:index', value)\r\n  emitEvent(props.onChange, value, srcArray.value[value])\r\n}\r\n\r\nfunction handlePrev() {\r\n  if (prevDisabled.value) return\r\n\r\n  const prev = currentIndex.value\r\n\r\n  currentIndex.value--\r\n  verifyIndex()\r\n  currentIndex.value !== prev && handleChange()\r\n  emitEvent(props.onPrev, currentIndex.value, srcArray.value[currentIndex.value])\r\n}\r\n\r\nfunction handleNext() {\r\n  if (nextDisabled.value) return\r\n\r\n  const prev = currentIndex.value\r\n\r\n  currentIndex.value++\r\n  verifyIndex()\r\n  currentIndex.value !== prev && handleChange()\r\n  emitEvent(props.onNext, currentIndex.value, srcArray.value[currentIndex.value])\r\n}\r\n\r\nfunction handleClose() {\r\n  setActive(false)\r\n  emitEvent(props.onClose)\r\n}\r\n\r\nfunction handleShow() {\r\n  emitEvent(props.onShow)\r\n}\r\n\r\nfunction handleHide() {\r\n  emitEvent(props.onHide)\r\n}\r\n</script>\r\n\r\n<template>\r\n  <Masker\r\n    v-slot=\"{ show }\"\r\n    :active=\"currentActive\"\r\n    :inherit=\"props.inherit\"\r\n    :class=\"className\"\r\n    closable\r\n    auto-remove\r\n    :transfer=\"props.transfer\"\r\n    @show=\"handleShow\"\r\n    @hide=\"handleHide\"\r\n    @toggle=\"setActive\"\r\n  >\r\n    <div v-show=\"show\" :class=\"nh.be('wrapper')\">\r\n      <Viewer v-bind=\"props.viewerProps\" ref=\"viewer\">\r\n        <slot :src=\"srcArray[currentIndex]\">\r\n          <Renderer :renderer=\"props.slots.default\" :data=\"{ src: srcArray[currentIndex] }\">\r\n            <img :src=\"srcArray[currentIndex]\" />\r\n          </Renderer>\r\n        </slot>\r\n      </Viewer>\r\n      <template v-if=\"srcArray.length > 1\">\r\n        <button\r\n          type=\"button\"\r\n          :class=\"[nh.be('prev'), prevDisabled && nh.bem('prev', 'disabled')]\"\r\n          @click.stop=\"handlePrev\"\r\n        >\r\n          <slot name=\"prev\" :disabled=\"prevDisabled\">\r\n            <Renderer :renderer=\"props.slots.prev\" :data=\"{ disabled: prevDisabled }\">\r\n              <div :class=\"nh.be('prev-handler')\">\r\n                <Icon\r\n                  v-bind=\"icons.angleLeft\"\r\n                  :scale=\"+(icons.angleLeft.scale || 1) * 1.4\"\r\n                  label=\"prev\"\r\n                ></Icon>\r\n              </div>\r\n            </Renderer>\r\n          </slot>\r\n        </button>\r\n        <button\r\n          type=\"button\"\r\n          :class=\"[nh.be('next'), nextDisabled && nh.bem('next', 'disabled')]\"\r\n          @click.stop=\"handleNext\"\r\n        >\r\n          <slot name=\"next\" :disabled=\"nextDisabled\">\r\n            <Renderer :renderer=\"props.slots.next\" :data=\"{ disabled: nextDisabled }\">\r\n              <div :class=\"nh.be('next-handler')\">\r\n                <Icon\r\n                  v-bind=\"icons.angleRight\"\r\n                  :scale=\"+(icons.angleRight.scale || 1) * 1.4\"\r\n                  label=\"next\"\r\n                ></Icon>\r\n              </div>\r\n            </Renderer>\r\n          </slot>\r\n        </button>\r\n      </template>\r\n      <button type=\"button\" :class=\"nh.be('close')\" @click.stop=\"handleClose\">\r\n        <slot name=\"close\">\r\n          <Renderer :renderer=\"props.slots.close\">\r\n            <div :class=\"nh.be('close-handler')\">\r\n              <Icon\r\n                v-bind=\"icons.close\"\r\n                :scale=\"+(icons.close.scale || 1) * 1.4\"\r\n                label=\"close\"\r\n              ></Icon>\r\n            </div>\r\n          </Renderer>\r\n        </slot>\r\n      </button>\r\n    </div>\r\n  </Masker>\r\n</template>\r\n"],"names":["props","useProps","__props","emit","__emit","nh","useNameHelper","icons","useIcons","currentActive","ref","currentIndex","viewer","className","computed","srcArray","ensureArray","isDefined","prevDisabled","nextDisabled","watch","value","verifyIndex","__expose","setActive","active","emitEvent","boundRange","handleChange","_a","handlePrev","prev","handleNext","handleClose","handleShow","handleHide","_createBlock","_unref","Masker","_withCtx","show","_createElementVNode","_normalizeClass","_createVNode","Viewer","_mergeProps","_renderSlot","_ctx","Renderer","_createElementBlock","_Fragment","Icon"],"mappings":"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"}