{"version":3,"file":"step.vue2.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":[],"mappings":"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"}