From 161bdde18dcff3fd0a0c80ec91c5a9ed4d1bfed5 Mon Sep 17 00:00:00 2001 From: kentac55 Date: Fri, 22 May 2020 17:49:24 +0900 Subject: [PATCH 1/3] feat(user): provide a prop for alt text --- components/user/user.tsx | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/components/user/user.tsx b/components/user/user.tsx index fef9f47..5ad9e43 100644 --- a/components/user/user.tsx +++ b/components/user/user.tsx @@ -8,6 +8,7 @@ interface Props { src?: string text?: string className?: string + altText?: string } const defaultProps = { @@ -23,13 +24,14 @@ const User: React.FC> = ({ name, children, className, + altText, ...props }) => { const theme = useTheme() return (
- +
{name} {children} From ab46d22ae698cce821dee0c2fa3a18da31596e0a Mon Sep 17 00:00:00 2001 From: kentac55 Date: Fri, 22 May 2020 17:49:34 +0900 Subject: [PATCH 2/3] test(user): add a new test to check altText --- components/user/__tests__/index.test.tsx | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/components/user/__tests__/index.test.tsx b/components/user/__tests__/index.test.tsx index 0688bd7..a9a0cab 100644 --- a/components/user/__tests__/index.test.tsx +++ b/components/user/__tests__/index.test.tsx @@ -32,4 +32,11 @@ describe(' User', () => { const link = wrapper.find('a') expect(link.length).not.toBe(0) }) + + it('should pass alt attribute', () => { + const wrapper = mount( + + ) + expect(wrapper.find('img').prop('alt')).toEqual('witt') + }) }) From 3669703186bb279c275a1add698c30c5de7b7a2c Mon Sep 17 00:00:00 2001 From: kentac55 Date: Fri, 22 May 2020 17:49:52 +0900 Subject: [PATCH 3/3] docs(user): add doc for altText --- pages/en-us/components/user.mdx | 1 + pages/zh-cn/components/user.mdx | 1 + 2 files changed, 2 insertions(+) diff --git a/pages/en-us/components/user.mdx b/pages/en-us/components/user.mdx index a636bfa..5cf90cb 100644 --- a/pages/en-us/components/user.mdx +++ b/pages/en-us/components/user.mdx @@ -45,6 +45,7 @@ Display user profile or social information. | **name**(required) | user name | `ReactNode` / `string` | - | - | | **src** | avatar url | `string` | - | - | | **text** | display text when image is missing | `string` | - | - | +| **altText** | alt attribute used by inner avatar image | `string` | - | - | | ... | native props | `HTMLAttributes` | `'id', 'name', 'className', ...` | - | User.Link.Props diff --git a/pages/zh-cn/components/user.mdx b/pages/zh-cn/components/user.mdx index 9b8911f..95af71e 100644 --- a/pages/zh-cn/components/user.mdx +++ b/pages/zh-cn/components/user.mdx @@ -45,6 +45,7 @@ export const meta = { | **name**(必须值) | 用户名 | `ReactNode` / `string` | - | - | | **src** | 头像图片地址 | `string` | - | - | | **text** | 以文字方式显示头像 | `string` | - | - | +| **altText** | 内部头像图像使用的alt属性 | `string` | - | - | | ... | 原生属性 | `HTMLAttributes` | `'id', 'name', 'className', ...` | - | User.Link.Props