Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: 馃啎 new Space component #22363

Merged
merged 12 commits into from Mar 22, 2020
Merged

feat: 馃啎 new Space component #22363

merged 12 commits into from Mar 22, 2020

Conversation

shaodahong
Copy link
Member

@shaodahong shaodahong commented Mar 18, 2020

馃 This is a ...

  • New feature
  • Bug fix
  • Site / document update
  • Component style update
  • TypeScript definition update
  • Refactoring
  • Code style optimization
  • Test Case
  • Branch merge
  • Other (about what?)

馃敆 Related issue link

Close #19860

馃挕 Background and solution

馃摑 Changelog

Language Changelog
馃嚭馃嚫 English new Space component
馃嚚馃嚦 Chinese 鏂扮殑 Space 缁勪欢

鈽戯笍 Self Check before Merge

鈿狅笍 Please check all items below before review. 鈿狅笍

  • 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/space/demo/base.md
View rendered components/space/demo/vertical.md
View rendered components/space/index.en-US.md
View rendered components/space/index.zh-CN.md

@shaodahong shaodahong changed the title feat: 馃尮 new Space component feat: new Space component Mar 18, 2020
@ant-design-bot
Copy link
Contributor

ant-design-bot commented Mar 18, 2020

@shaodahong shaodahong changed the title feat: new Space component feat: 馃啎 new Space component Mar 18, 2020
@afc163 afc163 requested a review from zombieJ Mar 18, 2020
@afc163
Copy link
Member

afc163 commented Mar 18, 2020

wow~

@zombieJ
Copy link
Member

zombieJ commented Mar 18, 2020

wow~ +1

@yoyo837
Copy link
Contributor

yoyo837 commented Mar 18, 2020

wow~ +2

const len = items.length;

return (
<div className={cn} {...otherProps}>
Copy link
Contributor

@yoyo837 yoyo837 Mar 18, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

鍙笉鍙互鏄 鎸備竴灞侰onfigConsumer 淇敼size绛夊煎線涓嬩紶閫掔殑鏂瑰紡, 骞朵笖涓嶄骇鐢熼澶朌OM鐨勶紵

Copy link
Member Author

@shaodahong shaodahong Mar 18, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

鍙互涓嶄骇鐢熼澶栫殑 DOM 浣嗘槸鎰熻涓嶅お濂斤紝涓嶇鍚堢粍浠剁殑瑙勮寖锛岀敤鎴疯缃 <Space style className></Space> 鍙戠幇涓嶇敓鏁

Copy link
Member Author

@shaodahong shaodahong Mar 18, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

鎴戣嚜宸遍」鐩緢鏃╁氨灏佽浜 Space 缁勪欢锛屽瀹為檯寮鍙戞彁鏁堟湁甯姪锛屽挨鍏惰缃 Button 鐨勬椂鍊欙紝浣嗘槸鏈変竴涓己鐐癸紝灏辨槸涓嶆敮鎸 <Popconfirm /> 绛夎繖绉嶅寘瑁圭粍浠

Copy link
Contributor

@yoyo837 yoyo837 Mar 18, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

鎴戝杩欎釜缁勪欢鐨勭悊瑙e氨鏄竴涓眬閮ㄧ殑ConfigContext, 鑷充簬className锛屽氨濂芥瘮Fragment閭f牱涓嶆帴鍙梒lassName鍛椼

Copy link
Member

@afc163 afc163 Mar 19, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

灏ゅ叾璁剧疆 Button 鐨勬椂鍊欙紝浣嗘槸鏈変竴涓己鐐癸紝灏辨槸涓嶆敮鎸 绛夎繖绉嶅寘瑁圭粍浠

鍙互缁欒繖浜涚粍浠跺姞涓 style 灞炴т紶閫掑埌 children 涓娿

Copy link
Member

@zombieJ zombieJ Mar 19, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

涓嶅お鎺ㄨ崘鐩存帴娉ㄥ叆鏍峰紡锛屾垜鐨勬兂娉曟槸澶栧眰鐢 inline-flex 淇濇寔鍐呰仈锛屽唴閮ㄩ澶栦竴涓 dom 鍋 maring-cell 鏉ュ鐞嗐傝繖鏍峰彲浠ヨ鐩栭偅浜涗笉鑳芥敞鍏ョ殑鎯呭喌銆

<Space>
  2333
  <Button />
  6666
</Space>

Copy link
Member Author

@shaodahong shaodahong Mar 19, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

澶栧眰濡傛灉璁剧疆 inline-flex 浼氬共鎵板埌鍐呴儴鐨勬牱寮忥紝闇瑕佸閿 child 鏄 鍧楁垨鑰呰锛屽鏋滀笉鏄 element 鎴戜細鍖呬釜 span

Copy link
Member

@zombieJ zombieJ Mar 20, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

鎴戠殑鐞嗚В Space 灏辨槸涓涓唴鑱旂殑鍏冪礌锛屼綘璇寸殑骞叉壈鎸囩殑鏄紵

Copy link
Member Author

@shaodahong shaodahong Mar 20, 2020

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

鍡紝鎯充簡涓嬩綘鏄鐨勶紝涓嶈兘瑕嗙洊鐨勭粍浠舵湁鐐瑰锛屼竴寮濮嬫兂鐨勫共鎵版槸鍐呴儴鍙兘鏄釜鍧楃骇鍏冪礌锛屽悗鍙版兂鍧楃骇鍏冪礌娌″繀瑕佸寘鍦ㄩ噷闈紝涓嶉渶瑕佽冭檻锛屾垜鏀逛簡

@codesandbox-ci
Copy link

codesandbox-ci bot commented Mar 18, 2020

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 1169090767635374d51b4e559cc68287f2ebb695:

Sandbox Source
antd reproduction template Configuration

@codesandbox-ci
Copy link

codesandbox-ci bot commented Mar 18, 2020

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 42a48ba4a246fc12fb33e99fde11aa2284f6e052:

Sandbox Source
antd reproduction template Configuration

@codesandbox-ci
Copy link

codesandbox-ci bot commented Mar 18, 2020

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 cab1c8e:

Sandbox Source
antd reproduction template Configuration

@AshoneA
Copy link
Contributor

AshoneA commented Mar 19, 2020

 .space > * {
   margin-right: 10px;
 }

浠ュ墠鎴戦兘鏄繖涔堣В鍐崇殑...

@Nomnomburger
Copy link

Nomnomburger commented Mar 19, 2020

Yay I needed this all along! :)

