Skip to content

Commit 26b8e1d

Browse files
RSS1102RSS1102
committed
Merge branch 'develop' into rss1102/feat/Swiper/model-value
1 parent 89671ef commit 26b8e1d

File tree

29 files changed

+231
-341
lines changed

29 files changed

+231
-341
lines changed

‎packages/components/divider/__tests__/divider.test.tsx‎

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,7 @@ describe('Divider', () => {
2929
text
3030
</Divider>,
3131
);
32-
expect(wrapper.classes('t-divider--with-text-left')).toBeTruthy();
33-
expect(wrapper.element).toMatchSnapshot('align-vertical-left');
32+
expect(wrapper.classes('t-divider--with-text-left')).toBeFalsy();
3433
});
3534

3635
it(':dashed[true/false]', () => {
@@ -69,15 +68,6 @@ describe('Divider', () => {
6968
});
7069
});
7170

72-
it(':theme[horizontal/vertical]', () => {
73-
const { validator } = props.theme;
74-
expect(validator('horizontal')).toBeTruthy();
75-
expect(validator('vertical')).toBeTruthy();
76-
// @ts-expect-error types error
77-
expect(validator('other')).toBeFalsy();
78-
expect(validator(undefined)).toBeTruthy();
79-
});
80-
8171
it(':content[string/function]', () => {
8272
// string
8373
const wrapperString = mount(<Divider content="TDesign" />);
@@ -115,5 +105,19 @@ describe('Divider', () => {
115105
expect(wrapper.text()).toBe('TDesign');
116106
expect(wrapper.element).toMatchSnapshot('default-priority');
117107
});
108+
109+
it(':size[string/number]', () => {
110+
// string
111+
const wrapperString = mount(<Divider size="20px" />);
112+
expect(wrapperString.attributes('style')).toContain('margin: 20px 0px;');
113+
114+
// number
115+
const wrapperNumber = mount(<Divider size={30} />);
116+
expect(wrapperNumber.attributes('style')).toContain('margin: 30px 0px;');
117+
118+
// vertical
119+
const wrapperVertical = mount(<Divider layout="vertical" size="40px" />);
120+
expect(wrapperVertical.attributes('style')).toContain('margin: 0px 40px;');
121+
});
118122
});
119123
});

‎packages/components/divider/_usage/props.json‎

Lines changed: 0 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -38,20 +38,5 @@
3838
"value": "vertical"
3939
}
4040
]
41-
},
42-
{
43-
"name": "theme",
44-
"type": "enum",
45-
"defaultValue": "horizontal",
46-
"options": [
47-
{
48-
"label": "horizontal",
49-
"value": "horizontal"
50-
},
51-
{
52-
"label": "vertical",
53-
"value": "vertical"
54-
}
55-
]
5641
}
5742
]

‎packages/components/divider/divider.en-US.md‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
:: BASE_DOC ::
22

33
## API
4+
45
### Divider Props
56

67
name | type | default | description | required
78
-- | -- | -- | -- | --
8-
align | String | center | options：left/right/center | N
9+
align | String | center | options: left/right/center | N
910
content | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
1011
dashed | Boolean | false | \- | N
1112
default | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
12-
layout | String | horizontal | options：horizontal/vertical | N
13-
theme | String | - | `deprecated`。options：horizontal/vertical | N
13+
layout | String | horizontal | options: horizontal/vertical | N
14+
size | String / Number | - | Spacing size | N

‎packages/components/divider/divider.md‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
:: BASE_DOC ::
22

33
## API
4+
45
### Divider Props
56

6-
名称 | 类型 | 默认值 | 说明 | 必传
7+
名称 | 类型 | 默认值 | 描述 | 必传
78
-- | -- | -- | -- | --
89
align | String | center | 文本位置（仅在水平分割线有效）。可选项：left/right/center | N
910
content | String / Slot / Function | - | 子元素。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
1011
dashed | Boolean | false | 是否虚线（仅在水平分割线有效） | N
1112
default | String / Slot / Function | - | 子元素，同 content。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-vue-next/blob/develop/packages/components/common.ts) | N
1213
layout | String | horizontal | 分隔线类型有两种：水平和垂直。可选项：horizontal/vertical | N
13-
theme | String | - | 已废弃。请更为使用 `layout`。分隔线类型有两种：水平和垂直。可选项：horizontal/vertical | N
14+
size | String / Number | - | 间距大小 | N

