UNPKG

@extclp/vexip-ui

Version:

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

1 lines 5.02 kB
{"version":3,"file":"image-group.vue2.mjs","sources":["../../../components/image/image-group.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\nimport { ImageViewer } from '@/components/image-viewer'\r\nimport { Renderer } from '@/components/renderer'\r\n\r\nimport { computed, provide, reactive, ref, toRef } from 'vue'\r\n\r\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\r\nimport { debounceMinor } from '@vexip-ui/utils'\r\nimport { imageGroupProps } from './props'\r\nimport { GROUP_STATE } from './symbol'\r\n\r\nimport type { ImageGroupSlots, ImageState } from './symbol'\r\n\r\ndefineOptions({ name: 'ImageGroup' })\r\n\r\nconst _props = defineProps(imageGroupProps)\r\nconst props = useProps('imageGroup', _props, {\r\n showAll: false,\r\n preview: false,\r\n viewerTransfer: null,\r\n slots: () => ({}),\r\n})\r\n\r\nconst slots = defineSlots<ImageGroupSlots>()\r\n\r\nconst nh = useNameHelper('image-group')\r\n\r\nconst currentActive = ref(false)\r\nconst currentIndex = ref(0)\r\nconst imageStates = reactive(new Set<ImageState>())\r\n\r\nconst className = computed(() => {\r\n return [\r\n nh.b(),\r\n nh.ns('image-vars'),\r\n {\r\n [nh.bm('preview')]: props.preview,\r\n },\r\n ]\r\n})\r\nconst srcList = computed(() => Array.from(imageStates).map(state => state.src))\r\n\r\nconst refreshIndex = debounceMinor(() => {\r\n const total = imageStates.size\r\n\r\n Array.from(imageStates).forEach((item, index) => {\r\n item.index = index\r\n item.total = total\r\n })\r\n})\r\n\r\nprovide(\r\n GROUP_STATE,\r\n reactive({\r\n showAll: toRef(props, 'showAll'),\r\n preview: toRef(props, 'preview'),\r\n increaseItem,\r\n decreaseItem,\r\n handlePreview,\r\n }),\r\n)\r\n\r\ndefineExpose({ currentActive, currentIndex })\r\n\r\nfunction increaseItem(item: ImageState) {\r\n imageStates.add(item)\r\n refreshIndex()\r\n}\r\n\r\nfunction decreaseItem(item: ImageState) {\r\n imageStates.delete(item)\r\n refreshIndex()\r\n}\r\n\r\nfunction handlePreview(item: ImageState) {\r\n currentIndex.value = item.index\r\n currentActive.value = true\r\n\r\n emitEvent(props.onPreview, item.src, Array.from(srcList.value))\r\n}\r\n</script>\r\n\r\n<template>\r\n <div :class=\"className\">\r\n <slot></slot>\r\n <ImageViewer\r\n v-if=\"props.preview\"\r\n v-model:active=\"currentActive\"\r\n v-model:index=\"currentIndex\"\r\n :src-list=\"srcList\"\r\n :transfer=\"props.viewerTransfer\"\r\n >\r\n <template v-if=\"slots.preview || props.slots.preview\" #default=\"{ src }\">\r\n <slot name=\"preview\" :src=\"src\">\r\n <Renderer :renderer=\"props.slots.preview\" :data=\"{ src }\"></Renderer>\r\n </slot>\r\n </template>\r\n </ImageViewer>\r\n </div>\r\n</template>\r\n"],"names":["props","useProps","__props","slots","_useSlots","nh","useNameHelper","currentActive","ref","currentIndex","imageStates","reactive","className","computed","srcList","state","refreshIndex","debounceMinor","total","item","index","provide","GROUP_STATE","toRef","increaseItem","decreaseItem","handlePreview","__expose","emitEvent","_createElementBlock","_renderSlot","_ctx","_unref","_createBlock","ImageViewer","$event","_withCtx","src","_createVNode","Renderer"],"mappings":";;;;;;;;;;;;;;AAgBM,UAAAA,IAAQC,EAAS,cADRC,GAC8B;AAAA,MAC3C,SAAS;AAAA,MACT,SAAS;AAAA,MACT,gBAAgB;AAAA,MAChB,OAAO,OAAO,CAAC;AAAA,IAAA,CAChB,GAEKC,IAAQC,EAA8B,GAEtCC,IAAKC,EAAc,aAAa,GAEhCC,IAAgBC,EAAI,EAAK,GACzBC,IAAeD,EAAI,CAAC,GACpBE,IAAcC,EAAa,oBAAA,KAAiB,GAE5CC,IAAYC,EAAS,MAClB;AAAA,MACLR,EAAG,EAAE;AAAA,MACLA,EAAG,GAAG,YAAY;AAAA,MAClB;AAAA,QACE,CAACA,EAAG,GAAG,SAAS,CAAC,GAAGL,EAAM;AAAA,MAAA;AAAA,IAE9B,CACD,GACKc,IAAUD,EAAS,MAAM,MAAM,KAAKH,CAAW,EAAE,IAAI,CAAAK,MAASA,EAAM,GAAG,CAAC,GAExEC,IAAeC,EAAc,MAAM;AACvC,YAAMC,IAAQR,EAAY;AAE1B,YAAM,KAAKA,CAAW,EAAE,QAAQ,CAACS,GAAMC,MAAU;AAC/C,QAAAD,EAAK,QAAQC,GACbD,EAAK,QAAQD;AAAA,MAAA,CACd;AAAA,IAAA,CACF;AAED,IAAAG;AAAA,MACEC;AAAA,MACAX,EAAS;AAAA,QACP,SAASY,EAAMvB,GAAO,SAAS;AAAA,QAC/B,SAASuB,EAAMvB,GAAO,SAAS;AAAA,QAC/B,cAAAwB;AAAA,QACA,cAAAC;AAAA,QACA,eAAAC;AAAA,MACD,CAAA;AAAA,IACH,GAEaC,EAAA,EAAE,eAAApB,GAAe,cAAAE,GAAc;AAE5C,aAASe,EAAaL,GAAkB;AACtC,MAAAT,EAAY,IAAIS,CAAI,GACPH,EAAA;AAAA,IAAA;AAGf,aAASS,EAAaN,GAAkB;AACtC,MAAAT,EAAY,OAAOS,CAAI,GACVH,EAAA;AAAA,IAAA;AAGf,aAASU,EAAcP,GAAkB;AACvC,MAAAV,EAAa,QAAQU,EAAK,OAC1BZ,EAAc,QAAQ,IAEZqB,EAAA5B,EAAM,WAAWmB,EAAK,KAAK,MAAM,KAAKL,EAAQ,KAAK,CAAC;AAAA,IAAA;2BAK9De,EAeM,OAAA;AAAA,MAfA,SAAOjB,EAAS,KAAA;AAAA,IAAA;MACpBkB,EAAaC,EAAA,QAAA,SAAA;AAAA,MAELC,EAAAhC,CAAA,EAAM,aADd,GAAAiC,EAYcD,EAAAE,CAAA,GAAA;AAAA;QAVJ,QAAQ3B,EAAa;AAAA,kDAAbA,EAAa,QAAA4B;AAAA,QACrB,OAAO1B,EAAY;AAAA,iDAAZA,EAAY,QAAA0B;AAAA,QAC1B,YAAUrB,EAAO;AAAA,QACjB,UAAUkB,EAAKhC,CAAA,EAAC;AAAA;QAEDG,EAAM,WAAW6B,KAAM,MAAM;gBAAU;AAAA,UACrD,IAAAI,EAAA,CAEO,EAHyD,KAAAC,QAAG;AAAA,YACnEP,EAEOC,EAFe,QAAA,WAAA,EAAA,KAAAM,KAAtB,MAEO;AAAA,cADLC,EAAqEN,EAAAO,CAAA,GAAA;AAAA,gBAA1D,UAAUP,EAAAhC,CAAA,EAAM,MAAM;AAAA,gBAAU,QAAQ,KAAAqC,EAAG;AAAA;;;;;;;;;"}