@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\">\r\nimport { computed, inject, onBeforeUnmount, onMounted, onUpdated, reactive, ref, watch } from 'vue'\r\n\r\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\r\nimport { timelineItemProps } from './props'\r\nimport { TIMELINE_STATE, timelineItemTypes } from './symbol'\r\n\r\nimport type { ItemState } from './symbol'\r\n\r\ndefineOptions({ name: 'TimelineItem' })\r\n\r\nconst _props = defineProps(timelineItemProps)\r\nconst props = useProps('timelineItem', _props, {\r\n  type: {\r\n    default: 'primary',\r\n    validator: value => timelineItemTypes.includes(value),\r\n  },\r\n  color: '',\r\n  label: {\r\n    default: null,\r\n    static: true,\r\n  },\r\n  dashed: null,\r\n  lineColor: null,\r\n  spacing: null,\r\n})\r\n\r\ndefineSlots<{\r\n  default: () => any,\r\n  signal: () => any,\r\n  line: () => any,\r\n}>()\r\n\r\nconst timelineState = inject(TIMELINE_STATE, null)\r\n\r\nconst nh = useNameHelper('timeline')\r\nconst currentLabel = ref(props.label)\r\nconst content = ref<HTMLElement>()\r\n\r\nconst className = computed(() => {\r\n  return {\r\n    [nh.be('item')]: true,\r\n    [nh.bem('item', props.type)]: timelineItemTypes.includes(props.type),\r\n  }\r\n})\r\nconst itemStyle = computed(() => {\r\n  const spacing = props.spacing || props.spacing === 0 ? props.spacing : timelineState?.spacing\r\n  const style: Record<string, any> = {\r\n    [nh.cv('item-span')]: typeof spacing === 'number' ? `${spacing}px` : spacing,\r\n  }\r\n\r\n  if (props.color) {\r\n    style[nh.cv('pointer-color')] = props.color\r\n    style[nh.cv('pointer-b-color')] = props.color\r\n  }\r\n\r\n  return style\r\n})\r\nconst lineStyle = computed(() => {\r\n  const isDashed = props.dashed ?? timelineState?.dashed ?? false\r\n  const color = props.lineColor ?? timelineState?.lineColor\r\n\r\n  return {\r\n    borderInlineStartStyle: isDashed ? ('dashed' as const) : undefined,\r\n    borderInlineStartColor: color,\r\n  }\r\n})\r\n\r\ndefineExpose({ currentLabel, content })\r\n\r\nif (timelineState) {\r\n  const state: ItemState = reactive({\r\n    label: currentLabel,\r\n    index: 0,\r\n    total: 0,\r\n    height: 0,\r\n  })\r\n\r\n  timelineState.increaseItem(state)\r\n\r\n  watch(() => timelineState.alternate, updateHeight)\r\n  watch(() => timelineState.horizontal, updateHeight)\r\n\r\n  onMounted(updateHeight)\r\n  onUpdated(updateHeight)\r\n\r\n  onBeforeUnmount(() => {\r\n    timelineState.decreaseItem(state)\r\n  })\r\n\r\n  function updateHeight() {\r\n    requestAnimationFrame(() => {\r\n      if (timelineState?.horizontal && content.value) {\r\n        state.height = content.value.scrollHeight\r\n      }\r\n    })\r\n  }\r\n}\r\n\r\nfunction handleSignalClick() {\r\n  emitEvent(props.onSignalClick, currentLabel.value)\r\n  timelineState?.handleSignalClick(currentLabel.value)\r\n}\r\n</script>\r\n\r\n<template>\r\n  <div :class=\"className\" :style=\"itemStyle\">\r\n    <div :class=\"nh.be('signal')\" @click=\"handleSignalClick\">\r\n      <slot name=\"signal\">\r\n        <div :class=\"nh.be('pointer')\"></div>\r\n      </slot>\r\n    </div>\r\n    <div :class=\"nh.be('line')\" :style=\"lineStyle\">\r\n      <slot name=\"line\"></slot>\r\n    </div>\r\n    <div ref=\"content\" :class=\"nh.be('content')\">\r\n      <slot></slot>\r\n    </div>\r\n  </div>\r\n</template>\r\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","_createElementBlock","_createElementVNode","_normalizeClass","_unref","_renderSlot","_ctx"],"mappings":"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"}