feat: Typography add suffix #20224

zouxiaomingya · 2019-12-12T14:24:00Z

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

Title bug Example
Add middle ellipsis, Typography component adds suffix attribute

📝 Changelog

Language	Changelog
🇺🇸 English	Typography component adds suffix attribute, Fix title bug
🇨🇳 Chinese	Typography 组件增加 suffix 属性, 修复 title 的 bug

☑️ Self Check before Merge

Doc is updated/provided or not needed
Demo is updated/provided or not needed
TypeScript definition is updated/provided or not needed
Changelog is provided or not needed

View rendered components/typography/demo/suffix.md
View rendered components/typography/index.en-US.md
View rendered components/typography/index.zh-CN.md

tests-checker

Could you please add tests to make sure this change works as expected?

netlify · 2019-12-12T14:24:10Z

Deploy preview for ant-design ready!

Built with commit b342944

https://deploy-preview-20224--ant-design.netlify.com

codesandbox-ci · 2019-12-12T14:30:45Z

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit b342944:

Sandbox	Source
antd reproduction template	Configuration

codecov · 2019-12-13T02:31:28Z

Codecov Report

Merging #20224 into 4.0-prepare will increase coverage by <.01%.
The diff coverage is 100%.

@@               Coverage Diff               @@
##           4.0-prepare   #20224      +/-   ##
===============================================
+ Coverage        97.56%   97.56%   +<.01%     
===============================================
  Files              295      295              
  Lines             6852     6853       +1     
  Branches          1842     1873      +31     
===============================================
+ Hits              6685     6686       +1     
  Misses             167      167

Impacted Files	Coverage Δ
components/typography/Base.tsx	`100% <100%> (ø)`	⬆️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update e095f09...b342944. Read the comment docs.

zombieJ · 2019-12-17T02:49:26Z

components/typography/demo/suffix.md

+          <Paragraph ellipsis={{ rows, suffix: songForDrinking }} title={poetry + songForDrinking}>
+            <Text code strong>
+              将进酒
+            </Text>


留一个英文的例子就行了

zombieJ · 2019-12-17T02:51:00Z

components/typography/demo/suffix.md

+            </Text>
+            {poetry}
+          </Paragraph>
+          <Paragraph ellipsis={{ rows, expandable: true, suffix: hamlet }} title={article + hamlet}>


suffix: hamlet 直接写到这里，不用经过 state。让例子尽可能简单，用户易于理解。

zombieJ · 2019-12-17T02:53:55Z

为何 snapshot 会变？

components/date-picker/__tests__/__snapshots__/other.test.js.snap

zombieJ · 2019-12-20T03:17:19Z

components/typography/util.tsx

+        {(ellipsisStr + suffix)
+          .split('')
+          .reverse()
+          .join('')}


这段逻辑原因是什么？

如果后缀都溢出
那么后缀也需要开始省略，但是后缀省略是需要往前面省略的。
这样倒过来还是可以复用 measureText 方法

zombieJ · 2019-12-22T02:13:53Z

