@element-plus/nightly 0.0.20221014 → 0.0.20221016

package/es/components/radio/src/radio-button.mjs

@@ -1,69 +1,14 @@
-import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, withDirectives, createElementVNode, isRef, vModelRadio, normalizeStyle, withModifiers, renderSlot, createTextVNode, toDisplayString } from 'vue';
-import '../../../hooks/index.mjs';
-import { useRadio } from './use-radio.mjs';
-import { radioButtonProps } from './radio-button2.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import '../../../utils/index.mjs';
+import { radioPropsBase } from './radio.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const _hoisted_1 = ["value", "name", "disabled"];
-const __default__ = defineComponent({
-  name: "ElRadioButton"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: radioButtonProps,
-  setup(__props) {
-    const props = __props;
-    const ns = useNamespace("radio");
-    const { radioRef, focus, size, disabled, modelValue, radioGroup } = useRadio(props);
-    const activeStyle = computed(() => {
-      return {
-        backgroundColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
-        borderColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
-        boxShadow: (radioGroup == null ? void 0 : radioGroup.fill) ? `-1px 0 0 0 ${radioGroup.fill}` : "",
-        color: (radioGroup == null ? void 0 : radioGroup.textColor) || ""
-      };
-    });
-    return (_ctx, _cache) => {
-      var _a;
-      return openBlock(), createElementBlock("label", {
-        class: normalizeClass([
-          unref(ns).b("button"),
-          unref(ns).is("active", unref(modelValue) === _ctx.label),
-          unref(ns).is("disabled", unref(disabled)),
-          unref(ns).is("focus", unref(focus)),
-          unref(ns).bm("button", unref(size))
-        ])
-      }, [
-        withDirectives(createElementVNode("input", {
-          ref_key: "radioRef",
-          ref: radioRef,
-          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
-          class: normalizeClass(unref(ns).be("button", "original-radio")),
-          value: _ctx.label,
-          type: "radio",
-          name: _ctx.name || ((_a = unref(radioGroup)) == null ? void 0 : _a.name),
-          disabled: unref(disabled),
-          onFocus: _cache[1] || (_cache[1] = ($event) => focus.value = true),
-          onBlur: _cache[2] || (_cache[2] = ($event) => focus.value = false)
-        }, null, 42, _hoisted_1), [
-          [vModelRadio, unref(modelValue)]
-        ]),
-        createElementVNode("span", {
-          class: normalizeClass(unref(ns).be("button", "inner")),
-          style: normalizeStyle(unref(modelValue) === _ctx.label ? unref(activeStyle) : {}),
-          onKeydown: _cache[3] || (_cache[3] = withModifiers(() => {
-          }, ["stop"]))
-        }, [
-          renderSlot(_ctx.$slots, "default", {}, () => [
-            createTextVNode(toDisplayString(_ctx.label), 1)
-          ])
-        ], 38)
-      ], 2);
-    };
+const radioButtonProps = buildProps({
+  ...radioPropsBase,
+  name: {
+    type: String,
+    default: ""
   }
 });
-var RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/radio/src/radio-button.vue"]]);
 
-export { RadioButton as default };
+export { radioButtonProps };
 //# sourceMappingURL=radio-button.mjs.map

package/es/components/radio/src/radio-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.vue"],"sourcesContent":["<template>\n  <label\n    :class=\"[\n      ns.b('button'),\n      ns.is('active', modelValue === label),\n      ns.is('disabled', disabled),\n      ns.is('focus', focus),\n      ns.bm('button', size),\n    ]\"\n  >\n    <input\n      ref=\"radioRef\"\n      v-model=\"modelValue\"\n      :class=\"ns.be('button', 'original-radio')\"\n      :value=\"label\"\n      type=\"radio\"\n      :name=\"name || radioGroup?.name\"\n      :disabled=\"disabled\"\n      @focus=\"focus = true\"\n      @blur=\"focus = false\"\n    />\n    <span\n      :class=\"ns.be('button', 'inner')\"\n      :style=\"modelValue === label ? activeStyle : {}\"\n      @keydown.stop\n    >\n      <slot>\n        {{ label }}\n      </slot>\n    </span>\n  </label>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useRadio } from './use-radio'\nimport { radioButtonProps } from './radio-button'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElRadioButton',\n})\n\nconst props = defineProps(radioButtonProps)\n\nconst ns = useNamespace('radio')\nconst { radioRef, focus, size, disabled, modelValue, radioGroup } =\n  useRadio(props)\n\nconst activeStyle = computed<CSSProperties>(() => {\n  return {\n    backgroundColor: radioGroup?.fill || '',\n    borderColor: radioGroup?.fill || '',\n    boxShadow: radioGroup?.fill ? `-1px 0 0 0 ${radioGroup.fill}` : '',\n    color: radioGroup?.textColor || '',\n  }\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;mCAwCc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAC/B,IAAM,MAAA,EAAE,UAAU,KAAO,EAAA,IAAA,EAAM,UAAU,UAAY,EAAA,UAAA,EAAA,GACnD,SAAS,KAAK,CAAA,CAAA;AAEhB,IAAM,MAAA,WAAA,GAAc,SAAwB,MAAM;AAChD,MAAO,OAAA;AAAA,QACL,eAAA,EAAiB,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACrC,WAAA,EAAa,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACjC,SAAW,EAAA,CAAA,UAAA,IAAmB,IAAA,GAAA,KAAA,CAAA,GAAA,eAAkC,IAAA,CAAA,WAAA,EAAA,UAAA,CAAA,IAAA,CAAA,CAAA,GAAA,EAAA;AAAA,QAChE,KAAA,EAAO,eAAyB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,SAAA,KAAA,EAAA;AAAA,OAClC,CAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"radio-button.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport { radioPropsBase } from './radio'\nimport type { ExtractPropTypes } from 'vue'\nimport type RadioButton from './radio-button.vue'\n\nexport const radioButtonProps = buildProps({\n  ...radioPropsBase,\n  name: {\n    type: String,\n    default: '',\n  },\n} as const)\n\nexport type RadioButtonProps = ExtractPropTypes<typeof radioButtonProps>\nexport type RadioButtonInstance = InstanceType<typeof RadioButton>\n"],"names":[],"mappings":";;;;AAEY,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,GAAG,cAAc;AACnB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC;;;;"}

package/es/components/radio/src/radio-button2.mjs

@@ -1,14 +1,69 @@
-import '../../../utils/index.mjs';
-import { radioPropsBase } from './radio.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, withDirectives, createElementVNode, isRef, vModelRadio, normalizeStyle, withModifiers, renderSlot, createTextVNode, toDisplayString } from 'vue';
+import '../../../hooks/index.mjs';
+import { useRadio } from './use-radio.mjs';
+import { radioButtonProps } from './radio-button.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const radioButtonProps = buildProps({
-  ...radioPropsBase,
-  name: {
-    type: String,
-    default: ""
+const _hoisted_1 = ["value", "name", "disabled"];
+const __default__ = defineComponent({
+  name: "ElRadioButton"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: radioButtonProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const { radioRef, focus, size, disabled, modelValue, radioGroup } = useRadio(props);
+    const activeStyle = computed(() => {
+      return {
+        backgroundColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
+        borderColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
+        boxShadow: (radioGroup == null ? void 0 : radioGroup.fill) ? `-1px 0 0 0 ${radioGroup.fill}` : "",
+        color: (radioGroup == null ? void 0 : radioGroup.textColor) || ""
+      };
+    });
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass([
+          unref(ns).b("button"),
+          unref(ns).is("active", unref(modelValue) === _ctx.label),
+          unref(ns).is("disabled", unref(disabled)),
+          unref(ns).is("focus", unref(focus)),
+          unref(ns).bm("button", unref(size))
+        ])
+      }, [
+        withDirectives(createElementVNode("input", {
+          ref_key: "radioRef",
+          ref: radioRef,
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isRef(modelValue) ? modelValue.value = $event : null),
+          class: normalizeClass(unref(ns).be("button", "original-radio")),
+          value: _ctx.label,
+          type: "radio",
+          name: _ctx.name || ((_a = unref(radioGroup)) == null ? void 0 : _a.name),
+          disabled: unref(disabled),
+          onFocus: _cache[1] || (_cache[1] = ($event) => focus.value = true),
+          onBlur: _cache[2] || (_cache[2] = ($event) => focus.value = false)
+        }, null, 42, _hoisted_1), [
+          [vModelRadio, unref(modelValue)]
+        ]),
+        createElementVNode("span", {
+          class: normalizeClass(unref(ns).be("button", "inner")),
+          style: normalizeStyle(unref(modelValue) === _ctx.label ? unref(activeStyle) : {}),
+          onKeydown: _cache[3] || (_cache[3] = withModifiers(() => {
+          }, ["stop"]))
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(_ctx.label), 1)
+          ])
+        ], 38)
+      ], 2);
+    };
   }
 });
