{"version":3,"file":"step.vue.mjs","sources":["../../../../../../packages/components/steps/src/step.vue"],"sourcesContent":["<script lang=\"ts\">\n  import {\n    computed,\n    defineComponent,\n    inject,\n    getCurrentInstance,\n    ref,\n    reactive,\n    onBeforeMount\n  } from 'vue'\n  import { getComponentNamespace, getNamespace } from '../../../utils/global-config'\n  import { useIndex } from '../../../hooks/use-index'\n  import { BnIconCheck } from '../../icon'\n  import { stepProps } from './props'\n  import type { StepsContext } from './context'\n  import { stepsInjectionKey } from './context'\n\n  export default defineComponent({\n    name: getComponentNamespace('Step'),\n    components: { BnIconCheck },\n    props: stepProps,\n    emits: ['close'],\n    setup(props, { slots }) {\n      // 定义组件命名\n      const ns = getNamespace('steps-item')\n      // 获取父级组件provide数据\n      const context = inject(stepsInjectionKey, {} as StepsContext)\n      const { stepsType, parentCls, addItem, removeItem, onClick } = context\n      // 获取组件内部实例\n      const instance = getCurrentInstance()\n      // Ref\n      const itemRef = ref<HTMLElement>()\n      // 点颜色\n      const innerDotColor = ref(props.dotColor)\n      // 内部Index\n      const { innerIndex } = useIndex({\n        itemRef,\n        selector: `.${ns}`,\n        parentClassName: parentCls\n      })\n      // 当前step步数\n      const stepNumber = computed(() => innerIndex.value + 1)\n      // 是否为最后一个\n      const isLast = computed((): boolean => {\n        const { count } = context as StepsContext\n        return innerIndex.value + 1 === count\n      })\n      // 组件class\n      const cls = computed(() => [\n        ns\n        // stepsType && `is-${stepsType}`,\n        // context.innerCurrent === stepNumber.value ? 'is-active' : ''\n      ])\n      const stepStatusCls = computed(() => [`is-${stepStatus.value.toLocaleLowerCase()}`])\n      // PREV NEXT\n      const stepStatus = computed(() => {\n        if (context.innerCurrent > stepNumber.value) {\n          return 'COMPLETE'\n        } else if (context.innerCurrent === stepNumber.value) {\n          return 'ACTIVE'\n        } else {\n          return 'WAITING'\n        }\n      })\n      if (instance) {\n        addItem(\n          instance.uid,\n          reactive({\n            step: stepNumber\n          })\n        )\n      }\n      /**\n       * @description 注册一个钩子，在组件被挂载之前被调用。\n       */\n      onBeforeMount(() => {\n        removeItem(instance?.uid as number)\n      })\n      /**\n       * @description step点击切换\n       * @param e\n       */\n      const handleClick = (e: Event) => {\n        if (!props.disabled) {\n          onClick(stepNumber.value, e)\n        }\n      }\n      // lineType\n      const lineType = computed(() => [\n        {\n          borderBottomStyle: context?.lineType\n        }\n      ])\n      // slotsIcon\n      const iconCls = computed(() =>\n        slots?.icon?.() ? [`${ns}__icon`, ...stepStatusCls.value] : [`${ns}__icon`]\n      )\n      return {\n        ns,\n        cls,\n        stepsType,\n        itemRef,\n        stepNumber,\n        handleClick,\n        isLast,\n        lineType,\n        iconCls,\n        innerDotColor,\n        stepStatus,\n        stepStatusCls\n      }\n    }\n  })\n</script>\n\n<template>\n  <div ref=\"itemRef\" :class=\"cls\" @click=\"handleClick\">\n    <div v-if=\"stepsType === 'icon' && !icon\" :class=\"`${ns}__node`\">\n      <div :class=\"iconCls\">\n        <slot name=\"icon\">\n          <i class=\"icon\" :style=\"[{ backgroundColor: innerDotColor }]\"></i>\n        </slot>\n      </div>\n    </div>\n    <div v-if=\"stepsType === 'icon'\" :class=\"`${ns}__dot`\">\n      <div class=\"dot\" :class=\"stepStatusCls\"></div>\n      <div v-if=\"!isLast\" :class=\"`${ns}__dot__line`\" :style=\"lineType\"></div>\n    </div>\n    <div v-else :class=\"`${ns}__serial-number`\">\n      <div class=\"step-mark\" :class=\"stepStatusCls\">\n        <div v-if=\"stepStatus === 'COMPLETE'\" class=\"diy-icon\">\n          <slot name=\"complete-icon\">\n            <BnIconCheck></BnIconCheck>\n          </slot>\n        </div>\n        <div v-else class=\"number\">{{ stepNumber }}</div>\n      </div>\n      <div v-if=\"!isLast\" :class=\"`${ns}__serial-number__line`\" :style=\"lineType\"></div>\n    </div>\n    <div :class=\"[`${ns}__content`, ...stepStatusCls]\">\n      <div :class=\"`${ns}__title`\">\n        <slot>{{ title }}</slot>\n      </div>\n      <div v-if=\"description\" :class=\"[`${ns}__description`]\">\n        <slot name=\"description\">{{ description }}</slot>\n      </div>\n    </div>\n  </div>\n</template>\n./context\n"],"names":["_resolveComponent","_openBlock","_createElementBlock","_normalizeClass","stepsType","icon","_createElementVNode","_createCommentVNode","isLast","stepStatus","_renderSlot","_toDisplayString","description","ns"],"mappings":"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"}