feat: add Typography component #15
Conversation
|
👍 @Jandiasnow |
src/Typography/index.tsx
Outdated
| } | ||
| return ''; | ||
| }; | ||
| const lang = getCookie('intl_locale') || window.localStorage.getItem('intl_locale') || 'zh'; |
There was a problem hiding this comment.
组件的国际化参考下 antd，通过 cookie 判断不太可取
src/Typography/index.tsx
Outdated
|
|
||
| const fmtTime = dayjs(time ? new Date(time) : new Date()).format(format || 'YYYY-MM-DD HH:mm:ss'); | ||
| if (!relativeTime) { | ||
| return <span>{time ? fmtTime : '-'}</span>; |
There was a problem hiding this comment.
如果指定了 tooltip，这里是不是也应该有 tooltip
| time: string; | ||
| format?: string; | ||
| relativeTime?: boolean; | ||
| tooltip?: TooltipPropsWithTitle; |
There was a problem hiding this comment.
自定义的组件，最基本的属性要支持，比如 className 及 style 等，建议基于 Text 扩展下，别直接用 span
src/Typography/index.tsx
Outdated
| const TooltipDom = (currentTime: string) => { | ||
| return ( | ||
| <Tooltip | ||
| {...tooltip} | ||
| title={tooltip ? tooltip.title : fmtTime(formatTooltip ? format : undefined)} | ||
| > | ||
| <Typography.Text {...textProps}>{currentTime}</Typography.Text> | ||
| </Tooltip> | ||
| ); | ||
| }; | ||
|
|
||
| if (!relativeTime) { | ||
| return TooltipDom(time ? fmtTime(format) : '-'); | ||
| } | ||
|
|
||
| return time ? TooltipDom(showTime) : <Typography.Text {...textProps}>-</Typography.Text>; |
There was a problem hiding this comment.
这块儿代码需要优化下：
- tooltip 与 ellipsis.tooltip 可能会导致多个 tooltip，当有外层 tooltip 的时候，ellipsis.tooltip 应该设置为 false
- 目前的代码为了区分是否有 tooltip，感觉有点儿复杂了，可以考虑外层 tooltip 固定，不需要的时候不设置 title 是否就可以？这样结构也稳定些
Jandiasnow
force-pushed
the
beta
branch
4 times, most recently
from
82a652d
to
e097448
Compare
src/Typography/index.tsx
Outdated
| } | ||
| }, [time, relativeTime]); | ||
|
|
||
| const fmtTime = dayjs(time ? new Date(time) : new Date()).format(format || 'YYYY-MM-DD HH:mm:ss'); |
src/Typography/index.tsx
Outdated
|
|
||
| const currentTime = relativeTime ? showTime : fmtTime; | ||
|
|
||
| const tooltipTitle = tooltip ? tooltip.title : fmtTime; |
There was a problem hiding this comment.
// 非相对时间时，默认不展示 tooltip，走 Text 默认的溢出展示 tooltip 的逻辑
const tooltipTitle = tooltip.title ?? (relativeTime ? fmtTime : undefined);
|
❤️ Great PR @Jandiasnow ❤️ |
|
🎉 This PR is included in version 1.0.0-beta.18 🎉 The release is available on: Your semantic-release bot 📦🚀 |
💻 变更类型 | Change Type
🔀 变更说明 | Description of Change
feat: add Typography component
📝 补充信息 | Additional Information