+var RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/radio/src/radio-button.vue"]]);
 
-export { radioButtonProps };
+export { RadioButton as default };
 //# sourceMappingURL=radio-button2.mjs.map

package/es/components/radio/src/radio-button2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button2.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport { radioPropsBase } from './radio'\nimport type { ExtractPropTypes } from 'vue'\nimport type RadioButton from './radio-button.vue'\n\nexport const radioButtonProps = buildProps({\n  ...radioPropsBase,\n  name: {\n    type: String,\n    default: '',\n  },\n} as const)\n\nexport type RadioButtonProps = ExtractPropTypes<typeof radioButtonProps>\nexport type RadioButtonInstance = InstanceType<typeof RadioButton>\n"],"names":[],"mappings":";;;;AAEY,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,GAAG,cAAc;AACnB,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"radio-button2.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.vue"],"sourcesContent":["<template>\n  <label\n    :class=\"[\n      ns.b('button'),\n      ns.is('active', modelValue === label),\n      ns.is('disabled', disabled),\n      ns.is('focus', focus),\n      ns.bm('button', size),\n    ]\"\n  >\n    <input\n      ref=\"radioRef\"\n      v-model=\"modelValue\"\n      :class=\"ns.be('button', 'original-radio')\"\n      :value=\"label\"\n      type=\"radio\"\n      :name=\"name || radioGroup?.name\"\n      :disabled=\"disabled\"\n      @focus=\"focus = true\"\n      @blur=\"focus = false\"\n    />\n    <span\n      :class=\"ns.be('button', 'inner')\"\n      :style=\"modelValue === label ? activeStyle : {}\"\n      @keydown.stop\n    >\n      <slot>\n        {{ label }}\n      </slot>\n    </span>\n  </label>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useRadio } from './use-radio'\nimport { radioButtonProps } from './radio-button'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElRadioButton',\n})\n\nconst props = defineProps(radioButtonProps)\n\nconst ns = useNamespace('radio')\nconst { radioRef, focus, size, disabled, modelValue, radioGroup } =\n  useRadio(props)\n\nconst activeStyle = computed<CSSProperties>(() => {\n  return {\n    backgroundColor: radioGroup?.fill || '',\n    borderColor: radioGroup?.fill || '',\n    boxShadow: radioGroup?.fill ? `-1px 0 0 0 ${radioGroup.fill}` : '',\n    color: radioGroup?.textColor || '',\n  }\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;mCAwCc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAC/B,IAAM,MAAA,EAAE,UAAU,KAAO,EAAA,IAAA,EAAM,UAAU,UAAY,EAAA,UAAA,EAAA,GACnD,SAAS,KAAK,CAAA,CAAA;AAEhB,IAAM,MAAA,WAAA,GAAc,SAAwB,MAAM;AAChD,MAAO,OAAA;AAAA,QACL,eAAA,EAAiB,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACrC,WAAA,EAAa,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACjC,SAAW,EAAA,CAAA,UAAA,IAAmB,IAAA,GAAA,KAAA,CAAA,GAAA,eAAkC,IAAA,CAAA,WAAA,EAAA,UAAA,CAAA,IAAA,CAAA,CAAA,GAAA,EAAA;AAAA,QAChE,KAAA,EAAO,eAAyB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,SAAA,KAAA,EAAA;AAAA,OAClC,CAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/steps/index.mjs

@@ -1,7 +1,7 @@
 import '../../utils/index.mjs';
 import Steps from './src/steps2.mjs';
-import Step from './src/item.mjs';
-export { stepProps } from './src/item2.mjs';
+import Step from './src/item2.mjs';
+export { stepProps } from './src/item.mjs';
 export { stepsEmits, stepsProps } from './src/steps.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';
 

package/es/components/steps/src/item.mjs

@@ -1,196 +1,25 @@
-import { defineComponent, ref, inject, getCurrentInstance, onMounted, watch, onBeforeUnmount, computed, reactive, openBlock, createElementBlock, normalizeStyle, unref, normalizeClass, createCommentVNode, createElementVNode, renderSlot, createBlock, withCtx, resolveDynamicComponent, createVNode, toDisplayString, createTextVNode } from 'vue';
-import '../../../hooks/index.mjs';
-import { ElIcon } from '../../icon/index.mjs';
-import { Check, Close } from '@element-plus/icons-vue';
-import { stepProps } from './item2.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import '../../../utils/index.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { iconPropType } from '../../../utils/vue/icon.mjs';
 
-const __default__ = defineComponent({
-  name: "ElStep"
-});
-const _sfc_main = defineComponent({
-  ...__default__,
-  props: stepProps,
-  setup(__props) {
-    const props = __props;
-    const ns = useNamespace("step");
-    const index = ref(-1);
-    const lineStyle = ref({});
-    const internalStatus = ref("");
-    const parent = inject("ElSteps");
-    const currentInstance = getCurrentInstance();
-    onMounted(() => {
-      watch([
-        () => parent.props.active,
-        () => parent.props.processStatus,
-        () => parent.props.finishStatus
-      ], ([active]) => {
-        updateStatus(active);
-      }, { immediate: true });
-    });
-    onBeforeUnmount(() => {
-      parent.steps.value = parent.steps.value.filter((instance) => instance.uid !== (currentInstance == null ? void 0 : currentInstance.uid));
-    });
-    const currentStatus = computed(() => {
-      return props.status || internalStatus.value;
-    });
-    const prevStatus = computed(() => {
-      const prevStep = parent.steps.value[index.value - 1];
-      return prevStep ? prevStep.currentStatus : "wait";
-    });
-    const isCenter = computed(() => {
-      return parent.props.alignCenter;
-    });
-    const isVertical = computed(() => {
-      return parent.props.direction === "vertical";
-    });
-    const isSimple = computed(() => {
-      return parent.props.simple;
-    });
-    const stepsCount = computed(() => {
-      return parent.steps.value.length;
-    });
-    const isLast = computed(() => {
-      var _a;
-      return ((_a = parent.steps.value[stepsCount.value - 1]) == null ? void 0 : _a.uid) === (currentInstance == null ? void 0 : currentInstance.uid);
-    });
-    const space = computed(() => {
-      return isSimple.value ? "" : parent.props.space;
-    });
-    const style = computed(() => {
-      const style2 = {
-        flexBasis: typeof space.value === "number" ? `${space.value}px` : space.value ? space.value : `${100 / (stepsCount.value - (isCenter.value ? 0 : 1))}%`
-      };
-      if (isVertical.value)
-        return style2;
-      if (isLast.value) {
-        style2.maxWidth = `${100 / stepsCount.value}%`;
-      }
-      return style2;
-    });
-    const setIndex = (val) => {
-      index.value = val;
-    };
-    const calcProgress = (status) => {
-      let step = 100;
-      const style2 = {};
-      style2.transitionDelay = `${150 * index.value}ms`;
-      if (status === parent.props.processStatus) {
-        step = 0;
-      } else if (status === "wait") {
-        step = 0;
-        style2.transitionDelay = `${-150 * index.value}ms`;
-      }
-      style2.borderWidth = step && !isSimple.value ? "1px" : 0;
-      style2[parent.props.direction === "vertical" ? "height" : "width"] = `${step}%`;
-      lineStyle.value = style2;
-    };
-    const updateStatus = (activeIndex) => {
-      if (activeIndex > index.value) {
-        internalStatus.value = parent.props.finishStatus;
-      } else if (activeIndex === index.value && prevStatus.value !== "error") {
-        internalStatus.value = parent.props.processStatus;
-      } else {
-        internalStatus.value = "wait";
-      }
-      const prevChild = parent.steps.value[index.value - 1];
-      if (prevChild)
-        prevChild.calcProgress(internalStatus.value);
-    };
-    const stepItemState = reactive({
-      uid: computed(() => currentInstance == null ? void 0 : currentInstance.uid),
-      currentStatus,
-      setIndex,
-      calcProgress
-    });
-    parent.steps.value = [...parent.steps.value, stepItemState];
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        style: normalizeStyle(unref(style)),
-        class: normalizeClass([
-          unref(ns).b(),
-          unref(ns).is(unref(isSimple) ? "simple" : unref(parent).props.direction),
-          unref(ns).is("flex", unref(isLast) && !unref(space) && !unref(isCenter)),
-          unref(ns).is("center", unref(isCenter) && !unref(isVertical) && !unref(isSimple))
-        ])
-      }, [
-        createCommentVNode(" icon & line "),
-        createElementVNode("div", {
-          class: normalizeClass([unref(ns).e("head"), unref(ns).is(unref(currentStatus))])
-        }, [
-          !unref(isSimple) ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            class: normalizeClass(unref(ns).e("line"))
-          }, [
-            createElementVNode("i", {
-              class: normalizeClass(unref(ns).e("line-inner")),
-              style: normalizeStyle(lineStyle.value)
-            }, null, 6)
-          ], 2)) : createCommentVNode("v-if", true),
-          createElementVNode("div", {
-            class: normalizeClass([unref(ns).e("icon"), unref(ns).is(_ctx.icon || _ctx.$slots.icon ? "icon" : "text")])
-          }, [
-            renderSlot(_ctx.$slots, "icon", {}, () => [
-              _ctx.icon ? (openBlock(), createBlock(unref(ElIcon), {
-                key: 0,
-                class: normalizeClass(unref(ns).e("icon-inner"))
-              }, {
-                default: withCtx(() => [
-                  (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon)))
-                ]),
-                _: 1
-              }, 8, ["class"])) : unref(currentStatus) === "success" ? (openBlock(), createBlock(unref(ElIcon), {
-                key: 1,
-                class: normalizeClass([unref(ns).e("icon-inner"), unref(ns).is("status")])
-              }, {
-                default: withCtx(() => [
-                  createVNode(unref(Check))
-                ]),
-                _: 1
-              }, 8, ["class"])) : unref(currentStatus) === "error" ? (openBlock(), createBlock(unref(ElIcon), {
-                key: 2,
-                class: normalizeClass([unref(ns).e("icon-inner"), unref(ns).is("status")])
-              }, {
-                default: withCtx(() => [
-                  createVNode(unref(Close))
-                ]),
-                _: 1
-              }, 8, ["class"])) : !unref(isSimple) ? (openBlock(), createElementBlock("div", {
-                key: 3,
-                class: normalizeClass(unref(ns).e("icon-inner"))
-              }, toDisplayString(index.value + 1), 3)) : createCommentVNode("v-if", true)
-            ])
-          ], 2)
-        ], 2),
-        createCommentVNode(" title & description "),
-        createElementVNode("div", {
-          class: normalizeClass(unref(ns).e("main"))
-        }, [
-          createElementVNode("div", {
-            class: normalizeClass([unref(ns).e("title"), unref(ns).is(unref(currentStatus))])
-          }, [
-            renderSlot(_ctx.$slots, "title", {}, () => [
-              createTextVNode(toDisplayString(_ctx.title), 1)
-            ])
-          ], 2),
-          unref(isSimple) ? (openBlock(), createElementBlock("div", {
-            key: 0,
-            class: normalizeClass(unref(ns).e("arrow"))
-          }, null, 2)) : (openBlock(), createElementBlock("div", {
-            key: 1,
-            class: normalizeClass([unref(ns).e("description"), unref(ns).is(unref(currentStatus))])
-          }, [
-            renderSlot(_ctx.$slots, "description", {}, () => [
-              createTextVNode(toDisplayString(_ctx.description), 1)
-            ])
-          ], 2))
-        ], 2)
-      ], 6);
-    };
+const stepProps = buildProps({
+  title: {
+    type: String,
+    default: ""
+  },
+  icon: {
+    type: iconPropType
+  },
+  description: {
+    type: String,
+    default: ""
+  },
+  status: {
+    type: String,
+    values: ["", "wait", "process", "finish", "error", "success"],
+    default: ""
   }
 });
