diff --git a/src/step-item/props.ts b/src/step-item/props.ts index 8b03c8bf5..6850a0b1f 100644 --- a/src/step-item/props.ts +++ b/src/step-item/props.ts @@ -11,10 +11,6 @@ const props: TdStepItemProps = { type: String, value: '', }, - /** 组件类名,用于设置组件外层元素元素类名 */ - externalClasses: { - type: Array, - }, /** 图标。传入 slot 代表使用插槽,其他字符串代表使用内置图标 */ icon: { type: String, @@ -24,11 +20,6 @@ const props: TdStepItemProps = { type: String, value: 'default', }, - /** 已废弃。子步骤条,仅支持 layout = 'vertical' 时 */ - subStepItems: { - type: Array, - value: [], - }, /** 标题 */ title: { type: String, diff --git a/src/step-item/type.ts b/src/step-item/type.ts index 17f32d3d3..1de063c98 100644 --- a/src/step-item/type.ts +++ b/src/step-item/type.ts @@ -13,13 +13,6 @@ export interface TdStepItemProps { type: StringConstructor; value?: string; }; - /** - * 组件类名,用于设置组件外层元素元素类名 - */ - externalClasses?: { - type: ArrayConstructor; - value?: ['t-class', 't-class-content', 't-class-title', 't-class-description', 't-class-extra']; - }; /** * 图标。传入 slot 代表使用插槽,其他字符串代表使用内置图标 */ @@ -35,15 +28,6 @@ export interface TdStepItemProps { type: StringConstructor; value?: StepStatus; }; - /** - * 子步骤条,仅支持 layout = 'vertical' 时 - * @default [] - * @deprecated - */ - subStepItems?: { - type: ArrayConstructor; - value?: SubStepItem[]; - }; /** * 标题 * @default '' @@ -55,8 +39,3 @@ export interface TdStepItemProps { } export type StepStatus = 'default' | 'process' | 'finish' | 'error'; - -export interface SubStepItem { - status: StepStatus; - title: string; -} diff --git a/src/steps/README.en-US.md b/src/steps/README.en-US.md index ab3f840af..3e4127327 100644 --- a/src/steps/README.en-US.md +++ b/src/steps/README.en-US.md @@ -1,38 +1,56 @@ :: BASE_DOC :: ## API + ### Steps Props name | type | default | description | required -- | -- | -- | -- | -- +style | Object | - | CSS(Cascading Style Sheets) | N +custom-style | Object | - | CSS(Cascading Style Sheets),used to set style on virtual component | N current | String / Number | - | \- | N default-current | String / Number | undefined | uncontrolled property | N -current-status | String | process | options:default/process/finish/error | N -external-classes | Array | - | `['t-class']` | N -layout | String | horizontal | options:horizontal/vertical | N +current-status | String | process | options: default/process/finish/error | N +layout | String | horizontal | options: horizontal/vertical | N readonly | Boolean | false | \- | N -sequence | String | positive | options:positive/reverse | N -theme | String | default | options:default/dot | N +sequence | String | positive | options: positive/reverse | N +theme | String | default | options: default/dot | N ### Steps Events name | params | description -- | -- | -- change | `({current: string \| number, previous: string \| number})` | \- +### Steps External Classes + +className | Description +-- | -- +t-class | \- + ### StepItem Props name | type | default | description | required -- | -- | -- | -- | -- +style | Object | - | CSS(Cascading Style Sheets) | N +custom-style | Object | - | CSS(Cascading Style Sheets),used to set style on virtual component | N content | String / Slot | '' | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N -external-classes | Array | - | `['t-class', 't-class-content', 't-class-title', 't-class-description', 't-class-extra']` | N icon | String / Slot | - | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N -status | String | default | options:default/process/finish/error。Typescript:`StepStatus` `type StepStatus = 'default' \| 'process' \| 'finish' \| 'error'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/step-item/type.ts) | N +status | String | default | options: default/process/finish/error。Typescript:`StepStatus` `type StepStatus = 'default' \| 'process' \| 'finish' \| 'error'`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/step-item/type.ts) | N sub-step-items | Array | [] | `deprecated`。Typescript:`SubStepItem[]` `interface SubStepItem { status: StepStatus, title: string }`。[see more ts definition](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/step-item/type.ts) | N title | String / Slot | '' | [see more ts definition](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N +### StepItem External Classes +className | Description +-- | -- +t-class | class name of root node +t-class-content | \- +t-class-description | \- +t-class-extra | \- +t-class-title | \- ### CSS Variables + The component provides the following CSS variables, which can be used to customize styles. Name | Default Value | Description -- | -- | -- @@ -61,4 +79,4 @@ Name | Default Value | Description --td-step-item-process-circle-color | @font-white-1 | - --td-step-item-process-dot-border-color | @brand-color | - --td-step-item-process-icon-color | @brand-color | - ---td-step-item-process-title-color | @brand-color | - +--td-step-item-process-title-color | @brand-color | - \ No newline at end of file diff --git a/src/steps/README.md b/src/steps/README.md index 8bb27db79..af1525fdb 100644 --- a/src/steps/README.md +++ b/src/steps/README.md @@ -61,10 +61,13 @@ isComponent: true {{ special }} ## API + ### Steps Props -名称 | 类型 | 默认值 | 说明 | 必传 +名称 | 类型 | 默认值 | 描述 | 必传 -- | -- | -- | -- | -- +style | Object | - | 样式 | N +custom-style | Object | - | 样式,一般用于开启虚拟化组件节点场景 | N current | String / Number | - | 当前步骤,即整个步骤条进度。默认根据步骤下标判断步骤的完成状态,当前步骤为进行中,当前步骤之前的步骤为已完成,当前步骤之后的步骤为未开始。如果每个步骤没有设置 value,current 值为步骤长度则表示所有步骤已完成。如果每个步骤设置了自定义 value,则 current = 'FINISH' 表示所有状态完成 | N default-current | String / Number | undefined | 当前步骤,即整个步骤条进度。默认根据步骤下标判断步骤的完成状态,当前步骤为进行中,当前步骤之前的步骤为已完成,当前步骤之后的步骤为未开始。如果每个步骤没有设置 value,current 值为步骤长度则表示所有步骤已完成。如果每个步骤设置了自定义 value,则 current = 'FINISH' 表示所有状态完成。非受控属性 | N current-status | String | process | 用于控制 current 指向的步骤条的状态。可选项:default/process/finish/error | N @@ -78,32 +81,36 @@ theme | String | default | 步骤条风格。可选项:default/dot | N 名称 | 参数 | 描述 -- | -- | -- change | `({current: string \| number, previous: string \| number})` | 当前步骤发生变化时触发 +### Steps External Classes -### Steps 外部样式类 -类名 | 说明 --- | -- +类名 | 描述 +-- | -- t-class | 根节点样式类 + ### StepItem Props -名称 | 类型 | 默认值 | 说明 | 必传 +名称 | 类型 | 默认值 | 描述 | 必传 -- | -- | -- | -- | -- +style | Object | - | 样式 | N +custom-style | Object | - | 样式,一般用于开启虚拟化组件节点场景 | N content | String / Slot | '' | 步骤描述。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N icon | String / Slot | - | 图标。传入 slot 代表使用插槽,其他字符串代表使用内置图标。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N status | String | default | 当前步骤的状态:默认状态(未开始)、进行中状态、完成状态、错误状态。可选项:default/process/finish/error。TS 类型:`StepStatus` `type StepStatus = 'default' \| 'process' \| 'finish' \| 'error'`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/step-item/type.ts) | N sub-step-items | Array | [] | 已废弃。子步骤条,仅支持 layout = 'vertical' 时。TS 类型:`SubStepItem[]` `interface SubStepItem { status: StepStatus, title: string }`。[详细类型定义](https://github.com/Tencent/tdesign-miniprogram/tree/develop/src/step-item/type.ts) | N title | String / Slot | '' | 标题。[通用类型定义](https://github.com/Tencent/tdesign-miniprogram/blob/develop/src/common/common.ts) | N +### StepItem External Classes -### StepItem 外部样式类 -类名 | 说明 --- | -- +类名 | 描述 +-- | -- t-class | 根节点样式类 t-class-content | 内容样式类 -t-class-title | 标题样式类 t-class-description | 描述样式类 t-class-extra | 额外样式类 +t-class-title | 标题样式类 + +### CSS Variables -### CSS 变量 组件提供了下列 CSS 变量,可用于自定义样式。 名称 | 默认值 | 描述 -- | -- | -- @@ -132,4 +139,4 @@ t-class-extra | 额外样式类 --td-step-item-process-circle-color | @font-white-1 | - --td-step-item-process-dot-border-color | @brand-color | - --td-step-item-process-icon-color | @brand-color | - ---td-step-item-process-title-color | @brand-color | - +--td-step-item-process-title-color | @brand-color | - \ No newline at end of file diff --git a/src/steps/props.ts b/src/steps/props.ts index b24e39b48..f092105cf 100644 --- a/src/steps/props.ts +++ b/src/steps/props.ts @@ -20,10 +20,6 @@ const props: TdStepsProps = { type: String, value: 'process', }, - /** 组件类名,用于设置组件外层元素元素类名 */ - externalClasses: { - type: Array, - }, /** 步骤条方向,有两种:横向和纵向 */ layout: { type: String, @@ -34,11 +30,6 @@ const props: TdStepsProps = { type: Boolean, value: false, }, - /** 步骤条分割符 */ - separator: { - type: String, - value: 'line', - }, /** 步骤条顺序 */ sequence: { type: String, diff --git a/src/steps/type.ts b/src/steps/type.ts index 34ec9a175..5b787d923 100644 --- a/src/steps/type.ts +++ b/src/steps/type.ts @@ -27,13 +27,6 @@ export interface TdStepsProps { type: StringConstructor; value?: 'default' | 'process' | 'finish' | 'error'; }; - /** - * 组件类名,用于设置组件外层元素元素类名 - */ - externalClasses?: { - type: ArrayConstructor; - value?: ['t-class']; - }; /** * 步骤条方向,有两种:横向和纵向 * @default horizontal @@ -50,14 +43,6 @@ export interface TdStepsProps { type: BooleanConstructor; value?: boolean; }; - /** - * 步骤条分割符 - * @default line - */ - separator?: { - type: StringConstructor; - value?: 'line' | 'dashed' | 'arrow'; - }; /** * 步骤条顺序 * @default positive