‎packages/components/divider/divider.tsx‎

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
1-
import { defineComponent } from 'vue';
1+
import { computed, defineComponent } from 'vue';
22
import props from './props';
33
import { useContent, usePrefixClass } from '@tdesign/shared-hooks';
4+
import { pxCompat } from '@tdesign/common-js/utils/helper';
45

56
export default defineComponent({
67
name: 'TDivider',
@@ -9,22 +10,30 @@ export default defineComponent({
910
const COMPONENT_NAME = usePrefixClass('divider');
1011
const renderContent = useContent();
1112
return () => {
12-
const { layout, dashed, align } = props;
1313
const children = renderContent('default', 'content');
14+
const isHorizontal = computed(() => props.layout !== 'vertical');
15+
const showText = computed(() => isHorizontal.value && !!children);
1416

1517
const dividerClassNames = [
1618
`${COMPONENT_NAME.value}`,
17-
[`${COMPONENT_NAME.value}--${layout}`],
19+
[`${COMPONENT_NAME.value}--${props.layout}`],
1820
{
19-
[`${COMPONENT_NAME.value}--dashed`]: !!dashed,
20-
[`${COMPONENT_NAME.value}--with-text`]: !!children,
21-
[`${COMPONENT_NAME.value}--with-text-${align}`]: !!children,
21+
[`${COMPONENT_NAME.value}--dashed`]: !!props.dashed,
22+
[`${COMPONENT_NAME.value}--with-text`]: !!showText.value,
23+
[`${COMPONENT_NAME.value}--with-text-${props.align}`]: !!showText.value,
2224
},
2325
];
26+
const dividerWrapperStyle = computed(() => {
27+
if (props.size) {
28+
const margin = isHorizontal.value ? `${pxCompat(props.size)} 0` : `0 ${pxCompat(props.size)}`;
29+
return { margin };
30+
}
31+
return null;
32+
});
2433

2534
return (
26-
<div class={dividerClassNames}>
27-
{children && <span class={`${COMPONENT_NAME.value}__inner-text`}>{children}</span>}
35+
<div class={dividerClassNames} style={dividerWrapperStyle.value}>
36+
{showText.value && <span class={`${COMPONENT_NAME.value}__inner-text`}>{children}</span>}
2837
</div>
2938
);
3039
};

‎packages/components/divider/props.ts‎

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,12 +36,8 @@ export default {
3636
return ['horizontal', 'vertical'].includes(val);
3737
},
3838
},
39-
/** 已废弃。请更为使用 `layout`。分隔线类型有两种：水平和垂直 */
40-
theme: {
41-
type: String as PropType<TdDividerProps['theme']>,
42-
validator(val: TdDividerProps['theme']): boolean {
43-
if (!val) return true;
44-
return ['horizontal', 'vertical'].includes(val);
45-
},
39+
/** 间距大小 */
40+
size: {
41+
type: [String, Number] as PropType<TdDividerProps['size']>,
4642
},
4743
};

‎packages/components/divider/type.ts‎

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,7 @@ export interface TdDividerProps {
3131
*/
3232
layout?: 'horizontal' | 'vertical';
3333
/**
34-
* 请更为使用 `layout`。分隔线类型有两种：水平和垂直
35-
* @deprecated
34+
* 间距大小
3635
*/
37-
theme?: 'horizontal' | 'vertical';
36+
size?: string | number;
3837
}

‎packages/components/empty/empty.tsx‎

Lines changed: 27 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { computed, defineComponent, h, toRefs } from 'vue';
1+
import { computed, ComputedRef, defineComponent, h, toRefs } from 'vue';
22
import { isString, isPlainObject } from 'lodash-es';
33

44
import { useConfig, useTNodeJSX, usePrefixClass, useCommonClassName } from '@tdesign/shared-hooks';
@@ -24,38 +24,40 @@ export default defineComponent({
2424
const { SIZE } = useCommonClassName();
2525
const renderTNodeJSX = useTNodeJSX();
2626

27-
const defaultMaps: {
27+
const defaultMaps: ComputedRef<{
2828
[key in TdEmptyProps['type']]?: Pick<TdEmptyProps, 'image' | 'title'>;
29-
} = {
30-
maintenance: {
31-
image: globalConfig.value.image.maintenance || MaintenanceSvg,
32-
title: globalConfig.value.titleText.maintenance,
33-
},
34-
success: {
35-
image: globalConfig.value.image.success || SuccessSvg,
36-
title: globalConfig.value.titleText.success,
37-
},
38-
fail: {
39-
image: globalConfig.value.image.fail || FailSvg,
40-
title: globalConfig.value.titleText.fail,
41-
},
42-
'network-error': {
43-
image: globalConfig.value.image.networkError || NetworkErrorSvg,
44-
title: globalConfig.value.titleText.networkError,
45-
},
46-
empty: {
47-
image: globalConfig.value.image.empty || EmptySvg,
48-
title: globalConfig.value.titleText.empty,
49-
},
50-
};
29+
}> = computed(() => {
30+
return {
31+
maintenance: {
32+
image: globalConfig.value.image.maintenance || MaintenanceSvg,
33+
title: globalConfig.value.titleText.maintenance,
34+
},
35+
success: {
36+
image: globalConfig.value.image.success || SuccessSvg,
37+
title: globalConfig.value.titleText.success,
38+
},
39+
fail: {
40+
image: globalConfig.value.image.fail || FailSvg,
41+
title: globalConfig.value.titleText.fail,
42+
},
43+
'network-error': {
44+
image: globalConfig.value.image.networkError || NetworkErrorSvg,
45+
title: globalConfig.value.titleText.networkError,
46+
},
47+
empty: {
48+
image: globalConfig.value.image.empty || EmptySvg,
49+
title: globalConfig.value.titleText.empty,
50+
},
51+
};
52+
});
5153

5254
const emptyClasses = computed(() => [classPrefix.value, SIZE.value[size.value]]);
5355
const titleClasses = [`${classPrefix.value}__title`];
5456
const imageClasses = [`${classPrefix.value}__image`];
5557
const descriptionClasses = [`${classPrefix.value}__description`];
5658
const actionClass = [`${classPrefix.value}__action`];
5759

58-
const typeImageProps = computed(() => defaultMaps[type.value] ?? null);
60+
const typeImageProps = computed(() => defaultMaps.value[type.value] ?? null);
5961
const showImage = computed(() => propsImage.value || slots?.image?.() || typeImageProps.value?.image);
6062
const showTitle = computed(() => propsTitle.value || slots?.title?.() || typeImageProps.value?.title);
6163
const showDescription = computed(() => propsDescription.value || slots?.description?.());

‎packages/components/form/__tests__/form.test.tsx‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -370,6 +370,20 @@ describe('Form', () => {
370370
formData.value.name = '[email protected]';
371371
res = await validate();
372372
expectToSuccess(res);
373+
374+
rules.value = { name: [{ pattern: '[a-zA-Z]{8}' }] };
375+
formData.value.name = 'abcdefg';
376+
res = await validate();
377+
expectToFailure(res);
378+
379+
rules.value = { name: [{ pattern: '[a-zA-Z]{8}' }] };
380+
formData.value.name = '12345678';
381+
res = await validate();
382+
expectToFailure(res);
383+
384+
formData.value.name = 'abcdefgh';
385+
res = await validate();
386+
expectToSuccess(res);
373387
});
374388

375389
it('required', async () => {

0 commit comments

Comments
 (0)