-var Step = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/home/runner/work/element-plus/element-plus/packages/components/steps/src/item.vue"]]);
 
-export { Step as default };
+export { stepProps };
 //# sourceMappingURL=item.mjs.map

package/es/components/steps/src/item.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"item.mjs","sources":["../../../../../../packages/components/steps/src/item.vue"],"sourcesContent":["<template>\n  <div\n    :style=\"style\"\n    :class=\"[\n      ns.b(),\n      ns.is(isSimple ? 'simple' : parent.props.direction),\n      ns.is('flex', isLast && !space && !isCenter),\n      ns.is('center', isCenter && !isVertical && !isSimple),\n    ]\"\n  >\n    <!-- icon & line -->\n    <div :class=\"[ns.e('head'), ns.is(currentStatus)]\">\n      <div v-if=\"!isSimple\" :class=\"ns.e('line')\">\n        <i :class=\"ns.e('line-inner')\" :style=\"lineStyle\" />\n      </div>\n\n      <div\n        :class=\"[ns.e('icon'), ns.is(icon || $slots.icon ? 'icon' : 'text')]\"\n      >\n        <slot name=\"icon\">\n          <el-icon v-if=\"icon\" :class=\"ns.e('icon-inner')\">\n            <component :is=\"icon\" />\n          </el-icon>\n          <el-icon\n            v-else-if=\"currentStatus === 'success'\"\n            :class=\"[ns.e('icon-inner'), ns.is('status')]\"\n          >\n            <Check />\n          </el-icon>\n          <el-icon\n            v-else-if=\"currentStatus === 'error'\"\n            :class=\"[ns.e('icon-inner'), ns.is('status')]\"\n          >\n            <Close />\n          </el-icon>\n          <div v-else-if=\"!isSimple\" :class=\"ns.e('icon-inner')\">\n            {{ index + 1 }}\n          </div>\n        </slot>\n      </div>\n    </div>\n    <!-- title & description -->\n    <div :class=\"ns.e('main')\">\n      <div :class=\"[ns.e('title'), ns.is(currentStatus)]\">\n        <slot name=\"title\">{{ title }}</slot>\n      </div>\n      <div v-if=\"isSimple\" :class=\"ns.e('arrow')\" />\n      <div v-else :class=\"[ns.e('description'), ns.is(currentStatus)]\">\n        <slot name=\"description\">{{ description }}</slot>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  getCurrentInstance,\n  inject,\n  onBeforeUnmount,\n  onMounted,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { ElIcon } from '@element-plus/components/icon'\nimport { Check, Close } from '@element-plus/icons-vue'\nimport { stepProps } from './item'\n\nimport type { CSSProperties, Ref } from 'vue'\n\nexport interface IStepsProps {\n  space: number | string\n  active: number\n  direction: string\n  alignCenter: boolean\n  simple: boolean\n  finishStatus: string\n  processStatus: string\n}\n\nexport interface StepItemState {\n  uid: number | undefined\n  currentStatus: string\n  setIndex: (val: number) => void\n  calcProgress: (status: string) => void\n}\n\nexport interface IStepsInject {\n  props: IStepsProps\n  steps: Ref<StepItemState[]>\n}\n\ndefineOptions({\n  name: 'ElStep',\n})\n\nconst props = defineProps(stepProps)\nconst ns = useNamespace('step')\nconst index = ref(-1)\nconst lineStyle = ref({})\nconst internalStatus = ref('')\nconst parent = inject('ElSteps') as IStepsInject\nconst currentInstance = getCurrentInstance()\n\nonMounted(() => {\n  watch(\n    [\n      () => parent.props.active,\n      () => parent.props.processStatus,\n      () => parent.props.finishStatus,\n    ],\n    ([active]) => {\n      updateStatus(active)\n    },\n    { immediate: true }\n  )\n})\n\nonBeforeUnmount(() => {\n  parent.steps.value = parent.steps.value.filter(\n    (instance) => instance.uid !== currentInstance?.uid\n  )\n})\n\nconst currentStatus = computed(() => {\n  return props.status || internalStatus.value\n})\n\nconst prevStatus = computed(() => {\n  const prevStep = parent.steps.value[index.value - 1]\n  return prevStep ? prevStep.currentStatus : 'wait'\n})\n\nconst isCenter = computed(() => {\n  return parent.props.alignCenter\n})\n\nconst isVertical = computed(() => {\n  return parent.props.direction === 'vertical'\n})\n\nconst isSimple = computed(() => {\n  return parent.props.simple\n})\n\nconst stepsCount = computed(() => {\n  return parent.steps.value.length\n})\n\nconst isLast = computed(() => {\n  return parent.steps.value[stepsCount.value - 1]?.uid === currentInstance?.uid\n})\n\nconst space = computed(() => {\n  return isSimple.value ? '' : parent.props.space\n})\n\nconst style = computed(() => {\n  const style: CSSProperties = {\n    flexBasis:\n      typeof space.value === 'number'\n        ? `${space.value}px`\n        : space.value\n        ? space.value\n        : `${100 / (stepsCount.value - (isCenter.value ? 0 : 1))}%`,\n  }\n  if (isVertical.value) return style\n  if (isLast.value) {\n    style.maxWidth = `${100 / stepsCount.value}%`\n  }\n  return style\n})\n\nconst setIndex = (val: number) => {\n  index.value = val\n}\n\nconst calcProgress = (status: string) => {\n  let step = 100\n  const style: CSSProperties = {}\n  style.transitionDelay = `${150 * index.value}ms`\n  if (status === parent.props.processStatus) {\n    step = 0\n  } else if (status === 'wait') {\n    step = 0\n    style.transitionDelay = `${-150 * index.value}ms`\n  }\n  style.borderWidth = step && !isSimple.value ? '1px' : 0\n  style[parent.props.direction === 'vertical' ? 'height' : 'width'] = `${step}%`\n  lineStyle.value = style\n}\n\nconst updateStatus = (activeIndex: number) => {\n  if (activeIndex > index.value) {\n    internalStatus.value = parent.props.finishStatus\n  } else if (activeIndex === index.value && prevStatus.value !== 'error') {\n    internalStatus.value = parent.props.processStatus\n  } else {\n    internalStatus.value = 'wait'\n  }\n  const prevChild = parent.steps.value[index.value - 1]\n  if (prevChild) prevChild.calcProgress(internalStatus.value)\n}\n\nconst stepItemState = reactive({\n  uid: computed(() => currentInstance?.uid),\n  currentStatus,\n  setIndex,\n  calcProgress,\n})\n\nparent.steps.value = [...parent.steps.value, stepItemState]\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"item.mjs","sources":["../../../../../../packages/components/steps/src/item.ts"],"sourcesContent":["import { buildProps, iconPropType } from '@element-plus/utils'\nimport type Step from './item.vue'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const stepProps = buildProps({\n  title: {\n    type: String,\n    default: '',\n  },\n  icon: {\n    type: iconPropType,\n  },\n  description: {\n    type: String,\n    default: '',\n  },\n  status: {\n    type: String,\n    values: ['', 'wait', 'process', 'finish', 'error', 'success'],\n    default: '',\n  },\n} as const)\n\nexport type StepProps = ExtractPropTypes<typeof stepProps>\n\nexport type StepInstance = InstanceType<typeof Step>\n"],"names":[],"mappings":";;;;AACY,MAAC,SAAS,GAAG,UAAU,CAAC;AACpC,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,YAAY;AACtB,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,SAAS,EAAE,QAAQ,EAAE,OAAO,EAAE,SAAS,CAAC;AACjE,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC;;;;"}