@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
1 lines • 3.98 kB
Source Map (JSON)
{"version":3,"file":"upload-list.vue2.mjs","sources":["../../../components/upload/upload-list.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { Renderer } from '@/components/renderer'\nimport { UploadFile } from '@/components/upload-file'\n\nimport { computed } from 'vue'\n\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\nimport { uploadListProps } from './props'\nimport { uploadListTypes } from './symbol'\n\nimport type { UploadFileState, UploadListSlots } from './symbol'\n\ndefineOptions({ name: 'UploadList' })\n\nconst _props = defineProps(uploadListProps)\nconst props = useProps('uploadList', _props, {\n files: {\n default: () => [],\n static: true\n },\n selectToAdd: false,\n iconRenderer: {\n default: null,\n isFunc: true\n },\n type: {\n default: 'name',\n validator: value => uploadListTypes.includes(value)\n },\n loadingText: null,\n style: null,\n precision: 2,\n // 'canPreview' using UploadFile default\n slots: () => ({})\n})\n\nconst slots = defineSlots<UploadListSlots>()\n\nconst nh = useNameHelper('upload')\nconst transitionName = computed(() => nh.ns('fade'))\n\nfunction handleDelete(file: UploadFileState) {\n emitEvent(props.onDelete, file)\n}\n\nfunction handlePreview(file: UploadFileState) {\n emitEvent(props.onPreview, file)\n}\n</script>\n\n<template>\n <ul\n :class=\"[nh.be('files'), nh.bs('vars'), props.inherit && nh.bem('files', 'inherit')]\"\n :style=\"props.style\"\n >\n <Transition\n v-for=\"item in props.files\"\n :key=\"item.id\"\n appear\n :name=\"props.selectToAdd ? transitionName : undefined\"\n >\n <UploadFile\n inherit\n :file=\"item\"\n :icon-renderer=\"props.iconRenderer\"\n :list-type=\"props.type\"\n :loading-text=\"props.loadingText\"\n :select-to-add=\"props.selectToAdd\"\n :precision=\"props.precision\"\n :can-preview=\"props.canPreview\"\n @delete=\"handleDelete\"\n @preview=\"handlePreview\"\n >\n <template v-if=\"slots.item || props.slots.item\" #default=\"{ file, status, percentage }\">\n <slot\n name=\"item\"\n :file=\"file\"\n :status=\"status\"\n :percentage=\"percentage\"\n >\n <Renderer\n :renderer=\"props.slots.item\"\n :data=\"{\n file,\n status,\n percentage\n }\"\n ></Renderer>\n </slot>\n </template>\n <template v-if=\"slots.icon || props.slots.icon\" #icon=\"{ file, status, percentage }\">\n <slot\n name=\"icon\"\n :file=\"file\"\n :status=\"status\"\n :percentage=\"percentage\"\n >\n <Renderer :renderer=\"props.slots.icon\" :data=\"{ file, status, percentage }\"></Renderer>\n </slot>\n </template>\n </UploadFile>\n </Transition>\n <slot name=\"suffix\">\n <Renderer :renderer=\"props.slots.suffix\"></Renderer>\n </slot>\n </ul>\n</template>\n"],"names":["props","useProps","__props","value","uploadListTypes","slots","_useSlots","nh","useNameHelper","transitionName","computed","handleDelete","file","emitEvent","handlePreview"],"mappings":";;;;;;;;;;;;;AAeM,UAAAA,IAAQC,EAAS,cADRC,GAC8B;AAAA,MAC3C,OAAO;AAAA,QACL,SAAS,MAAM,CAAC;AAAA,QAChB,QAAQ;AAAA,MACV;AAAA,MACA,aAAa;AAAA,MACb,cAAc;AAAA,QACZ,SAAS;AAAA,QACT,QAAQ;AAAA,MACV;AAAA,MACA,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,WAAW,CAAAC,MAASC,EAAgB,SAASD,CAAK;AAAA,MACpD;AAAA,MACA,aAAa;AAAA,MACb,OAAO;AAAA,MACP,WAAW;AAAA;AAAA,MAEX,OAAO,OAAO,CAAC;AAAA,IAAA,CAChB,GAEKE,IAAQC,EAAA,GAERC,IAAKC,EAAc,QAAQ,GAC3BC,IAAiBC,EAAS,MAAMH,EAAG,GAAG,MAAM,CAAC;AAEnD,aAASI,EAAaC,GAAuB;AACjC,MAAAC,EAAAb,EAAM,UAAUY,CAAI;AAAA,IAAA;AAGhC,aAASE,EAAcF,GAAuB;AAClC,MAAAC,EAAAb,EAAM,WAAWY,CAAI;AAAA,IAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}