@extclp/vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
1 lines • 4.13 kB
Source Map (JSON)
{"version":3,"file":"timeline.vue2.mjs","sources":["../../../components/timeline/timeline.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, provide, reactive, toRef } from 'vue'\n\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\nimport { debounceMinor, isNull } from '@vexip-ui/utils'\nimport { timelineProps } from './props'\nimport { TIMELINE_STATE } from './symbol'\n\nimport type { ItemState, TimelineState } from './symbol'\n\ndefineOptions({ name: 'Timeline' })\n\nconst _props = defineProps(timelineProps)\nconst props = useProps('timeline', _props, {\n pending: false,\n dashed: false,\n lineColor: null,\n spacing: null,\n flip: false,\n horizontal: false,\n alternate: false\n})\n\nconst nh = useNameHelper('timeline')\nconst itemStates = reactive(new Set<ItemState>())\n\nconst className = computed(() => {\n return {\n [nh.b()]: true,\n [nh.bs('vars')]: true,\n [nh.bm('inherit')]: props.inherit,\n [nh.bm('pending')]: props.pending,\n [nh.bm('alternate')]: props.alternate,\n [nh.bm('flip')]: props.flip,\n [nh.bm('horizontal')]: props.horizontal\n }\n})\nconst height = computed(() => {\n return Math.max(...Array.from(itemStates).map(state => state.height)) * 2\n})\n\ndefineExpose({ itemStates })\n\nconst refreshLabels = debounceMinor(() => {\n const total = itemStates.size\n\n Array.from(itemStates).forEach((item, index) => {\n item.index = index + 1\n item.total = total\n\n if (isNull(item.label)) {\n item.label = index + 1\n }\n })\n})\n\nconst state: TimelineState = reactive({\n dashed: toRef(props, 'dashed'),\n lineColor: toRef(props, 'lineColor'),\n spacing: toRef(props, 'spacing'),\n alternate: toRef(props, 'alternate'),\n horizontal: toRef(props, 'horizontal'),\n increaseItem,\n decreaseItem,\n handleSignalClick\n})\n\nprovide(TIMELINE_STATE, state)\n\nfunction increaseItem(item: ItemState) {\n itemStates.add(item)\n refreshLabels()\n}\n\nfunction decreaseItem(item: ItemState) {\n itemStates.delete(item)\n refreshLabels()\n}\n\nfunction handleSignalClick(label: string | number) {\n emitEvent(props.onSignalClick, label)\n}\n</script>\n\n<template>\n <div\n :class=\"className\"\n :style=\"{ height: props.horizontal && props.alternate ? `${height}px` : undefined }\"\n >\n <slot></slot>\n </div>\n</template>\n"],"names":["props","useProps","__props","nh","useNameHelper","itemStates","reactive","className","computed","height","state","__expose","refreshLabels","debounceMinor","total","item","index","isNull","toRef","increaseItem","decreaseItem","handleSignalClick","provide","TIMELINE_STATE","label","emitEvent"],"mappings":";;;;;;;;;;AAaM,UAAAA,IAAQC,EAAS,YADRC,GAC4B;AAAA,MACzC,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,SAAS;AAAA,MACT,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,WAAW;AAAA,IAAA,CACZ,GAEKC,IAAKC,EAAc,UAAU,GAC7BC,IAAaC,EAAa,oBAAA,KAAgB,GAE1CC,IAAYC,EAAS,OAClB;AAAA,MACL,CAACL,EAAG,EAAE,CAAC,GAAG;AAAA,MACV,CAACA,EAAG,GAAG,MAAM,CAAC,GAAG;AAAA,MACjB,CAACA,EAAG,GAAG,SAAS,CAAC,GAAGH,EAAM;AAAA,MAC1B,CAACG,EAAG,GAAG,SAAS,CAAC,GAAGH,EAAM;AAAA,MAC1B,CAACG,EAAG,GAAG,WAAW,CAAC,GAAGH,EAAM;AAAA,MAC5B,CAACG,EAAG,GAAG,MAAM,CAAC,GAAGH,EAAM;AAAA,MACvB,CAACG,EAAG,GAAG,YAAY,CAAC,GAAGH,EAAM;AAAA,IAC/B,EACD,GACKS,IAASD,EAAS,MACf,KAAK,IAAI,GAAG,MAAM,KAAKH,CAAU,EAAE,IAAI,CAAAK,MAASA,EAAM,MAAM,CAAC,IAAI,CACzE;AAEY,IAAAC,EAAA,EAAE,YAAAN,GAAY;AAErB,UAAAO,IAAgBC,EAAc,MAAM;AACxC,YAAMC,IAAQT,EAAW;AAEzB,YAAM,KAAKA,CAAU,EAAE,QAAQ,CAACU,GAAMC,MAAU;AAC9C,QAAAD,EAAK,QAAQC,IAAQ,GACrBD,EAAK,QAAQD,GAETG,EAAOF,EAAK,KAAK,MACnBA,EAAK,QAAQC,IAAQ;AAAA,MACvB,CACD;AAAA,IAAA,CACF,GAEKN,IAAuBJ,EAAS;AAAA,MACpC,QAAQY,EAAMlB,GAAO,QAAQ;AAAA,MAC7B,WAAWkB,EAAMlB,GAAO,WAAW;AAAA,MACnC,SAASkB,EAAMlB,GAAO,SAAS;AAAA,MAC/B,WAAWkB,EAAMlB,GAAO,WAAW;AAAA,MACnC,YAAYkB,EAAMlB,GAAO,YAAY;AAAA,MACrC,cAAAmB;AAAA,MACA,cAAAC;AAAA,MACA,mBAAAC;AAAA,IAAA,CACD;AAED,IAAAC,EAAQC,GAAgBb,CAAK;AAE7B,aAASS,EAAaJ,GAAiB;AACrC,MAAAV,EAAW,IAAIU,CAAI,GACLH,EAAA;AAAA,IAAA;AAGhB,aAASQ,EAAaL,GAAiB;AACrC,MAAAV,EAAW,OAAOU,CAAI,GACRH,EAAA;AAAA,IAAA;AAGhB,aAASS,EAAkBG,GAAwB;AACvC,MAAAC,EAAAzB,EAAM,eAAewB,CAAK;AAAA,IAAA;;;;;;;;;"}