@afc163
Copy link
Member

afc163 commented Mar 19, 2020

  • Add demo for large | default | small size.
  • Add demo for custom number size.

@afc163
Copy link
Member

afc163 commented Mar 19, 2020

rebase 涓涓 feature 鍗冲彲淇 ci銆

@codecov
Copy link

codecov bot commented Mar 19, 2020

Codecov Report

Merging #22363 into feature will increase coverage by <.01%.
The diff coverage is 100%.

Impacted file tree graph

@@             Coverage Diff             @@
##           feature   #22363      +/-   ##
===========================================
+ Coverage    98.11%   98.12%   +<.01%     
===========================================
  Files          359      360       +1     
  Lines         7173     7196      +23     
  Branches      1916     1968      +52     
===========================================
+ Hits          7038     7061      +23     
  Misses         135      135
Impacted Files Coverage 螖
components/config-provider/context.tsx 100% <酶> (酶) 猬嗭笍
components/config-provider/index.tsx 95.83% <酶> (酶) 猬嗭笍
components/index.tsx 100% <酶> (酶) 猬嗭笍
components/space/index.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 86946f4...cab1c8e. Read the comment docs.

components/space/index.tsx Outdated Show resolved Hide resolved
@shaodahong
Copy link
Member Author

shaodahong commented Mar 20, 2020

With like Fragment

<Space>
  233
  {hasAuth && (
    <Space>
      <Button />
      <Button />
    </Space>
  )}
  666
</Space>

components/space/index.tsx Outdated Show resolved Hide resolved
components/space/index.tsx Outdated Show resolved Hide resolved
components/space/index.zh-CN.md Outdated Show resolved Hide resolved
@shaodahong
Copy link
Member Author

shaodahong commented Mar 21, 2020

Done.

components/space/index.tsx Outdated Show resolved Hide resolved
components/space/style/index.less Outdated Show resolved Hide resolved
@zombieJ
Copy link
Member

zombieJ commented Mar 21, 2020

LGTM

@shaodahong shaodahong merged commit b8109bd into ant-design:feature Mar 22, 2020
14 of 16 checks passed
@shaodahong shaodahong deleted the space branch Mar 22, 2020
@zombieJ zombieJ mentioned this pull request Mar 29, 2020
10 tasks
@Airkro
Copy link
Contributor

Airkro commented May 6, 2020

 .space > * {
   margin-right: 10px;
 }

浠ュ墠鎴戦兘鏄繖涔堣В鍐崇殑...

璧峰垵鍏夌湅 releases锛屾垜浠ヤ负 Space 浼氭槸 Divider 閭f牱鐨勫瓙缁勪欢锛岃兘鍦 Row 褰撲腑浣跨敤锛屼互浠f浛寰堝鐢ㄦ牱寮忓浐鍖栫殑 margin锛屼緥濡 model/result 鐨勬寜閽棿璺濄

@afc163
Copy link
Member

afc163 commented May 6, 2020

@Airkro 杩欎篃鏄渶寮濮嬭璁虹殑鍏朵腑涓绉 API 鐨勫舰寮忋備笉杩囨垜涓汉涓嶅お鑳芥帴鍙楃被浼间笅闈㈢殑绱姞 Space 鐨勫啓娉曪細

<Button>鎸夐挳</Button>
<Space />
<Space />
<Button>鎸夐挳</Button>
<Space />
<Button>鎸夐挳</Button>
<Button>鎸夐挳</Button>
<Space />
<Space />
<Space />
<Button>鎸夐挳</Button>

@Airkro
Copy link
Contributor

Airkro commented May 6, 2020

@afc163 濡傛灉涓嶈繘琛岀疮鍔狅紝鍙娇鐢ㄤ竴涓紝鎴栬鏈変娇鐢ㄤ环鍊硷紝鍥犱负缁勪欢涔嬮棿瑕佸姞 margin 鐨勫湴鏂瑰緢澶氥備絾杩樻槸浜х敓浜嗕笉蹇呰鐨勮妭鐐癸紝濂藉儚骞朵笉鍒掔畻銆

鍙﹀寤鸿灏 Divider 鍦ㄦ枃妗i噷鐨勪綅缃Щ鍔ㄥ埌 鈥 甯冨眬 鈥

@afc163
Copy link
Member

afc163 commented May 6, 2020

鍙﹀寤鸿灏 Divider 鍦ㄦ枃妗i噷鐨勪綅缃Щ鍔ㄥ埌 鈥 甯冨眬 鈥

鏉ヤ釜 PR~

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

8 participants