@extclp/vexip-ui/es/components/timeline/timeline-item.vue2.mjs.map

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

{"version":3,"file":"timeline-item.vue2.mjs","sources":["../../../components/timeline/timeline-item.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, onMounted, onUpdated, reactive, ref, watch } from 'vue'\n\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\nimport { timelineItemProps } from './props'\nimport { TIMELINE_STATE, timelineItemTypes } from './symbol'\n\nimport type { ItemState } from './symbol'\n\ndefineOptions({ name: 'TimelineItem' })\n\nconst _props = defineProps(timelineItemProps)\nconst props = useProps('timelineItem', _props, {\n  type: {\n    default: 'primary',\n    validator: value => timelineItemTypes.includes(value)\n  },\n  color: '',\n  label: {\n    default: null,\n    static: true\n  },\n  dashed: null,\n  lineColor: null,\n  spacing: null\n})\n\ndefineSlots<{\n  default: () => any,\n  signal: () => any,\n  line: () => any\n}>()\n\nconst timelineState = inject(TIMELINE_STATE, null)\n\nconst nh = useNameHelper('timeline')\nconst currentLabel = ref(props.label)\nconst content = ref<HTMLElement>()\n\nconst className = computed(() => {\n  return {\n    [nh.be('item')]: true,\n    [nh.bem('item', props.type)]: timelineItemTypes.includes(props.type)\n  }\n})\nconst itemStyle = computed(() => {\n  const spacing = props.spacing || props.spacing === 0 ? props.spacing : timelineState?.spacing\n  const style: Record<string, any> = {\n    [nh.cv('item-span')]: typeof spacing === 'number' ? `${spacing}px` : spacing\n  }\n\n  if (props.color) {\n    style[nh.cv('pointer-color')] = props.color\n    style[nh.cv('pointer-b-color')] = props.color\n  }\n\n  return style\n})\nconst lineStyle = computed(() => {\n  const isDashed = props.dashed ?? timelineState?.dashed ?? false\n  const color = props.lineColor ?? timelineState?.lineColor\n\n  return {\n    borderInlineStartStyle: isDashed ? ('dashed' as const) : undefined,\n    borderInlineStartColor: color\n  }\n})\n\ndefineExpose({ currentLabel, content })\n\nif (timelineState) {\n  const state: ItemState = reactive({\n    label: currentLabel,\n    index: 0,\n    total: 0,\n    height: 0\n  })\n\n  timelineState.increaseItem(state)\n\n  watch(() => timelineState.alternate, updateHeight)\n  watch(() => timelineState.horizontal, updateHeight)\n\n  onMounted(updateHeight)\n  onUpdated(updateHeight)\n\n  onBeforeUnmount(() => {\n    timelineState.decreaseItem(state)\n  })\n\n  function updateHeight() {\n    requestAnimationFrame(() => {\n      if (timelineState?.horizontal && content.value) {\n        state.height = content.value.scrollHeight\n      }\n    })\n  }\n}\n\nfunction handleSignalClick() {\n  emitEvent(props.onSignalClick, currentLabel.value)\n  timelineState?.handleSignalClick(currentLabel.value)\n}\n</script>\n\n<template>\n  <div :class=\"className\" :style=\"itemStyle\">\n    <div :class=\"nh.be('signal')\" @click=\"handleSignalClick\">\n      <slot name=\"signal\">\n        <div :class=\"nh.be('pointer')\"></div>\n      </slot>\n    </div>\n    <div :class=\"nh.be('line')\" :style=\"lineStyle\">\n      <slot name=\"line\"></slot>\n    </div>\n    <div ref=\"content\" :class=\"nh.be('content')\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n"],"names":["props","useProps","__props","value","timelineItemTypes","timelineState","inject","TIMELINE_STATE","nh","useNameHelper","currentLabel","ref","content","className","computed","itemStyle","spacing","style","lineStyle","isDashed","color","__expose","updateHeight","state","reactive","watch","onMounted","onUpdated","onBeforeUnmount","handleSignalClick","emitEvent"],"mappings":";;;;;;;;;AAYM,UAAAA,IAAQC,EAAS,gBADRC,GACgC;AAAA,MAC7C,MAAM;AAAA,QACJ,SAAS;AAAA,QACT,WAAW,CAAAC,MAASC,EAAkB,SAASD,CAAK;AAAA,MACtD;AAAA,MACA,OAAO;AAAA,MACP,OAAO;AAAA,QACL,SAAS;AAAA,QACT,QAAQ;AAAA,MACV;AAAA,MACA,QAAQ;AAAA,MACR,WAAW;AAAA,MACX,SAAS;AAAA,IAAA,CACV,GAQKE,IAAgBC,EAAOC,GAAgB,IAAI,GAE3CC,IAAKC,EAAc,UAAU,GAC7BC,IAAeC,EAAIX,EAAM,KAAK,GAC9BY,IAAUD,EAAiB,GAE3BE,IAAYC,EAAS,OAClB;AAAA,MACL,CAACN,EAAG,GAAG,MAAM,CAAC,GAAG;AAAA,MACjB,CAACA,EAAG,IAAI,QAAQR,EAAM,IAAI,CAAC,GAAGI,EAAkB,SAASJ,EAAM,IAAI;AAAA,IACrE,EACD,GACKe,IAAYD,EAAS,MAAM;AACzB,YAAAE,IAAUhB,EAAM,WAAWA,EAAM,YAAY,IAAIA,EAAM,UAAUK,KAAA,gBAAAA,EAAe,SAChFY,IAA6B;AAAA,QACjC,CAACT,EAAG,GAAG,WAAW,CAAC,GAAG,OAAOQ,KAAY,WAAW,GAAGA,CAAO,OAAOA;AAAA,MACvE;AAEA,aAAIhB,EAAM,UACRiB,EAAMT,EAAG,GAAG,eAAe,CAAC,IAAIR,EAAM,OACtCiB,EAAMT,EAAG,GAAG,iBAAiB,CAAC,IAAIR,EAAM,QAGnCiB;AAAA,IAAA,CACR,GACKC,IAAYJ,EAAS,MAAM;AAC/B,YAAMK,IAAWnB,EAAM,WAAUK,KAAA,gBAAAA,EAAe,WAAU,IACpDe,IAAQpB,EAAM,cAAaK,KAAA,gBAAAA,EAAe;AAEzC,aAAA;AAAA,QACL,wBAAwBc,IAAY,WAAqB;AAAA,QACzD,wBAAwBC;AAAA,MAC1B;AAAA,IAAA,CACD;AAID,QAFaC,EAAA,EAAE,cAAAX,GAAc,SAAAE,GAAS,GAElCP,GAAe;AAoBjB,UAASiB,IAAT,WAAwB;AACtB,8BAAsB,MAAM;AACtB,UAAAjB,KAAA,QAAAA,EAAe,cAAcO,EAAQ,UACjCW,EAAA,SAASX,EAAQ,MAAM;AAAA,QAC/B,CACD;AAAA,MACH;AAzBA,YAAMW,IAAmBC,EAAS;AAAA,QAChC,OAAOd;AAAA,QACP,OAAO;AAAA,QACP,OAAO;AAAA,QACP,QAAQ;AAAA,MAAA,CACT;AAED,MAAAL,EAAc,aAAakB,CAAK,GAE1BE,EAAA,MAAMpB,EAAc,WAAWiB,CAAY,GAC3CG,EAAA,MAAMpB,EAAc,YAAYiB,CAAY,GAElDI,EAAUJ,CAAY,GACtBK,EAAUL,CAAY,GAEtBM,EAAgB,MAAM;AACpB,QAAAvB,EAAc,aAAakB,CAAK;AAAA,MAAA,CACjC;AAAA,IAAA;AAWH,aAASM,IAAoB;AACjB,MAAAC,EAAA9B,EAAM,eAAeU,EAAa,KAAK,GAClCL,KAAA,QAAAA,EAAA,kBAAkBK,EAAa;AAAA,IAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}