diff --git a/components/steps/index.jsx b/components/steps/index.tsx similarity index 58% rename from components/steps/index.jsx rename to components/steps/index.tsx index ff23b30d1..f5e576f56 100644 --- a/components/steps/index.jsx +++ b/components/steps/index.tsx @@ -1,35 +1,36 @@ -import { inject } from 'vue'; +import { App, defineComponent, ExtractPropTypes, inject } from 'vue'; import CloseOutlined from '@ant-design/icons-vue/CloseOutlined'; import CheckOutlined from '@ant-design/icons-vue/CheckOutlined'; import PropTypes, { withUndefined } from '../_util/vue-types'; -import { initDefaultProps, getOptionProps, getComponent, getSlot } from '../_util/props-util'; +import { getOptionProps, getComponent, getSlot } from '../_util/props-util'; +import initDefaultProps from '../_util/props-util/initDefaultProps'; import VcSteps from '../vc-steps'; import { defaultConfigProvider } from '../config-provider'; +import { tuple } from '../_util/type'; -const getStepsProps = (defaultProps = {}) => { - const props = { - prefixCls: PropTypes.string, - iconPrefix: PropTypes.string, - current: PropTypes.number, - initial: PropTypes.number, - labelPlacement: PropTypes.oneOf(['horizontal', 'vertical']).def('horizontal'), - status: PropTypes.oneOf(['wait', 'process', 'finish', 'error']), - size: PropTypes.oneOf(['default', 'small']), - direction: PropTypes.oneOf(['horizontal', 'vertical']), - progressDot: withUndefined(PropTypes.oneOfType([PropTypes.looseBool, PropTypes.func])), - type: PropTypes.oneOf(['default', 'navigation']), - onChange: PropTypes.func, - 'onUpdate:current': PropTypes.func, - }; - return initDefaultProps(props, defaultProps); +const stepsProps = { + prefixCls: PropTypes.string, + iconPrefix: PropTypes.string, + current: PropTypes.number, + initial: PropTypes.number, + labelPlacement: PropTypes.oneOf(tuple('horizontal', 'vertical')).def('horizontal'), + status: PropTypes.oneOf(tuple('wait', 'process', 'finish', 'error')), + size: PropTypes.oneOf(tuple('default', 'small')), + direction: PropTypes.oneOf(tuple('horizontal', 'vertical')), + progressDot: withUndefined(PropTypes.oneOfType([PropTypes.looseBool, PropTypes.func])), + type: PropTypes.oneOf(tuple('default', 'navigation')), + onChange: PropTypes.func, }; -const Steps = { +export type StepsProps = Partial>; + +const Steps = defineComponent({ name: 'ASteps', inheritAttrs: false, - props: getStepsProps({ + props: initDefaultProps(stepsProps, { current: 0, }), + emits: ['update:current', 'change'], setup() { return { configProvider: inject('configProvider', defaultConfigProvider), @@ -43,7 +44,7 @@ const Steps = { }, }, render() { - const props = { ...getOptionProps(this), ...this.$attrs }; + const props: StepsProps = { ...getOptionProps(this), ...this.$attrs }; const { prefixCls: customizePrefixCls, iconPrefix: customizeIconPrefixCls } = props; const getPrefixCls = this.configProvider.getPrefixCls; const prefixCls = getPrefixCls('steps', customizePrefixCls); @@ -65,10 +66,10 @@ const Steps = { }; return {getSlot(this)}; }, -}; +}); /* istanbul ignore next */ -Steps.install = function(app) { +Steps.install = function(app: App) { app.component(Steps.name, Steps); app.component(Steps.Step.name, Steps.Step); return app; diff --git a/components/steps/style/index.js b/components/steps/style/index.ts similarity index 100% rename from components/steps/style/index.js rename to components/steps/style/index.ts