feat: initial commit - Phase 1 & 2 core features

This commit is contained in:
hiderfong
2026-04-22 17:07:33 +08:00
commit 1773bda06b
25005 changed files with 6252106 additions and 0 deletions
+15
View File
@@ -0,0 +1,15 @@
import { SFCWithInstall } from "../../utils/vue/typescript.js";
import "../../utils/index.js";
import { StepsEmits, StepsInstance, StepsProps, StepsPropsPublic, StepsStatus, stepsEmits, stepsProps } from "./src/steps.js";
import { _default } from "./src/steps.vue.js";
import { StepInstance, StepProps, StepPropsPublic, stepProps } from "./src/item.js";
import { _default as _default$1 } from "./src/item.vue.js";
import { STEPS_INJECTION_KEY } from "./src/tokens.js";
//#region ../../packages/components/steps/index.d.ts
declare const ElSteps: SFCWithInstall<typeof _default> & {
Step: typeof _default$1;
};
declare const ElStep: SFCWithInstall<typeof _default$1>;
//#endregion
export { ElStep, ElSteps, ElSteps as default, STEPS_INJECTION_KEY, StepInstance, StepProps, StepPropsPublic, StepsEmits, StepsInstance, StepsProps, StepsPropsPublic, StepsStatus, stepProps, stepsEmits, stepsProps };
+21
View File
@@ -0,0 +1,21 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_install = require('../../utils/vue/install.js');
const require_steps = require('./src/steps.js');
const require_tokens = require('./src/tokens.js');
const require_steps$1 = require('./src/steps2.js');
const require_item = require('./src/item.js');
const require_item$1 = require('./src/item2.js');
//#region ../../packages/components/steps/index.ts
const ElSteps = require_install.withInstall(require_steps$1.default, { Step: require_item$1.default });
const ElStep = require_install.withNoopInstall(require_item$1.default);
//#endregion
exports.ElStep = ElStep;
exports.ElSteps = ElSteps;
exports.default = ElSteps;
exports.STEPS_INJECTION_KEY = require_tokens.STEPS_INJECTION_KEY;
exports.stepProps = require_item.stepProps;
exports.stepsEmits = require_steps.stepsEmits;
exports.stepsProps = require_steps.stepsProps;
//# sourceMappingURL=index.js.map
+1
View File
@@ -0,0 +1 @@
{"version":3,"file":"index.js","names":["withInstall","Steps","withNoopInstall","Step"],"sources":["../../../../../packages/components/steps/index.ts"],"sourcesContent":["import { withInstall, withNoopInstall } from '@element-plus/utils'\nimport Steps from './src/steps.vue'\nimport Step from './src/item.vue'\n\nimport type { SFCWithInstall } from '@element-plus/utils'\n\nexport const ElSteps: SFCWithInstall<typeof Steps> & {\n Step: typeof Step\n} = withInstall(Steps, {\n Step,\n})\nexport default ElSteps\nexport const ElStep: SFCWithInstall<typeof Step> = withNoopInstall(Step)\n\nexport * from './src/item'\nexport * from './src/steps'\nexport * from './src/tokens'\n"],"mappings":";;;;;;;;;AAMA,MAAa,UAETA,4BAAYC,yBAAO,EACrB,8BACD,CAAC;AAEF,MAAa,SAAsCC,gCAAgBC,uBAAK"}
+49
View File
@@ -0,0 +1,49 @@
import { IconPropType } from "../../../utils/vue/icon.js";
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { _default } from "./item.vue.js";
import * as vue from "vue";
import { ExtractPublicPropTypes } from "vue";
//#region ../../packages/components/steps/src/item.d.ts
interface StepProps {
/**
* @description step title
*/
title?: string;
/**
* @description step custom icon. Icons can be passed via named slot as well
*/
icon?: IconPropType;
/**
* @description step description
* @default ''
*/
description?: string;
/**
* @description current status. It will be automatically set by Steps if not configured.
* @default ''
*/
status?: '' | 'wait' | 'process' | 'finish' | 'error' | 'success';
}
/**
* @deprecated Removed after 3.0.0, Use `StepProps` instead.
*/
declare const stepProps: {
readonly title: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly icon: {
readonly type: vue.PropType<EpPropMergeType<(new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component) | (((new (...args: any[]) => (string | vue.Component) & {}) | (() => string | vue.Component)) | null)[], unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly description: EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
readonly status: EpPropFinalized<StringConstructor, "" | "error" | "success" | "wait" | "finish" | "process", unknown, "", boolean>;
};
/**
* @deprecated Removed after 3.0.0, Use `StepProps` instead.
*/
type StepPropsPublic = ExtractPublicPropTypes<typeof stepProps>;
type StepInstance = InstanceType<typeof _default> & unknown;
//#endregion
export { StepInstance, StepProps, StepPropsPublic, stepProps };
+35
View File
@@ -0,0 +1,35 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_runtime = require('../../../utils/vue/props/runtime.js');
const require_icon = require('../../../utils/vue/icon.js');
//#region ../../packages/components/steps/src/item.ts
/**
* @deprecated Removed after 3.0.0, Use `StepProps` instead.
*/
const stepProps = require_runtime.buildProps({
title: {
type: String,
default: ""
},
icon: { type: require_icon.iconPropType },
description: {
type: String,
default: ""
},
status: {
type: String,
values: [
"",
"wait",
"process",
"finish",
"error",
"success"
],
default: ""
}
});
//#endregion
exports.stepProps = stepProps;
//# sourceMappingURL=item.js.map
@@ -0,0 +1 @@
{"version":3,"file":"item.js","names":["buildProps","iconPropType"],"sources":["../../../../../../packages/components/steps/src/item.ts"],"sourcesContent":["import { buildProps, iconPropType } from '@element-plus/utils'\n\nimport type { ExtractPublicPropTypes } from 'vue'\nimport type { IconPropType } from '@element-plus/utils'\nimport type Step from './item.vue'\n\nexport interface StepProps {\n /**\n * @description step title\n */\n title?: string\n /**\n * @description step custom icon. Icons can be passed via named slot as well\n */\n icon?: IconPropType\n /**\n * @description step description\n * @default ''\n */\n description?: string\n /**\n * @description current status. It will be automatically set by Steps if not configured.\n * @default ''\n */\n status?: '' | 'wait' | 'process' | 'finish' | 'error' | 'success'\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `StepProps` instead.\n */\nexport const stepProps = buildProps({\n /**\n * @description step title\n */\n title: {\n type: String,\n default: '',\n },\n /**\n * @description step custom icon. Icons can be passed via named slot as well\n */\n icon: {\n type: iconPropType,\n },\n /**\n * @description step description\n */\n description: {\n type: String,\n default: '',\n },\n /**\n * @description current status. It will be automatically set by Steps if not configured.\n */\n status: {\n type: String,\n values: ['', 'wait', 'process', 'finish', 'error', 'success'],\n default: '',\n },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `StepProps` instead.\n */\nexport type StepPropsPublic = ExtractPublicPropTypes<typeof stepProps>\n\nexport type StepInstance = InstanceType<typeof Step> & unknown\n"],"mappings":";;;;;;;;AA8BA,MAAa,YAAYA,2BAAW;CAIlC,OAAO;EACL,MAAM;EACN,SAAS;EACV;CAID,MAAM,EACJ,MAAMC,2BACP;CAID,aAAa;EACX,MAAM;EACN,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,QAAQ;GAAC;GAAI;GAAQ;GAAW;GAAU;GAAS;GAAU;EAC7D,SAAS;EACV;CACF,CAAU"}
@@ -0,0 +1,31 @@
import { IconPropType } from "../../../utils/vue/icon.js";
import "../../../utils/index.js";
import "./steps.js";
import { StepProps } from "./item.js";
import * as vue from "vue";
import { ComputedRef, Ref, VNode } from "vue";
//#region ../../packages/components/steps/src/item.vue.d.ts
declare var __VLS_1: {}, __VLS_36: {}, __VLS_38: {};
type __VLS_Slots = {} & {
icon?: (props: typeof __VLS_1) => any;
} & {
title?: (props: typeof __VLS_36) => any;
} & {
description?: (props: typeof __VLS_38) => any;
};
declare const __VLS_base: vue.DefineComponent<StepProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.PublicProps, Readonly<StepProps> & Readonly<{}>, {
title: string;
description: string;
icon: IconPropType;
status: "" | "wait" | "process" | "finish" | "error" | "success";
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };
@@ -0,0 +1,154 @@
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_types = require('../../../utils/types.js');
const require_index = require('../../../hooks/use-namespace/index.js');
const require_index$1 = require('../../icon/index.js');
const require_tokens = require('./tokens.js');
const require_item = require('./item.js');
let _element_plus_icons_vue = require("@element-plus/icons-vue");
let vue = require("vue");
//#region ../../packages/components/steps/src/item.vue?vue&type=script&setup=true&lang.ts
var item_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElStep",
__name: "item",
props: require_item.stepProps,
setup(__props) {
const props = __props;
const ns = require_index.useNamespace("step");
const index = (0, vue.ref)(-1);
const lineStyle = (0, vue.ref)({});
const internalStatus = (0, vue.ref)("");
const parent = (0, vue.inject)(require_tokens.STEPS_INJECTION_KEY);
const currentInstance = (0, vue.getCurrentInstance)();
let stepDiff = 0;
let beforeActive = 0;
(0, vue.onMounted)(() => {
(0, vue.watch)([
() => parent.props.active,
() => parent.props.processStatus,
() => parent.props.finishStatus
], ([active], [oldActive]) => {
beforeActive = oldActive || 0;
stepDiff = active - beforeActive;
updateStatus(active);
}, { immediate: true });
});
const currentStatus = (0, vue.computed)(() => {
return props.status || internalStatus.value;
});
const prevInternalStatus = (0, vue.computed)(() => {
const prevStep = parent.steps.value[index.value - 1];
return prevStep ? prevStep.internalStatus.value : "wait";
});
const isCenter = (0, vue.computed)(() => {
return parent.props.alignCenter;
});
const isVertical = (0, vue.computed)(() => {
return parent.props.direction === "vertical";
});
const isSimple = (0, vue.computed)(() => {
return parent.props.simple;
});
const stepsCount = (0, vue.computed)(() => {
return parent.steps.value.length;
});
const isLast = (0, vue.computed)(() => {
return parent.steps.value[stepsCount.value - 1]?.uid === currentInstance.uid;
});
const space = (0, vue.computed)(() => {
return isSimple.value ? "" : parent.props.space;
});
const containerKls = (0, vue.computed)(() => {
return [
ns.b(),
ns.is(isSimple.value ? "simple" : parent.props.direction),
ns.is("flex", isLast.value && !space.value && !isCenter.value),
ns.is("center", isCenter.value && !isVertical.value && !isSimple.value)
];
});
const style = (0, vue.computed)(() => {
const style = { flexBasis: require_types.isNumber(space.value) ? `${space.value}px` : space.value ? space.value : `${100 / (stepsCount.value - (isCenter.value ? 0 : 1))}%` };
if (isVertical.value) return style;
if (isLast.value) style.maxWidth = `${100 / stepsCount.value}%`;
return style;
});
const setIndex = (val) => {
index.value = val;
};
const calcProgress = (status) => {
const isWait = status === "wait";
const style = { transitionDelay: `${Math.abs(stepDiff) === 1 ? 0 : stepDiff > 0 ? (index.value + 1 - beforeActive) * 150 : -(index.value + 1 - parent.props.active) * 150}ms` };
const step = status === parent.props.processStatus || isWait ? 0 : 100;
style.borderWidth = step && !isSimple.value ? "1px" : 0;
style[parent.props.direction === "vertical" ? "height" : "width"] = `${step}%`;
lineStyle.value = style;
};
const updateStatus = (activeIndex) => {
if (activeIndex > index.value) internalStatus.value = parent.props.finishStatus;
else if (activeIndex === index.value && prevInternalStatus.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 = {
uid: currentInstance.uid,
getVnode: () => currentInstance.vnode,
currentStatus,
internalStatus,
setIndex,
calcProgress
};
parent.addStep(stepItemState);
(0, vue.onBeforeUnmount)(() => {
parent.removeStep(stepItemState);
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
style: (0, vue.normalizeStyle)(style.value),
class: (0, vue.normalizeClass)(containerKls.value)
}, [
(0, vue.createCommentVNode)(" icon & line "),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("head"), (0, vue.unref)(ns).is(currentStatus.value)]) }, [!isSimple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("line"))
}, [(0, vue.createElementVNode)("i", {
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("line-inner")),
style: (0, vue.normalizeStyle)(lineStyle.value)
}, null, 6)], 2)) : (0, vue.createCommentVNode)("v-if", true), (0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon"), (0, vue.unref)(ns).is(__props.icon || _ctx.$slots.icon ? "icon" : "text")]) }, [(0, vue.renderSlot)(_ctx.$slots, "icon", {}, () => [__props.icon ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_index$1.ElIcon), {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon-inner"))
}, {
default: (0, vue.withCtx)(() => [((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.resolveDynamicComponent)(__props.icon)))]),
_: 1
}, 8, ["class"])) : currentStatus.value === "success" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_index$1.ElIcon), {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon-inner"), (0, vue.unref)(ns).is("status")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_element_plus_icons_vue.Check))]),
_: 1
}, 8, ["class"])) : currentStatus.value === "error" ? ((0, vue.openBlock)(), (0, vue.createBlock)((0, vue.unref)(require_index$1.ElIcon), {
key: 2,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("icon-inner"), (0, vue.unref)(ns).is("status")])
}, {
default: (0, vue.withCtx)(() => [(0, vue.createVNode)((0, vue.unref)(_element_plus_icons_vue.Close))]),
_: 1
}, 8, ["class"])) : !isSimple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 3,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("icon-inner"))
}, (0, vue.toDisplayString)(index.value + 1), 3)) : (0, vue.createCommentVNode)("v-if", true)])], 2)], 2),
(0, vue.createCommentVNode)(" title & description "),
(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("main")) }, [(0, vue.createElementVNode)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("title"), (0, vue.unref)(ns).is(currentStatus.value)]) }, [(0, vue.renderSlot)(_ctx.$slots, "title", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.title), 1)])], 2), isSimple.value ? ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 0,
class: (0, vue.normalizeClass)((0, vue.unref)(ns).e("arrow"))
}, null, 2)) : ((0, vue.openBlock)(), (0, vue.createElementBlock)("div", {
key: 1,
class: (0, vue.normalizeClass)([(0, vue.unref)(ns).e("description"), (0, vue.unref)(ns).is(currentStatus.value)])
}, [(0, vue.renderSlot)(_ctx.$slots, "description", {}, () => [(0, vue.createTextVNode)((0, vue.toDisplayString)(__props.description), 1)])], 2))], 2)
], 6);
};
}
});
//#endregion
exports.default = item_vue_vue_type_script_setup_true_lang_default;
//# sourceMappingURL=item.vue_vue_type_script_setup_true_lang.js.map
File diff suppressed because one or more lines are too long
+9
View File
@@ -0,0 +1,9 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_item_vue_vue_type_script_setup_true_lang = require('./item.vue_vue_type_script_setup_true_lang.js');
//#region ../../packages/components/steps/src/item.vue
var item_default = require_item_vue_vue_type_script_setup_true_lang.default;
//#endregion
exports.default = item_default;
//# sourceMappingURL=item2.js.map
File diff suppressed because one or more lines are too long
+76
View File
@@ -0,0 +1,76 @@
import { EpPropFinalized, EpPropMergeType } from "../../../utils/vue/props/types.js";
import "../../../utils/index.js";
import { _default } from "./steps.vue.js";
import * as vue from "vue";
import { ExtractPublicPropTypes } from "vue";
//#region ../../packages/components/steps/src/steps.d.ts
type StepsStatus = 'wait' | 'process' | 'finish' | 'error' | 'success';
interface StepsProps {
/**
* @description the spacing of each step, will be responsive if omitted. Supports percentage.
* @default ''
*/
space?: number | string;
/**
* @description current activation step
* @default 0
*/
active?: number;
/**
* @description display direction
* @default 'horizontal'
*/
direction?: 'horizontal' | 'vertical';
/**
* @description center title and description
*/
alignCenter?: boolean;
/**
* @description whether to apply simple theme
*/
simple?: boolean;
/**
* @description status of end step
* @default 'finish'
*/
finishStatus?: StepsStatus;
/**
* @description status of current step
* @default 'process'
*/
processStatus?: StepsStatus;
}
/**
* @deprecated Removed after 3.0.0, Use `StepsProps` instead.
*/
declare const stepsProps: {
readonly space: EpPropFinalized<readonly [NumberConstructor, StringConstructor], unknown, unknown, "", boolean>;
readonly active: EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
readonly direction: EpPropFinalized<StringConstructor, "horizontal" | "vertical", unknown, "horizontal", boolean>;
readonly alignCenter: {
readonly type: vue.PropType<EpPropMergeType<BooleanConstructor, unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly simple: {
readonly type: vue.PropType<EpPropMergeType<BooleanConstructor, unknown, unknown>>;
readonly required: false;
readonly validator: ((val: unknown) => boolean) | undefined;
__epPropKey: true;
};
readonly finishStatus: EpPropFinalized<StringConstructor, "error" | "success" | "wait" | "finish" | "process", unknown, "finish", boolean>;
readonly processStatus: EpPropFinalized<StringConstructor, "error" | "success" | "wait" | "finish" | "process", unknown, "process", boolean>;
};
/**
* @deprecated Removed after 3.0.0, Use `StepsProps` instead.
*/
type StepsPropsPublic = ExtractPublicPropTypes<typeof stepsProps>;
declare const stepsEmits: {
change: (newVal: number, oldVal: number) => boolean;
};
type StepsEmits = typeof stepsEmits;
type StepsInstance = InstanceType<typeof _default> & unknown;
//#endregion
export { StepsEmits, StepsInstance, StepsProps, StepsPropsPublic, StepsStatus, stepsEmits, stepsProps };
+54
View File
@@ -0,0 +1,54 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
const require_event = require('../../../constants/event.js');
const require_types = require('../../../utils/types.js');
const require_runtime = require('../../../utils/vue/props/runtime.js');
//#region ../../packages/components/steps/src/steps.ts
/**
* @deprecated Removed after 3.0.0, Use `StepsProps` instead.
*/
const stepsProps = require_runtime.buildProps({
space: {
type: [Number, String],
default: ""
},
active: {
type: Number,
default: 0
},
direction: {
type: String,
default: "horizontal",
values: ["horizontal", "vertical"]
},
alignCenter: { type: Boolean },
simple: { type: Boolean },
finishStatus: {
type: String,
values: [
"wait",
"process",
"finish",
"error",
"success"
],
default: "finish"
},
processStatus: {
type: String,
values: [
"wait",
"process",
"finish",
"error",
"success"
],
default: "process"
}
});
const stepsEmits = { [require_event.CHANGE_EVENT]: (newVal, oldVal) => [newVal, oldVal].every(require_types.isNumber) };
//#endregion
exports.stepsEmits = stepsEmits;
exports.stepsProps = stepsProps;
//# sourceMappingURL=steps.js.map
@@ -0,0 +1 @@
{"version":3,"file":"steps.js","names":["buildProps","CHANGE_EVENT","isNumber"],"sources":["../../../../../../packages/components/steps/src/steps.ts"],"sourcesContent":["import { CHANGE_EVENT } from '@element-plus/constants'\nimport { buildProps, isNumber } from '@element-plus/utils'\n\nimport type Steps from './steps.vue'\nimport type { ExtractPublicPropTypes } from 'vue'\n\nexport type StepsStatus = 'wait' | 'process' | 'finish' | 'error' | 'success'\n\nexport interface StepsProps {\n /**\n * @description the spacing of each step, will be responsive if omitted. Supports percentage.\n * @default ''\n */\n space?: number | string\n /**\n * @description current activation step\n * @default 0\n */\n active?: number\n /**\n * @description display direction\n * @default 'horizontal'\n */\n direction?: 'horizontal' | 'vertical'\n /**\n * @description center title and description\n */\n alignCenter?: boolean\n /**\n * @description whether to apply simple theme\n */\n simple?: boolean\n /**\n * @description status of end step\n * @default 'finish'\n */\n finishStatus?: StepsStatus\n /**\n * @description status of current step\n * @default 'process'\n */\n processStatus?: StepsStatus\n}\n\n/**\n * @deprecated Removed after 3.0.0, Use `StepsProps` instead.\n */\nexport const stepsProps = buildProps({\n /**\n * @description the spacing of each step, will be responsive if omitted. Supports percentage.\n */\n space: {\n type: [Number, String],\n default: '',\n },\n /**\n * @description current activation step\n */\n active: {\n type: Number,\n default: 0,\n },\n /**\n * @description display direction\n */\n direction: {\n type: String,\n default: 'horizontal',\n values: ['horizontal', 'vertical'],\n },\n /**\n * @description center title and description\n */\n alignCenter: {\n type: Boolean,\n },\n /**\n * @description whether to apply simple theme\n */\n simple: {\n type: Boolean,\n },\n /**\n * @description status of end step\n */\n finishStatus: {\n type: String,\n values: ['wait', 'process', 'finish', 'error', 'success'],\n default: 'finish',\n },\n /**\n * @description status of current step\n */\n processStatus: {\n type: String,\n values: ['wait', 'process', 'finish', 'error', 'success'],\n default: 'process',\n },\n} as const)\n\n/**\n * @deprecated Removed after 3.0.0, Use `StepsProps` instead.\n */\nexport type StepsPropsPublic = ExtractPublicPropTypes<typeof stepsProps>\n\nexport const stepsEmits = {\n [CHANGE_EVENT]: (newVal: number, oldVal: number) =>\n [newVal, oldVal].every(isNumber),\n}\nexport type StepsEmits = typeof stepsEmits\n\nexport type StepsInstance = InstanceType<typeof Steps> & unknown\n"],"mappings":";;;;;;;;;AA+CA,MAAa,aAAaA,2BAAW;CAInC,OAAO;EACL,MAAM,CAAC,QAAQ,OAAO;EACtB,SAAS;EACV;CAID,QAAQ;EACN,MAAM;EACN,SAAS;EACV;CAID,WAAW;EACT,MAAM;EACN,SAAS;EACT,QAAQ,CAAC,cAAc,WAAW;EACnC;CAID,aAAa,EACX,MAAM,SACP;CAID,QAAQ,EACN,MAAM,SACP;CAID,cAAc;EACZ,MAAM;EACN,QAAQ;GAAC;GAAQ;GAAW;GAAU;GAAS;GAAU;EACzD,SAAS;EACV;CAID,eAAe;EACb,MAAM;EACN,QAAQ;GAAC;GAAQ;GAAW;GAAU;GAAS;GAAU;EACzD,SAAS;EACV;CACF,CAAU;AAOX,MAAa,aAAa,GACvBC,8BAAgB,QAAgB,WAC/B,CAAC,QAAQ,OAAO,CAAC,MAAMC,uBAAS,EACnC"}
@@ -0,0 +1,28 @@
import { StepsProps, StepsStatus } from "./steps.js";
import * as vue from "vue";
//#region ../../packages/components/steps/src/steps.vue.d.ts
declare var __VLS_1: {};
type __VLS_Slots = {} & {
default?: (props: typeof __VLS_1) => any;
};
declare const __VLS_base: vue.DefineComponent<StepsProps, {}, {}, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
change: (newVal: number, oldVal: number) => void;
}, string, vue.PublicProps, Readonly<StepsProps> & Readonly<{
onChange?: ((newVal: number, oldVal: number) => any) | undefined;
}>, {
space: number | string;
active: number;
direction: "horizontal" | "vertical";
finishStatus: StepsStatus;
processStatus: StepsStatus;
}, {}, {}, {}, string, vue.ComponentProvideOptions, false, {}, any>;
declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
declare const _default: typeof __VLS_export;
type __VLS_WithSlots<T, S> = T & {
new (): {
$slots: S;
};
};
//#endregion
export { _default };
@@ -0,0 +1,42 @@
const require_runtime = require('../../../_virtual/_rolldown/runtime.js');
const require_event = require('../../../constants/event.js');
const require_index = require('../../../hooks/use-namespace/index.js');
const require_index$1 = require('../../../hooks/use-ordered-children/index.js');
const require_steps = require('./steps.js');
const require_tokens = require('./tokens.js');
let vue = require("vue");
//#region ../../packages/components/steps/src/steps.vue?vue&type=script&setup=true&lang.ts
var steps_vue_vue_type_script_setup_true_lang_default = /* @__PURE__ */ (0, vue.defineComponent)({
name: "ElSteps",
__name: "steps",
props: require_steps.stepsProps,
emits: require_steps.stepsEmits,
setup(__props, { emit: __emit }) {
const props = __props;
const emit = __emit;
const ns = require_index.useNamespace("steps");
const { children: steps, addChild: addStep, removeChild: removeStep, ChildrenSorter: StepsSorter } = require_index$1.useOrderedChildren((0, vue.getCurrentInstance)(), "ElStep");
(0, vue.watch)(steps, () => {
steps.value.forEach((instance, index) => {
instance.setIndex(index);
});
});
(0, vue.provide)(require_tokens.STEPS_INJECTION_KEY, {
props,
steps,
addStep,
removeStep
});
(0, vue.watch)(() => props.active, (newVal, oldVal) => {
emit(require_event.CHANGE_EVENT, newVal, oldVal);
});
return (_ctx, _cache) => {
return (0, vue.openBlock)(), (0, vue.createElementBlock)("div", { class: (0, vue.normalizeClass)([(0, vue.unref)(ns).b(), (0, vue.unref)(ns).m(__props.simple ? "simple" : __props.direction)]) }, [(0, vue.renderSlot)(_ctx.$slots, "default"), (0, vue.createVNode)((0, vue.unref)(StepsSorter))], 2);
};
}
});
//#endregion
exports.default = steps_vue_vue_type_script_setup_true_lang_default;
//# sourceMappingURL=steps.vue_vue_type_script_setup_true_lang.js.map
@@ -0,0 +1 @@
{"version":3,"file":"steps.vue_vue_type_script_setup_true_lang.js","names":[],"sources":["../../../../../../packages/components/steps/src/steps.vue"],"sourcesContent":["<template>\n <div :class=\"[ns.b(), ns.m(simple ? 'simple' : direction)]\">\n <slot />\n <steps-sorter />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { getCurrentInstance, provide, watch } from 'vue'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport { useNamespace, useOrderedChildren } from '@element-plus/hooks'\nimport { stepsEmits } from './steps'\nimport { STEPS_INJECTION_KEY } from './tokens'\n\nimport type { StepsProps } from './steps'\nimport type { StepItemState } from './item.vue'\n\ndefineOptions({\n name: 'ElSteps',\n})\n\nconst props = withDefaults(defineProps<StepsProps>(), {\n space: '',\n direction: 'horizontal',\n active: 0,\n processStatus: 'process',\n finishStatus: 'finish',\n})\nconst emit = defineEmits(stepsEmits)\n\nconst ns = useNamespace('steps')\nconst {\n children: steps,\n addChild: addStep,\n removeChild: removeStep,\n ChildrenSorter: StepsSorter,\n} = useOrderedChildren<StepItemState>(getCurrentInstance()!, 'ElStep')\n\nwatch(steps, () => {\n steps.value.forEach((instance: StepItemState, index: number) => {\n instance.setIndex(index)\n })\n})\n\nprovide(STEPS_INJECTION_KEY, { props, steps, addStep, removeStep })\n\nwatch(\n () => props.active,\n (newVal: number, oldVal: number) => {\n emit(CHANGE_EVENT, newVal, oldVal)\n }\n)\n</script>\n"],"mappings":";;;;;;;;;;;;;;;EAqBA,MAAM,QAAQ;EAOd,MAAM,OAAO;EAEb,MAAM,KAAK,2BAAa,QAAO;EAC/B,MAAM,EACJ,UAAU,OACV,UAAU,SACV,aAAa,YACb,gBAAgB,gBACd,gEAAsD,EAAG,SAAQ;AAErE,iBAAM,aAAa;AACjB,SAAM,MAAM,SAAS,UAAyB,UAAkB;AAC9D,aAAS,SAAS,MAAK;KACxB;IACF;AAED,mBAAQ,oCAAqB;GAAE;GAAO;GAAO;GAAS;GAAY,CAAA;AAElE,uBACQ,MAAM,SACX,QAAgB,WAAmB;AAClC,QAAK,4BAAc,QAAQ,OAAM;IAErC;;4DA/CQ,OAAA,EAHA,+BAAK,gBAAG,GAAE,CAAC,GAAC,iBAAI,GAAE,CAAC,EAAE,QAAA,SAAM,WAAc,QAAA,UAAS,CAAA,CAAA,yBAC9C,KAAA,QAAA,UAAA,sCACQ,YAAA,CAAA"}
@@ -0,0 +1,9 @@
Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
const require_steps_vue_vue_type_script_setup_true_lang = require('./steps.vue_vue_type_script_setup_true_lang.js');
//#region ../../packages/components/steps/src/steps.vue
var steps_default = require_steps_vue_vue_type_script_setup_true_lang.default;
//#endregion
exports.default = steps_default;
//# sourceMappingURL=steps2.js.map
@@ -0,0 +1 @@
{"version":3,"file":"steps2.js","names":[],"sources":["../../../../../../packages/components/steps/src/steps.vue"],"sourcesContent":["<template>\n <div :class=\"[ns.b(), ns.m(simple ? 'simple' : direction)]\">\n <slot />\n <steps-sorter />\n </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { getCurrentInstance, provide, watch } from 'vue'\nimport { CHANGE_EVENT } from '@element-plus/constants'\nimport { useNamespace, useOrderedChildren } from '@element-plus/hooks'\nimport { stepsEmits } from './steps'\nimport { STEPS_INJECTION_KEY } from './tokens'\n\nimport type { StepsProps } from './steps'\nimport type { StepItemState } from './item.vue'\n\ndefineOptions({\n name: 'ElSteps',\n})\n\nconst props = withDefaults(defineProps<StepsProps>(), {\n space: '',\n direction: 'horizontal',\n active: 0,\n processStatus: 'process',\n finishStatus: 'finish',\n})\nconst emit = defineEmits(stepsEmits)\n\nconst ns = useNamespace('steps')\nconst {\n children: steps,\n addChild: addStep,\n removeChild: removeStep,\n ChildrenSorter: StepsSorter,\n} = useOrderedChildren<StepItemState>(getCurrentInstance()!, 'ElStep')\n\nwatch(steps, () => {\n steps.value.forEach((instance: StepItemState, index: number) => {\n instance.setIndex(index)\n })\n})\n\nprovide(STEPS_INJECTION_KEY, { props, steps, addStep, removeStep })\n\nwatch(\n () => props.active,\n (newVal: number, oldVal: number) => {\n emit(CHANGE_EVENT, newVal, oldVal)\n }\n)\n</script>\n"],"mappings":""}
@@ -0,0 +1,4 @@
//#region ../../packages/components/steps/src/tokens.d.ts
declare const STEPS_INJECTION_KEY = "ElSteps";
//#endregion
export { STEPS_INJECTION_KEY };
@@ -0,0 +1,8 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
//#region ../../packages/components/steps/src/tokens.ts
const STEPS_INJECTION_KEY = "ElSteps";
//#endregion
exports.STEPS_INJECTION_KEY = STEPS_INJECTION_KEY;
//# sourceMappingURL=tokens.js.map
@@ -0,0 +1 @@
{"version":3,"file":"tokens.js","names":[],"sources":["../../../../../../packages/components/steps/src/tokens.ts"],"sourcesContent":["export const STEPS_INJECTION_KEY = 'ElSteps'\n"],"mappings":";;;AAAA,MAAa,sBAAsB"}
+3
View File
@@ -0,0 +1,3 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
require('../../base/style/css.js');
require("element-plus/theme-chalk/el-steps.css");
@@ -0,0 +1,3 @@
Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
require('../../base/style/index.js');
require("element-plus/theme-chalk/src/steps.scss");