components/typography/Base.tsx

      // We move full content to outer element to avoid repeat read the content by accessibility
      textNode = (
-        <span title={String(children)} aria-hidden="true">
+        <span title={title} aria-hidden="true">


这里有 title 用 title，如果没有但是 children 是 string | number 则用 children。

zombieJ · 2019-12-23T03:24:43Z

components/typography/Base.tsx

    const { children } = this.props;
    if (!rows || rows < 0 || !this.content || expanded) return;

    // Do not measure if css already support ellipsis
-    if (this.canUseCSSEllipsis()) return;
+    if (this.canUseCSSEllipsis() && !suffix) return;


suffix 移入 canUseCSSEllipsis 方法内。

zombieJ · 2019-12-23T03:25:21Z

components/typography/Base.tsx

      // We move full content to outer element to avoid repeat read the content by accessibility
      textNode = (
-        <span title={String(children)} aria-hidden="true">
+        <span title={title || String(children)} aria-hidden="true">


这里和上面的 ariaLabel 已经一模一样了，直接放进来不用重复执行

linxianxi · 2020-04-13T02:02:27Z

希望后缀是 ReactNode 而不只是string

feat:Typography add suffix

ef1bddc

pr-triage bot added the PR: unreviewed label Dec 12, 2019

tests-checker bot suggested changes Dec 12, 2019

View reviewed changes

pr-triage bot removed the PR: unreviewed label Dec 12, 2019

pr-triage bot added the PR: reviewed-changes-requested label Dec 12, 2019

zouxiaomingya added 2 commits December 13, 2019 10:10

feat:run test

b22309f

fix:lint

642ca04

pr-triage bot added PR: unreviewed and removed PR: reviewed-changes-requested labels Dec 13, 2019

zouxiaomingya changed the title ~~feat:Typography add suffix~~ feat: Typography add suffix Dec 13, 2019

auto-add-label bot added the enhancement label Dec 13, 2019

weekly-digest bot mentioned this pull request Dec 15, 2019

Weekly Digest (8 December, 2019 - 15 December, 2019) #20267

Closed

zombieJ reviewed Dec 17, 2019

View reviewed changes

邹明 added 5 commits December 17, 2019 11:40

feat: update suffix example

08ceb4b

feat: update test

559b780

fix: updateupdateSnapshot

ab18439

fix: upate test

c114e68

run lint

3e8afd6

zombieJ reviewed Dec 19, 2019

View reviewed changes

components/date-picker/__tests__/__snapshots__/other.test.js.snap Outdated Show resolved Hide resolved

Merge remote-tracking branch 'upstream/4.0-prepare' into 4.0-prepare

991b2f8

zombieJ reviewed Dec 20, 2019

View reviewed changes

邹明 added 2 commits December 20, 2019 17:10

feat: measureSuffixText

41bdb75

feat: suffix 不可省略

e095f09

zombieJ reviewed Dec 22, 2019

View reviewed changes

Merge remote-tracking branch 'upstream/4.0-prepare' into 4.0-prepare

a8eb7cc

zouxiaomingya added 2 commits December 22, 2019 12:18

fix: title

8054c7c

fix: update node_modules

d41f954

zombieJ reviewed Dec 23, 2019

View reviewed changes

fix: change title type

b342944

zombieJ merged commit 1ebf5fa into ant-design:4.0-prepare Dec 24, 2019

pr-triage bot added PR: merged and removed PR: unreviewed labels Dec 24, 2019

hsuanxyz mentioned this pull request Dec 31, 2019

[Typography] support suffix property NG-ZORRO/ng-zorro-antd#4620

Closed

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat: Typography add suffix #20224

feat: Typography add suffix #20224

zouxiaomingya commented Dec 12, 2019 •

edited

Loading

tests-checker bot left a comment

netlify bot commented Dec 12, 2019 •

edited

Loading

codesandbox-ci bot commented Dec 12, 2019 •

edited

Loading

codecov bot commented Dec 13, 2019 •

edited

Loading

zombieJ Dec 17, 2019

zombieJ Dec 17, 2019

zombieJ commented Dec 17, 2019

zombieJ Dec 20, 2019

zouxiaomingya Dec 20, 2019

zombieJ Dec 22, 2019

zombieJ Dec 23, 2019

zombieJ Dec 23, 2019

linxianxi commented Apr 13, 2020

feat: Typography add suffix #20224

feat: Typography add suffix #20224

Conversation

zouxiaomingya commented Dec 12, 2019 • edited Loading

🤔 This is a ...

🔗 Related issue link

💡 Background and solution

📝 Changelog

☑️ Self Check before Merge

tests-checker bot left a comment

Choose a reason for hiding this comment

netlify bot commented Dec 12, 2019 • edited Loading

codesandbox-ci bot commented Dec 12, 2019 • edited Loading

codecov bot commented Dec 13, 2019 • edited Loading

Codecov Report

zombieJ Dec 17, 2019

Choose a reason for hiding this comment

zombieJ Dec 17, 2019

Choose a reason for hiding this comment

zombieJ commented Dec 17, 2019

zombieJ Dec 20, 2019

Choose a reason for hiding this comment

zouxiaomingya Dec 20, 2019

Choose a reason for hiding this comment

zombieJ Dec 22, 2019

Choose a reason for hiding this comment

zombieJ Dec 23, 2019

Choose a reason for hiding this comment

zombieJ Dec 23, 2019

Choose a reason for hiding this comment

linxianxi commented Apr 13, 2020

zouxiaomingya commented Dec 12, 2019 •

edited

Loading

netlify bot commented Dec 12, 2019 •

edited

Loading

codesandbox-ci bot commented Dec 12, 2019 •

edited

Loading

codecov bot commented Dec 13, 2019 •

edited

Loading