source/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2026-02-16 22:32:29 +08:00
Code Issues Packages Projects Releases Wiki Activity

Compare commits

base: source:2.11.2
Branches Tags
source:master source:test-2026-02-16 source:GenerateStyle-type source:get-prop-support-default source:change-styles-classnames-ts-1 source:feature source:copilot/fix-mention-component-enter-key source:copilot/fix-tooltip-appearance-issue source:typography-semantic source:test-size-feature-cascader-dropdown-clear-icon source:copilot/fix-button-loading-icon-position source:docs/themer source:copilot/fix-disabled-input-border-color source:gh-pages source:change-styles-classnames-ts-v2 source:copilot/sub-pr-56823 source:change-styles-classnames-ts source:select-snapshot source:guidelines source:fix-slider-tooltip source:theme source:copilot/use-gencssvar-hook-for-css-vars source:copilot/use-gencssvar-hook-css-variables source:5.x-stable source:wuxh/try-optimize source:table-support-auto-index-2 source:table-support-auto-index source:3.x-stable source:prettier source:copilot/sub-pr-56288-again source:chore/scripts source:wuxh/improve-message-ts source:4.x-stable source:2.x-stable source:0.12-stable source:1.x-stable
source:6.3.0 source:6.2.3 source:5.30.0-guidelines-alpha.1 source:6.2.2 source:6.2.1 source:6.2.0 source:6.1.4 source:6.1.3 source:6.1.2 source:5.29.3 source:6.1.1 source:5.29.2 source:6.1.0 source:6.0.1 source:6.0.0 source:6.0.0-alpha.5 source:5.29.1 source:5.29.0 source:5.28.1 source:6.0.0-alpha.4 source:5.28.0 source:5.27.6 source:5.27.5 source:6.0.0-alpha.3 source:5.27.4 source:5.27.3 source:5.27.2 source:5.27.1 source:6.0.0-alpha.2 source:5.27.0 source:5.26.7 source:5.26.6 source:5.26.5 source:5.26.4 source:6.0.0-alpha.1 source:5.26.3 source:6.0.0-alpha.0 source:5.26.2 source:5.26.1 source:5.26.0 source:5.26.0-alpha.0 source:5.25.4 source:5.25.3 source:5.25.2 source:5.25.1 source:5.25.0 source:5.24.9 source:5.24.8 source:5.24.7 source:5.24.6 source:5.24.5 source:5.24.4 source:5.24.3 source:5.24.2 source:5.24.1 source:5.24.0 source:5.23.4 source:5.23.3 source:5.23.2 source:5.23.1 source:5.23.0 source:5.22.7 source:5.22.6 source:5.22.5 source:5.22.4 source:5.22.3 source:5.22.2 source:5.22.1 source:5.22.0 source:5.21.6 source:5.21.5 source:5.21.4 source:5.21.3 source:5.21.2 source:5.21.1 source:5.21.0 source:5.20.6 source:5.20.5 source:5.20.4 source:5.20.3 source:5.20.2 source:5.20.1 source:5.20.0 source:5.19.4 source:5.19.3 source:5.19.2 source:5.19.1 source:5.19.0 source:5.18.3 source:5.18.2 source:5.18.1 source:5.18.0 source:5.17.4 source:5.17.3 source:5.17.2 source:5.17.1 source:5.17.0 source:5.16.5 source:5.16.4 source:5.16.3 source:5.16.2 source:5.16.1 source:5.16.0 source:5.15.4 source:4.24.16 source:5.15.3 source:5.15.2 source:5.15.1 source:5.15.0 source:5.14.2 source:5.14.1 source:5.14.0 source:5.13.3 source:5.13.2 source:5.13.1 source:5.13.0 source:5.12.8 source:5.12.7 source:5.12.6 source:5.12.5 source:5.12.4 source:5.12.3 source:5.12.2 source:5.12.1 source:5.12.0 source:5.11.5 source:5.11.4 source:5.11.3-alpha.1 source:5.11.3 source:5.11.3-alpha.0 source:4.24.15 source:5.11.2 source:5.11.1 source:5.11.0 source:5.10.3 source:5.10.2 source:5.10.1 source:5.10.0 source:5.9.4 source:5.9.3 source:5.9.2 source:5.9.1 source:5.9.0 source:4.24.14 source:5.8.6 source:5.8.5 source:5.8.4 source:5.8.3 source:5.8.2 source:4.24.13 source:5.8.1 source:5.8.0 source:5.7.3 source:5.7.2 source:5.7.1 source:5.7.0 source:5.6.4 source:4.24.12 source:4.24.11 source:5.6.3 source:5.6.2 source:5.6.2-alpha.0 source:5.6.1 source:5.6.0 source:5.5.2 source:5.5.1 source:5.6.0-alpha.0 source:5.5.0 source:5.4.7 source:4.24.10 source:5.4.6 source:5.4.5 source:5.4.4 source:4.24.9 source:5.4.3 source:5.4.2 source:5.4.1 source:5.4.0 source:5.3.3 source:5.3.2 source:5.3.1 source:5.3.0 source:5.2.3 source:5.2.2 source:5.2.1 source:4.24.8 source:5.2.0 source:5.1.7 source:5.1.6 source:5.1.5 source:5.1.4 source:5.1.3 source:5.1.2 source:4.24.7 source:5.1.1 source:4.24.6 source:5.1.0 source:5.0.7 source:5.0.6 source:5.0.5 source:4.24.5 source:5.0.4 source:5.0.3 source:5.0.2 source:4.24.4 source:5.0.1 source:5.0.0 source:5.0.0-rc.3 source:5.0.0-rc.2 source:4.24.3 source:5.0.0-rc.1 source:5.0.0-rc.0 source:5.0.0-beta.2 source:5.0.0-beta.1 source:4.24.2 source:5.0.0-beta.0 source:4.24.1 source:5.0.0-alpha.34 source:4.24.0 source:5.0.0-alpha.33 source:5.0.0-alpha.32 source:5.0.0-alpha.31 source:5.0.0-alpha.4 source:5.0.0-alpha.3 source:4.23.6 source:5.0.0-alpha.2 source:4.23.5 source:5.0.0-alpha.1 source:4.23.4 source:5.0.0-alpha.0 source:5.0.0-experimental.30 source:4.23.3 source:5.0.0-experimental.29 source:5.0.0-experimental.28 source:5.0.0-experimental.27 source:5.0.0-experimental.26 source:5.0.0-experimental.25 source:4.23.2 source:5.0.0-experimental.24 source:4.23.1 source:5.0.0-experimental.23 source:4.23.0 source:5.0.0-experimental.22 source:5.0.0-experimental.21 source:4.22.8 source:5.0.0-experimental.20 source:4.22.7 source:5.0.0-experimental.19 source:5.0.0-experimental.18 source:5.0.0-experimental.17 source:4.22.6 source:5.0.0-experimental.16 source:4.22.5 source:4.22.4 source:5.0.0-experimental.15 source:5.0.0-experimental.14 source:5.0.0-experimental.13 source:5.0.0-experimental.12 source:5.0.0-experimental.11 source:4.22.3 source:4.22.2 source:5.0.0-experimental.10 source:4.22.1 source:4.22.0 source:5.0.0-experimental.9 source:5.0.0-experimental.8 source:5.0.0-experimental.7 source:5.0.0-experimental.6 source:4.21.7 source:5.0.0-experimental.5 source:4.21.6 source:5.0.0-experimental.4 source:4.21.5 source:4.21.4 source:4.21.3 source:4.21.2 source:4.21.1 source:4.21.0 source:4.20.7 source:4.20.6 source:4.20.5 source:4.20.4 source:4.20.3 source:4.20.2 source:4.20.1 source:4.20.0 source:4.20.0-alpha.1 source:4.20.0-alpha.0 source:4.19.5 source:4.19.5-alpha.0 source:4.19.4 source:4.19.3 source:4.19.2 source:4.19.1 source:4.19.1-alpha.0 source:4.19.0 source:4.18.9 source:4.18.8 source:4.18.7 source:4.18.6 source:4.18.5 source:4.18.4 source:4.18.3 source:4.18.2 source:4.18.1 source:4.18.0 source:4.17.4 source:4.17.3 source:4.17.2 source:4.17.1 source:4.17.1-alpha.1 source:4.17.1-alpha.0 source:4.17.0 source:4.17.0-alpha.10 source:4.17.0-alpha.9 source:4.17.0-alpha.8 source:4.17.0-alpha.7 source:4.17.0-alpha.6 source:4.17.0-alpha.5 source:4.17.0-alpha.4 source:4.17.0-alpha.3 source:4.17.0-alpha.2 source:4.17.0-alpha.1 source:4.17.0-alpha.0 source:4.16.13 source:4.16.12 source:4.16.11 source:4.16.10 source:4.16.9 source:4.16.8 source:4.16.7 source:4.16.6 source:4.16.5 source:4.16.3 source:4.16.2 source:4.16.1 source:4.16.0 source:4.15.6 source:4.15.5 source:4.16.0-alpha.1 source:4.16.0-alpha.0 source:4.15.4 source:4.15.3 source:4.15.3-alpha.0 source:4.15.2 source:4.15.1 source:4.15.0 source:4.14.1 source:4.14.0 source:4.13.1 source:4.13.0 source:4.12.3 source:4.12.2 source:4.12.1 source:4.12.0 source:4.11.3 source:4.11.2 source:4.11.1 source:4.10.3 source:4.10.2 source:4.10.1 source:4.10.0 source:4.9.4 source:4.9.3 source:4.9.2 source:4.9.1 source:4.9.0 source:4.8.6 source:4.8.5 source:4.8.4 source:4.8.3 source:4.8.2 source:4.8.1 source:4.8.0 source:3.26.20 source:3.26.19 source:4.7.3 source:4.7.2 source:4.7.1 source:4.7.0 source:4.6.6 source:4.6.5 source:4.6.4 source:4.6.3 source:4.6.2 source:4.6.1 source:4.6.0 source:4.5.4 source:4.5.3 source:4.5.2 source:4.5.1 source:4.5.0 source:4.4.3 source:4.4.2 source:4.4.1 source:4.4.0 source:4.3.5 source:3.26.18 source:4.3.4 source:4.3.3 source:4.3.2 source:4.3.1 source:4.3.0 source:4.2.5 source:4.2.4 source:4.2.3 source:3.26.17 source:4.2.2 source:4.2.1 source:4.2.0 source:3.26.16 source:4.1.5 source:4.1.4 source:4.1.3 source:4.1.2 source:4.1.1 source:3.26.15 source:4.1.0 source:3.26.14 source:4.0.4 source:4.0.3 source:4.0.2 source:3.26.13 source:4.0.1 source:4.0.0 source:4.0.0-rc.6 source:3.26.12 source:3.26.11 source:4.0.0-rc.5 source:3.26.10 source:4.0.0-rc.4 source:3.26.9 source:3.26.8 source:4.0.0-rc.3 source:4.0.0-rc.2 source:3.26.7 source:4.0.0-rc.1 source:4.0.0-rc.0 source:3.26.6 source:3.26.5 source:4.0.0-beta.1 source:3.26.4 source:3.26.3 source:4.0.0-beta.0 source:3.26.2 source:3.26.1 source:4.0.0-alpha.14 source:4.0.0-alpha.13 source:4.0.0-alpha.12 source:3.26.0 source:4.0.0-alpha.11 source:4.0.0-alpha.10 source:3.25.3 source:3.25.2 source:4.0.0-alpha.9 source:3.25.1 source:4.0.0-alpha.8 source:3.25.0 source:3.24.3 source:3.24.2 source:3.24.1 source:3.24.0 source:4.0.0-alpha.7 source:3.23.6 source:3.23.5 source:4.0.0-alpha.6 source:4.0.0-alpha.5 source:3.23.4 source:4.0.0-alpha.4 source:3.23.3 source:3.23.2 source:3.23.1 source:3.23.0 source:4.0.0-alpha.3 source:3.22.2 source:3.23.0-beta.0 source:3.22.1 source:3.22.0 source:4.0.0-alpha.2 source:4.0.0-alpha.1 source:3.21.4 source:3.21.3 source:3.21.2 source:3.21.1 source:3.21.0 source:4.0.0-alpha.0 source:3.20.7 source:3.20.6 source:3.20.5 source:3.20.4 source:3.20.3 source:3.20.2 source:3.20.1 source:3.20.0 source:3.19.8 source:3.19.7 source:3.19.6 source:3.19.5 source:3.19.4 source:3.19.3 source:3.19.2 source:3.19.1 source:3.19.0 source:3.18.2 source:3.18.1 source:3.18.0 source:3.17.0 source:3.16.6 source:3.16.5 source:3.16.4 source:3.16.3 source:3.16.2 source:3.16.1 source:3.16.0 source:3.15.2 source:3.15.1 source:3.15.0 source:3.14.1 source:3.14.0 source:3.13.6 source:3.13.5 source:3.13.4 source:3.13.3 source:3.13.2 source:3.13.1 source:3.13.0 source:3.12.4 source:3.12.3 source:3.12.2 source:3.12.1 source:3.12.0 source:3.9.4 source:3.10.10 source:3.11.6 source:3.11.5 source:3.11.4 source:3.11.4-beta.1 source:3.11.4-beta.0 source:3.11.3 source:3.11.2 source:3.11.1 source:3.11.0 source:3.10.9 source:3.10.8 source:3.10.7 source:3.10.6 source:3.10.5 source:3.10.4 source:3.10.3 source:3.10.2 source:3.10.1 source:3.10.0 source:3.9.3 source:3.9.2 source:3.9.1 source:3.9.0 source:3.9.0-beta.5 source:3.9.0-beta.6 source:3.9.0-beta.4 source:3.9.0-beta.2 source:3.8.4 source:3.8.3 source:3.9.0-beta.0 source:3.8.2 source:3.8.1 source:3.8.0 source:3.7.3 source:3.7.2 source:3.7.1 source:3.7.0 source:3.6.6 source:3.6.5 source:3.6.4 source:3.6.3 source:3.6.2 source:3.6.0 source:3.6.1 source:3.5.4 source:3.5.3 source:3.5.2 source:3.5.1 source:3.5.0 source:3.4.5 source:3.4.4 source:2.13.14 source:3.4.3 source:3.4.2 source:3.4.1 source:3.4.0 source:3.3.3 source:3.3.2 source:3.3.1 source:3.3.0 source:2.13.13 source:3.2.3 source:2.13.12 source:3.2.2 source:3.2.1 source:3.2.0 source:3.1.6 source:3.1.5 source:3.1.4 source:3.1.3 source:3.1.2 source:3.1.1 source:3.1.0 source:3.0.3 source:3.0.2 source:3.0.1 source:3.0.0 source:2.13.11 source:3.0.0-rc.4 source:3.0.0-rc.3 source:3.0.0-rc.2 source:3.0.0-rc.1 source:3.0.0-beta.9 source:3.0.0-beta.8 source:3.0.0-beta.7 source:2.13.10 source:3.0.0-beta.6 source:2.13.9 source:3.0.0-beta.5 source:3.0.0-beta.4 source:3.0.0-beta.3 source:3.0.0-beta.2 source:3.0.0-beta.1 source:2.13.8 source:3.0.0-alpha.24 source:3.0.0-alpha.23 source:3.0.0-alpha.22 source:3.0.0-alpha.21 source:3.0.0-alpha.20 source:3.0.0-alpha.19 source:3.0.0-alpha.18 source:2.13.7 source:3.0.0-alpha.17 source:3.0.0-alpha.16 source:3.0.0-alpha.15 source:2.13.6 source:2.13.5 source:3.0.0-alpha.14 source:2.13.4 source:3.0.0-alpha.13 source:3.0.0-alpha.12 source:3.0.0-alpha.11 source:2.13.3 source:2.13.2 source:2.13.1 source:3.0.0-alpha.10 source:3.0.0-alpha.9 source:3.0.0-alpha.8 source:3.0.0-alpha.7 source:3.0.0-alpha.6 source:2.13.0 source:2.12.8 source:3.0.0-alpha.5 source:3.0.0-alpha.4 source:2.12.7 source:3.0.0-alpha.3 source:3.0.0-alpha.2 source:2.12.6 source:3.0.0-alpha.1 source:3.0.0-alpha.0 source:3.0.0-alpha0 source:2.12.5 source:2.12.4 source:2.12.3 source:2.12.2 source:2.12.1 source:2.12.1-beta.3 source:2.12.1-beta.2 source:2.12.1-beta.1 source:2.12.1-beta.0 source:2.12.0 source:2.11.2 source:2.11.1 source:2.12.0-beta1 source:2.11.0 source:2.10.4 source:2.10.3 source:2.10.2 source:2.10.1 source:2.10.0 source:2.9.3 source:2.9.2 source:2.9.1 source:2.9.0 source:2.8.3 source:2.8.2 source:2.8.1 source:2.8.0 source:2.7.4 source:2.7.3 source:2.7.2 source:2.7.1 source:2.7.0 source:2.6.4 source:2.6.3 source:2.6.2 source:1.11.6 source:1.11.5 source:2.6.1 source:2.6.0 source:2.5.3 source:2.5.2 source:2.5.1 source:2.5.0 source:1.11.4 source:1.11.3 source:2.4.3 source:2.4.2 source:2.4.1 source:2.4.0 source:2.3.2 source:2.3.1 source:2.3.0 source:2.2.1 source:2.2.0 source:2.1.0 source:2.0.1 source:2.0.0 source:2.0.0-beta.13 source:1.11.2 source:2.0.0-beta.12 source:2.0.0-beta.11 source:2.0.0-beta.10 source:2.0.0-beta.9 source:2.0.0-beta.8 source:2.0.0-beta.7 source:2.0.0-beta.6 source:2.0.0-beta.5 source:2.0.0-beta.4 source:1.11.1 source:2.0.0-beta.3 source:2.0.0-beta.2 source:2.0.0-beta.1 source:1.11.0 source:1.10.0 source:1.9.1 source:1.9.0 source:1.8.0 source:1.7.0 source:1.6.5 source:1.6.4 source:1.6.3 source:1.6.2 source:1.6.1 source:1.6.0 source:1.5.1 source:1.5.0 source:1.4.1 source:1.4.0 source:1.3.2 source:1.3.1 source:1.3.0 source:1.2.1 source:1.2.0 source:1.1.0 source:1.0.1 source:1.0.0 source:0.12.17 source:0.12.16 source:0.12.15 source:0.12.14 source:0.12.13 source:0.12.12 source:0.12.11 source:0.12.9 source:0.12.8 source:0.12.7 source:0.12.6 source:0.12.5 source:0.12.4 source:0.12.3 source:0.12.2 source:0.12.1 source:0.12.0 source:0.11.3 source:resource source:0.10.5 source:0.11.2 source:0.11.1 source:0.11.0 source:0.10.4 source:0.10.3 source:0.10.2 source:0.10.1 source:0.10.0 source:0.9.4 source:0.9.2 source:0.9.1 source:0.9.0 source:0.8.0 source:0.7.3 source:0.7.2 source:0.7.1 source:0.7.0
..
compare: source:2.4.1
Branches Tags
source:test-2026-02-16 source:GenerateStyle-type source:master source:get-prop-support-default source:change-styles-classnames-ts-1 source:feature source:copilot/fix-mention-component-enter-key source:copilot/fix-tooltip-appearance-issue source:typography-semantic source:test-size-feature-cascader-dropdown-clear-icon source:copilot/fix-button-loading-icon-position source:docs/themer source:copilot/fix-disabled-input-border-color source:gh-pages source:change-styles-classnames-ts-v2 source:copilot/sub-pr-56823 source:change-styles-classnames-ts source:select-snapshot source:guidelines source:fix-slider-tooltip source:theme source:copilot/use-gencssvar-hook-for-css-vars source:copilot/use-gencssvar-hook-css-variables source:5.x-stable source:wuxh/try-optimize source:table-support-auto-index-2 source:table-support-auto-index source:3.x-stable source:prettier source:copilot/sub-pr-56288-again source:chore/scripts source:wuxh/improve-message-ts source:4.x-stable source:2.x-stable source:0.12-stable source:1.x-stable
source:6.3.0 source:6.2.3 source:5.30.0-guidelines-alpha.1 source:6.2.2 source:6.2.1 source:6.2.0 source:6.1.4 source:6.1.3 source:6.1.2 source:5.29.3 source:6.1.1 source:5.29.2 source:6.1.0 source:6.0.1 source:6.0.0 source:6.0.0-alpha.5 source:5.29.1 source:5.29.0 source:5.28.1 source:6.0.0-alpha.4 source:5.28.0 source:5.27.6 source:5.27.5 source:6.0.0-alpha.3 source:5.27.4 source:5.27.3 source:5.27.2 source:5.27.1 source:6.0.0-alpha.2 source:5.27.0 source:5.26.7 source:5.26.6 source:5.26.5 source:5.26.4 source:6.0.0-alpha.1 source:5.26.3 source:6.0.0-alpha.0 source:5.26.2 source:5.26.1 source:5.26.0 source:5.26.0-alpha.0 source:5.25.4 source:5.25.3 source:5.25.2 source:5.25.1 source:5.25.0 source:5.24.9 source:5.24.8 source:5.24.7 source:5.24.6 source:5.24.5 source:5.24.4 source:5.24.3 source:5.24.2 source:5.24.1 source:5.24.0 source:5.23.4 source:5.23.3 source:5.23.2 source:5.23.1 source:5.23.0 source:5.22.7 source:5.22.6 source:5.22.5 source:5.22.4 source:5.22.3 source:5.22.2 source:5.22.1 source:5.22.0 source:5.21.6 source:5.21.5 source:5.21.4 source:5.21.3 source:5.21.2 source:5.21.1 source:5.21.0 source:5.20.6 source:5.20.5 source:5.20.4 source:5.20.3 source:5.20.2 source:5.20.1 source:5.20.0 source:5.19.4 source:5.19.3 source:5.19.2 source:5.19.1 source:5.19.0 source:5.18.3 source:5.18.2 source:5.18.1 source:5.18.0 source:5.17.4 source:5.17.3 source:5.17.2 source:5.17.1 source:5.17.0 source:5.16.5 source:5.16.4 source:5.16.3 source:5.16.2 source:5.16.1 source:5.16.0 source:5.15.4 source:4.24.16 source:5.15.3 source:5.15.2 source:5.15.1 source:5.15.0 source:5.14.2 source:5.14.1 source:5.14.0 source:5.13.3 source:5.13.2 source:5.13.1 source:5.13.0 source:5.12.8 source:5.12.7 source:5.12.6 source:5.12.5 source:5.12.4 source:5.12.3 source:5.12.2 source:5.12.1 source:5.12.0 source:5.11.5 source:5.11.4 source:5.11.3-alpha.1 source:5.11.3 source:5.11.3-alpha.0 source:4.24.15 source:5.11.2 source:5.11.1 source:5.11.0 source:5.10.3 source:5.10.2 source:5.10.1 source:5.10.0 source:5.9.4 source:5.9.3 source:5.9.2 source:5.9.1 source:5.9.0 source:4.24.14 source:5.8.6 source:5.8.5 source:5.8.4 source:5.8.3 source:5.8.2 source:4.24.13 source:5.8.1 source:5.8.0 source:5.7.3 source:5.7.2 source:5.7.1 source:5.7.0 source:5.6.4 source:4.24.12 source:4.24.11 source:5.6.3 source:5.6.2 source:5.6.2-alpha.0 source:5.6.1 source:5.6.0 source:5.5.2 source:5.5.1 source:5.6.0-alpha.0 source:5.5.0 source:5.4.7 source:4.24.10 source:5.4.6 source:5.4.5 source:5.4.4 source:4.24.9 source:5.4.3 source:5.4.2 source:5.4.1 source:5.4.0 source:5.3.3 source:5.3.2 source:5.3.1 source:5.3.0 source:5.2.3 source:5.2.2 source:5.2.1 source:4.24.8 source:5.2.0 source:5.1.7 source:5.1.6 source:5.1.5 source:5.1.4 source:5.1.3 source:5.1.2 source:4.24.7 source:5.1.1 source:4.24.6 source:5.1.0 source:5.0.7 source:5.0.6 source:5.0.5 source:4.24.5 source:5.0.4 source:5.0.3 source:5.0.2 source:4.24.4 source:5.0.1 source:5.0.0 source:5.0.0-rc.3 source:5.0.0-rc.2 source:4.24.3 source:5.0.0-rc.1 source:5.0.0-rc.0 source:5.0.0-beta.2 source:5.0.0-beta.1 source:4.24.2 source:5.0.0-beta.0 source:4.24.1 source:5.0.0-alpha.34 source:4.24.0 source:5.0.0-alpha.33 source:5.0.0-alpha.32 source:5.0.0-alpha.31 source:5.0.0-alpha.4 source:5.0.0-alpha.3 source:4.23.6 source:5.0.0-alpha.2 source:4.23.5 source:5.0.0-alpha.1 source:4.23.4 source:5.0.0-alpha.0 source:5.0.0-experimental.30 source:4.23.3 source:5.0.0-experimental.29 source:5.0.0-experimental.28 source:5.0.0-experimental.27 source:5.0.0-experimental.26 source:5.0.0-experimental.25 source:4.23.2 source:5.0.0-experimental.24 source:4.23.1 source:5.0.0-experimental.23 source:4.23.0 source:5.0.0-experimental.22 source:5.0.0-experimental.21 source:4.22.8 source:5.0.0-experimental.20 source:4.22.7 source:5.0.0-experimental.19 source:5.0.0-experimental.18 source:5.0.0-experimental.17 source:4.22.6 source:5.0.0-experimental.16 source:4.22.5 source:4.22.4 source:5.0.0-experimental.15 source:5.0.0-experimental.14 source:5.0.0-experimental.13 source:5.0.0-experimental.12 source:5.0.0-experimental.11 source:4.22.3 source:4.22.2 source:5.0.0-experimental.10 source:4.22.1 source:4.22.0 source:5.0.0-experimental.9 source:5.0.0-experimental.8 source:5.0.0-experimental.7 source:5.0.0-experimental.6 source:4.21.7 source:5.0.0-experimental.5 source:4.21.6 source:5.0.0-experimental.4 source:4.21.5 source:4.21.4 source:4.21.3 source:4.21.2 source:4.21.1 source:4.21.0 source:4.20.7 source:4.20.6 source:4.20.5 source:4.20.4 source:4.20.3 source:4.20.2 source:4.20.1 source:4.20.0 source:4.20.0-alpha.1 source:4.20.0-alpha.0 source:4.19.5 source:4.19.5-alpha.0 source:4.19.4 source:4.19.3 source:4.19.2 source:4.19.1 source:4.19.1-alpha.0 source:4.19.0 source:4.18.9 source:4.18.8 source:4.18.7 source:4.18.6 source:4.18.5 source:4.18.4 source:4.18.3 source:4.18.2 source:4.18.1 source:4.18.0 source:4.17.4 source:4.17.3 source:4.17.2 source:4.17.1 source:4.17.1-alpha.1 source:4.17.1-alpha.0 source:4.17.0 source:4.17.0-alpha.10 source:4.17.0-alpha.9 source:4.17.0-alpha.8 source:4.17.0-alpha.7 source:4.17.0-alpha.6 source:4.17.0-alpha.5 source:4.17.0-alpha.4 source:4.17.0-alpha.3 source:4.17.0-alpha.2 source:4.17.0-alpha.1 source:4.17.0-alpha.0 source:4.16.13 source:4.16.12 source:4.16.11 source:4.16.10 source:4.16.9 source:4.16.8 source:4.16.7 source:4.16.6 source:4.16.5 source:4.16.3 source:4.16.2 source:4.16.1 source:4.16.0 source:4.15.6 source:4.15.5 source:4.16.0-alpha.1 source:4.16.0-alpha.0 source:4.15.4 source:4.15.3 source:4.15.3-alpha.0 source:4.15.2 source:4.15.1 source:4.15.0 source:4.14.1 source:4.14.0 source:4.13.1 source:4.13.0 source:4.12.3 source:4.12.2 source:4.12.1 source:4.12.0 source:4.11.3 source:4.11.2 source:4.11.1 source:4.10.3 source:4.10.2 source:4.10.1 source:4.10.0 source:4.9.4 source:4.9.3 source:4.9.2 source:4.9.1 source:4.9.0 source:4.8.6 source:4.8.5 source:4.8.4 source:4.8.3 source:4.8.2 source:4.8.1 source:4.8.0 source:3.26.20 source:3.26.19 source:4.7.3 source:4.7.2 source:4.7.1 source:4.7.0 source:4.6.6 source:4.6.5 source:4.6.4 source:4.6.3 source:4.6.2 source:4.6.1 source:4.6.0 source:4.5.4 source:4.5.3 source:4.5.2 source:4.5.1 source:4.5.0 source:4.4.3 source:4.4.2 source:4.4.1 source:4.4.0 source:4.3.5 source:3.26.18 source:4.3.4 source:4.3.3 source:4.3.2 source:4.3.1 source:4.3.0 source:4.2.5 source:4.2.4 source:4.2.3 source:3.26.17 source:4.2.2 source:4.2.1 source:4.2.0 source:3.26.16 source:4.1.5 source:4.1.4 source:4.1.3 source:4.1.2 source:4.1.1 source:3.26.15 source:4.1.0 source:3.26.14 source:4.0.4 source:4.0.3 source:4.0.2 source:3.26.13 source:4.0.1 source:4.0.0 source:4.0.0-rc.6 source:3.26.12 source:3.26.11 source:4.0.0-rc.5 source:3.26.10 source:4.0.0-rc.4 source:3.26.9 source:3.26.8 source:4.0.0-rc.3 source:4.0.0-rc.2 source:3.26.7 source:4.0.0-rc.1 source:4.0.0-rc.0 source:3.26.6 source:3.26.5 source:4.0.0-beta.1 source:3.26.4 source:3.26.3 source:4.0.0-beta.0 source:3.26.2 source:3.26.1 source:4.0.0-alpha.14 source:4.0.0-alpha.13 source:4.0.0-alpha.12 source:3.26.0 source:4.0.0-alpha.11 source:4.0.0-alpha.10 source:3.25.3 source:3.25.2 source:4.0.0-alpha.9 source:3.25.1 source:4.0.0-alpha.8 source:3.25.0 source:3.24.3 source:3.24.2 source:3.24.1 source:3.24.0 source:4.0.0-alpha.7 source:3.23.6 source:3.23.5 source:4.0.0-alpha.6 source:4.0.0-alpha.5 source:3.23.4 source:4.0.0-alpha.4 source:3.23.3 source:3.23.2 source:3.23.1 source:3.23.0 source:4.0.0-alpha.3 source:3.22.2 source:3.23.0-beta.0 source:3.22.1 source:3.22.0 source:4.0.0-alpha.2 source:4.0.0-alpha.1 source:3.21.4 source:3.21.3 source:3.21.2 source:3.21.1 source:3.21.0 source:4.0.0-alpha.0 source:3.20.7 source:3.20.6 source:3.20.5 source:3.20.4 source:3.20.3 source:3.20.2 source:3.20.1 source:3.20.0 source:3.19.8 source:3.19.7 source:3.19.6 source:3.19.5 source:3.19.4 source:3.19.3 source:3.19.2 source:3.19.1 source:3.19.0 source:3.18.2 source:3.18.1 source:3.18.0 source:3.17.0 source:3.16.6 source:3.16.5 source:3.16.4 source:3.16.3 source:3.16.2 source:3.16.1 source:3.16.0 source:3.15.2 source:3.15.1 source:3.15.0 source:3.14.1 source:3.14.0 source:3.13.6 source:3.13.5 source:3.13.4 source:3.13.3 source:3.13.2 source:3.13.1 source:3.13.0 source:3.12.4 source:3.12.3 source:3.12.2 source:3.12.1 source:3.12.0 source:3.9.4 source:3.10.10 source:3.11.6 source:3.11.5 source:3.11.4 source:3.11.4-beta.1 source:3.11.4-beta.0 source:3.11.3 source:3.11.2 source:3.11.1 source:3.11.0 source:3.10.9 source:3.10.8 source:3.10.7 source:3.10.6 source:3.10.5 source:3.10.4 source:3.10.3 source:3.10.2 source:3.10.1 source:3.10.0 source:3.9.3 source:3.9.2 source:3.9.1 source:3.9.0 source:3.9.0-beta.5 source:3.9.0-beta.6 source:3.9.0-beta.4 source:3.9.0-beta.2 source:3.8.4 source:3.8.3 source:3.9.0-beta.0 source:3.8.2 source:3.8.1 source:3.8.0 source:3.7.3 source:3.7.2 source:3.7.1 source:3.7.0 source:3.6.6 source:3.6.5 source:3.6.4 source:3.6.3 source:3.6.2 source:3.6.0 source:3.6.1 source:3.5.4 source:3.5.3 source:3.5.2 source:3.5.1 source:3.5.0 source:3.4.5 source:3.4.4 source:2.13.14 source:3.4.3 source:3.4.2 source:3.4.1 source:3.4.0 source:3.3.3 source:3.3.2 source:3.3.1 source:3.3.0 source:2.13.13 source:3.2.3 source:2.13.12 source:3.2.2 source:3.2.1 source:3.2.0 source:3.1.6 source:3.1.5 source:3.1.4 source:3.1.3 source:3.1.2 source:3.1.1 source:3.1.0 source:3.0.3 source:3.0.2 source:3.0.1 source:3.0.0 source:2.13.11 source:3.0.0-rc.4 source:3.0.0-rc.3 source:3.0.0-rc.2 source:3.0.0-rc.1 source:3.0.0-beta.9 source:3.0.0-beta.8 source:3.0.0-beta.7 source:2.13.10 source:3.0.0-beta.6 source:2.13.9 source:3.0.0-beta.5 source:3.0.0-beta.4 source:3.0.0-beta.3 source:3.0.0-beta.2 source:3.0.0-beta.1 source:2.13.8 source:3.0.0-alpha.24 source:3.0.0-alpha.23 source:3.0.0-alpha.22 source:3.0.0-alpha.21 source:3.0.0-alpha.20 source:3.0.0-alpha.19 source:3.0.0-alpha.18 source:2.13.7 source:3.0.0-alpha.17 source:3.0.0-alpha.16 source:3.0.0-alpha.15 source:2.13.6 source:2.13.5 source:3.0.0-alpha.14 source:2.13.4 source:3.0.0-alpha.13 source:3.0.0-alpha.12 source:3.0.0-alpha.11 source:2.13.3 source:2.13.2 source:2.13.1 source:3.0.0-alpha.10 source:3.0.0-alpha.9 source:3.0.0-alpha.8 source:3.0.0-alpha.7 source:3.0.0-alpha.6 source:2.13.0 source:2.12.8 source:3.0.0-alpha.5 source:3.0.0-alpha.4 source:2.12.7 source:3.0.0-alpha.3 source:3.0.0-alpha.2 source:2.12.6 source:3.0.0-alpha.1 source:3.0.0-alpha.0 source:3.0.0-alpha0 source:2.12.5 source:2.12.4 source:2.12.3 source:2.12.2 source:2.12.1 source:2.12.1-beta.3 source:2.12.1-beta.2 source:2.12.1-beta.1 source:2.12.1-beta.0 source:2.12.0 source:2.11.2 source:2.11.1 source:2.12.0-beta1 source:2.11.0 source:2.10.4 source:2.10.3 source:2.10.2 source:2.10.1 source:2.10.0 source:2.9.3 source:2.9.2 source:2.9.1 source:2.9.0 source:2.8.3 source:2.8.2 source:2.8.1 source:2.8.0 source:2.7.4 source:2.7.3 source:2.7.2 source:2.7.1 source:2.7.0 source:2.6.4 source:2.6.3 source:2.6.2 source:1.11.6 source:1.11.5 source:2.6.1 source:2.6.0 source:2.5.3 source:2.5.2 source:2.5.1 source:2.5.0 source:1.11.4 source:1.11.3 source:2.4.3 source:2.4.2 source:2.4.1 source:2.4.0 source:2.3.2 source:2.3.1 source:2.3.0 source:2.2.1 source:2.2.0 source:2.1.0 source:2.0.1 source:2.0.0 source:2.0.0-beta.13 source:1.11.2 source:2.0.0-beta.12 source:2.0.0-beta.11 source:2.0.0-beta.10 source:2.0.0-beta.9 source:2.0.0-beta.8 source:2.0.0-beta.7 source:2.0.0-beta.6 source:2.0.0-beta.5 source:2.0.0-beta.4 source:1.11.1 source:2.0.0-beta.3 source:2.0.0-beta.2 source:2.0.0-beta.1 source:1.11.0 source:1.10.0 source:1.9.1 source:1.9.0 source:1.8.0 source:1.7.0 source:1.6.5 source:1.6.4 source:1.6.3 source:1.6.2 source:1.6.1 source:1.6.0 source:1.5.1 source:1.5.0 source:1.4.1 source:1.4.0 source:1.3.2 source:1.3.1 source:1.3.0 source:1.2.1 source:1.2.0 source:1.1.0 source:1.0.1 source:1.0.0 source:0.12.17 source:0.12.16 source:0.12.15 source:0.12.14 source:0.12.13 source:0.12.12 source:0.12.11 source:0.12.9 source:0.12.8 source:0.12.7 source:0.12.6 source:0.12.5 source:0.12.4 source:0.12.3 source:0.12.2 source:0.12.1 source:0.12.0 source:0.11.3 source:resource source:0.10.5 source:0.11.2 source:0.11.1 source:0.11.0 source:0.10.4 source:0.10.3 source:0.10.2 source:0.10.1 source:0.10.0 source:0.9.4 source:0.9.2 source:0.9.1 source:0.9.0 source:0.8.0 source:0.7.3 source:0.7.2 source:0.7.1 source:0.7.0

2 Commits
2.11.2 ... 2.4.1

Author SHA1 Message Date
RaoHai
b413e4421c use antd-tools@0.13.9, moment@2.15.1 for pub 2016-11-11 22:26:42 +08:00
RaoHai
7433ecf14c use antd-tools@0.13.9, moment@2.15.1 for pub 2016-11-11 22:25:08 +08:00
970 changed files with 12678 additions and 75208 deletions
Expand all files Collapse all files

9
.babelrc
View File

@@ -1,10 +1,3 @@
{
"env": {
"test": {
"presets": ["es2015", "react", "stage-0"],
"plugins": [
"add-module-exports"
]
}
}
"presets": ["es2015", "react", "stage-0"]
}

2
.codecov.yml
View File

@@ -1,2 +0,0 @@
codecov:
branch: master

5
.eslintignore
View File

@@ -1,5 +0,0 @@
components/**/*.js
components/**/*.jsx
!.eslintrc.js
!components/*/__tests__/*
!components/*/demo/*

5
.eslintrc.js
View File

@@ -3,7 +3,7 @@ const eslintrc = {
env: {
browser: true,
node: true,
jasmine: true,
mocha: true,
jest: true,
es6: true,
},
@@ -27,7 +27,6 @@ const eslintrc = {
'react/prop-types': 0,
'react/jsx-first-prop-new-line': 0,
'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx', '.md'] }],
'import/extensions': 0,
'import/no-unresolved': 0,
'import/no-extraneous-dependencies': 0,
'no-param-reassign': 0,
@@ -36,6 +35,7 @@ const eslintrc = {
'consistent-return': 0,
'no-redeclare': 0,
'react/require-extension': 0,
'react/jsx-indent': 0,
'jsx-a11y/no-static-element-interactions': 0,
'jsx-a11y/anchor-has-content': 0,
'react/no-danger': 0,
@@ -56,6 +56,7 @@ if (process.env.RUN_ENV === 'DEMO') {
'eol-last': 0,
'prefer-rest-params': 0,
'react/no-multi-comp': 0,
'react/prefer-es6-class': 0,
'jsx-a11y/href-no-hash': 0,
'import/newline-after-import': 0,
});

6
.github/CONTRIBUTING.md vendored
View File

@@ -19,7 +19,7 @@ Tips: choose the corresponding documentation with versions selector which in the
### 2. Make sure that your question is about Ant Design, not React
Someone may think all of the questions that he/she meets in developing are about Ant Design, but it's not true. So, please read [React's documentation](http://facebook.github.io/react/docs/getting-started.html) or just Google (not Baidu, seriously) your questions with keyword *React* first. If you are sure that your question is about Ant Design, go ahead.
Someone may think all of the questions that he/she meets in developing are about Ant Design, but it's not true. So, please read [React's documentaion](http://facebook.github.io/react/docs/getting-started.html) or just Google(not Baidu, seriously) your questions with keywork *React* first. If you are sure that your question is about Ant Design, go ahead.
### 3. Read the FAQ and search the issues list of Ant Design
@@ -48,11 +48,9 @@ If you believe that Ant Design should provide some features, but it does not. Yo
## Tips about Pull Request
**Working on your first Pull Request?** You can learn how from this *free* series [How to Contribute to an Open Source Project on GitHub](https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github)
It's welcomed to pull request. And there are some tips about that:
1. It is a good habit to create a feature request issue to discuss whether the feature is necessary before you implement it. However, it's unnecessary to create an issue to claim that you found a typo or improved the readability of documentation, just create a pull request.
1. It is a good habit to create a feature request issue to disscuss whether the feature is necessary before you implement it. However, it's unnecessary to create an issue to claim that you found a typo or improved the readability of documentaion, just create a pull request.
1. Run `npm run lint` and fix those errors before committing in order to keep consistent code style.
1. Rebase before creating a PR to keep commit history clear.
1. Add some descriptions and refer relative issues for you PR.

40
.github/ISSUE_TEMPLATE.md vendored
View File

@@ -1,15 +1,35 @@
<!--
IMPORTANT: Please use the following link to create a new issue:
http://new-issue.ant.design
If your issue was not created using the app above, it will be closed immediately.
-->
<!-- Issue Template -->
<!--
注意：请使用下面的链接来新建 issue：
antd 的用法咨询，建议通过以下渠道，官方 issues 目前没有足够精力提供此类咨询服务：
http://new-issue.ant.design
1. [Stack Overflow](http://stackoverflow.com/questions/tagged/antd)
2. [Segment Fault](https://segmentfault.com/t/antd)（中文）
3. [Gitter](https://gitter.im/ant-design/ant-design)
不是用上面的链接创建的 issue 会被立即关闭。
如果是报告 bug，请按照下列格式书写，并务必提供复现步骤，否则恕难解决，感谢您的支持。
-->
#### 发生问题的环境是：
<!-- 务必提供 -->
- antd 版本:
- 操作系统及其版本:
- 浏览器及其版本:
#### 您做了什么？请提供尽可能详细的重现步骤。
<!-- 如：引入 antd 了 Button -->
#### 您期待的结果是:
<!-- 如：像官网一样正常显示 -->
#### 实际上的结果是:
<!-- 如：样式错位了，最好提供截图 -->
#### 可重现的在线演示
<!-- 请修改并 Fork http://codepen.io/benjycui/pen/KgPZrE?editors=001 -->

20
.github/PULL_REQUEST_TEMPLATE.md vendored
View File

@@ -1,22 +1,8 @@
First of all, thank you for your contribution! :-)
First of all, thanks for your contribution! :-)
Please makes sure that these checkboxes are checked before submitting your PR, thank you!
Please makes sure these boxes are checked before submitting your PR, thank you!
* [ ] Make sure that you propose PR to right branch: bugfix for `master`, feature for latest active branch `feature-x.x`.
* [ ] Make sure that you follow antd's [code convention](https://github.com/ant-design/ant-design/wiki/Code-convention-for-antd).
* [ ] Make sure you follow antd's [code convention](https://github.com/ant-design/ant-design/wiki/Code-convention-for-antd).
* [ ] Run `npm run lint` and fix those errors before submitting in order to keep consistent code style.
* [ ] Rebase before creating a PR to keep commit history clear.
* [ ] Add some descriptions and refer relative issues for you PR.
Extra checklist:
**if** *isBugFix* **:**
* [ ] Make sure that you add at least one unit test for the bug which you had fixed.
**elif** *isNewFeature* **:**
* [ ] Update API docs for the component.
* [ ] Update/Add demo to demonstrate new feature.
* [ ] Update TypeScript definition for the component.
* [ ] Add unit tests for the feature.

8
.gitignore vendored
View File

@@ -15,7 +15,6 @@ Thumbs.db
*.swp
*.swo
*.log
*.log.*
*.json.gzip
node_modules/
.buildpath
@@ -26,13 +25,8 @@ _site
_data
dist
/lib
/es
elasticsearch-*
config/base.yaml
/.vscode/
/coverage
yarn.lock
components/**/*.js
components/**/*.jsx
!components/**/__tests__/*.js
!components/**/__tests__/*.js.snap
/.vscode/

19
.jest.node.json
View File

@@ -1,19 +0,0 @@
{
"setupFiles": [
"./tests/setup.js"
],
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"md"
],
"transform": {
"\\.tsx?$": "./node_modules/typescript-babel-jest",
"\\.js$": "./node_modules/babel-jest",
"\\.md$": "./node_modules/antd-demo-jest"
},
"testRegex": "demo\\.test\\.js$",
"testEnvironment": "node",
"snapshotSerializers": ["enzyme-to-json/serializer"]
}

21
.lesshintrc Normal file
View File

@@ -0,0 +1,21 @@
{
"propertyOrdering": false,
"hexLength": "short",
"stringQuotes": false,
"decimalZero": false,
"importantRule": false,
"zeroUnit": "no_unit",
"qualifyingElement": false,
"duplicateProperty": false,
"importPath": false,
"finalNewline": false,
"newlineAfterBlock": false,
"maxCharPerLine": false,
"excludedFiles": [
"components/grid/style/mixin.less",
"components/style/core/base.less",
"components/style/core/iconfont.less",
"components/style/core/normalize.less",
"components/style/mixins/compatibility.less"
]
}

24
.stylelintrc
View File

@@ -1,24 +0,0 @@
{
"extends": "stylelint-config-standard",
"rules": {
"at-rule-empty-line-before": null,
"at-rule-name-space-after": null,
"comment-empty-line-before": null,
"declaration-bang-space-before": null,
"declaration-empty-line-before": null,
"function-comma-newline-after": null,
"function-name-case": null,
"function-parentheses-newline-inside": null,
"function-max-empty-lines": null,
"function-whitespace-after": null,
"indentation": null,
"number-leading-zero": null,
"number-no-trailing-zeros": null,
"rule-empty-line-before": null,
"selector-combinator-space-after": null,
"selector-list-comma-newline-after": null,
"selector-pseudo-element-colon-notation": null,
"unit-no-unknown": null,
"value-list-max-empty-lines": null
}
}

26
.travis.yml
View File

@@ -4,29 +4,3 @@ language: node_js
node_js:
- "6"
env:
matrix:
- TEST_TYPE=lint
- TEST_TYPE=dist
- TEST_TYPE=compile
- TEST_TYPE=test:dom
- TEST_TYPE=test:node
script:
- |
if [ "$TEST_TYPE" = lint ]; then
npm run lint
elif [ "$TEST_TYPE" = dist ]; then
npm run dist && \
node ./tests/dekko/dist.test.js
elif [ "$TEST_TYPE" = compile ]; then
npm run compile && \
node ./tests/dekko/lib.test.js
elif [ "$TEST_TYPE" = test:dom ]; then
npm run dist && \
npm test -- --coverage -w 2 && \
bash <(curl -s https://codecov.io/bash)
elif [ "$TEST_TYPE" = test:node ]; then
npm test -- --config .jest.node.json -w 2
fi

24
AUTHORS.txt
View File

@@ -1,17 +1,11 @@
Albert Zheng <lisong.zheng@gmail.com>
Andrew Murray <radarhere@gmail.com>
Andrey G <plandem@gmail.com>
Benjy Cui <benjytrys@gmail.com>
Bernie <bernie.wangbj@gmail.com>
Bozhao <yubz86@gmail.com>
Bruce Mitchener <bruce.mitchener@gmail.com>
Bruno Maia <bruno.mm.maia@gmail.com>
C <4019980@qq.com>
Cam Song <neosoyn@gmail.com>
Catalin Miron <mironcatalin@gmail.com>
Cee Cirno <i@cee.moe>
Cody Chan <int64ago@gmail.com>
Danny Hoower Antonio Viasus Avila <danjavia@gmail.com>
Daqi Song <dqaria@gmail.com>
DengYun <tdzl2003@gmail.com>
Eddie Xie <oeddyo@gmail.com>
@@ -22,25 +16,19 @@ Gray Choi <gray.choi.1988@gmail.com>
Guan Hao <raptium@gmail.com>
Haibin Yu <haibin.yu@oceanwing.com>
Hanai <ihanai1991@gmail.com>
ImJoeHs <865439601@qq.com>
Infinity <305870677@qq.com>
James <james@schoolshape.com>
Jerry Bendy <jerry@icewingcc.com>
Junyu Zhan <irrigator@yeah.net>
KgTong <kgtong1992@gmail.com>
Leon Shi <superRaytin@163.com>
Leon Shi <superRaytin@gmail.com>
Liu Yang <zation1@gmail.com>
LongYinan <lynweklm@gmail.com>
MG12 <wuzhao.mail@gmail.com>
Ma Tianxiao <matx2215@outlook.com>
Marius Ileana <visvadw@gmail.com>
Marshall Chen <Juniors.fei@gmail.com>
Meck <yesmeck@gmail.com>
Mr.Tone <vector@malubei.com>
Nathan Wells <nwwells@gmail.com>
Neverland <chenjiahan@buaa.edu.cn>
Nimo <nimo.jser@gmail.com>
Pyiner <lijiuyang1992@gmail.com>
Qiaosen Huang <joesonw@gmail.com>
RaoHai <surgesoft@gmail.com>
@@ -61,12 +49,10 @@ bang <sqibang@gmail.com>
bang88 <sqibang@gmail.com>
chencheng (云谦) <sorrycc@gmail.com>
ddcat1115 <ddcat1115@gmail.com>
denzw <denzw@21cn.com>
detailyang <detailyang@gmail.com>
devqin <devqin@gmail.com>
djorkaeff <djorkae55@gmail.com>
ecofe <150641329@qq.com>
edgji <j.edgji@gmail.com>
elrrrrrrr <elrrrrrrr@gmail.com>
ezpub <ez.foro@gmail.com>
feng zhi hao <fzhihao@outlook.com>
@@ -77,18 +63,15 @@ hi-caicai <hi@cai-cai.me>
ioldfish <fish.wangl@gmail.com>
jasonslyvia <jasonslyvia@gmail.com>
jiang <155259966@qq.com>
jinouwuque <ee2win@gmail.com>
kagawagao <kingsongao1221@gmail.com>
kaifei <150641329@qq.com>
kasinooya <kasinooya@gmail.com>
kayw <kayw@outlook.com>
leon.shi <superRaytin@163.com>
lgmcolin <gengmin.lgm@gmail.com>
lgmcolin <lgmcolin@gmail.com>
lixiaochou077 <qi.liqi07@gmail.com>
lizhaocai <lzc09008@gmail.com>
muzuiget <muzuiget@gmail.com>
parlop <parlop@gmail.com>
pizn <pizner@gmail.com>
plandem <plandem@gmail.com>
popomore <sakura9515@gmail.com>
@@ -105,7 +88,6 @@ tom <caolvchong@gmail.com>
ustccjw <317713370@qq.com>
warmhug <hualei5280@gmail.com>
wizawu <wizawu@gmail.com>
xiaofan2406 <xiaofan2406@gmail.com>
yeliex <yeliex@yeliex.com>
yiminghe <yiminghe@gmail.com>
yubozhao <yubz86@gmail.com>
@@ -117,15 +99,9 @@ zhaocai <lzc09008@gmail.com>
zhujun24 <zhujun87654321@gmail.com>
zilong <jzlxiaohei@163.com>
zinkey <yaya@uloveit.com.cn>
zuiidea <zuiiidea@gmail.com>
偏右 <afc163@gmail.com>
逸达 <dqaria@gmail.com>
蔡伦 <sliuqin@gmail.com>
陆离 <surgesoft@gmail.com>
低位 <zhujun87654321@gmail.com>
广彬-梁 <326741518@qq.com>
闲耘™ <hotoo.cn@gmail.com>
吕立青 <jimmy.jinglv@gmail.com>
马斯特 <sd4399340@126.com>
马金花儿 <o.o@mug.dog>
白羊座小葛 <abeyuhang@gmail.com>

743
CHANGELOG.en-US.md
View File

@@ -1,734 +1,16 @@
---
order: 6
order: 3
title: Change Log
toc: false
timeline: true
---
`antd` strictly follows [Semantic Versioning 2.0.0](http://semver.org/).
#### Release Schedule
* Weekly release: patch version at the end of every week for routine bugfix (anytime for urgent bugfix).
* Monthly release: minor version at the end of every month for new features.
* Major version release is not included in this schedule for breadking change and new features.
If you want to read change logs before `2.0.0`, please visit [GitHub](https://github.com/ant-design/ant-design/blob/1.x-stable/CHANGELOG.md).
If you want to read change logs before `2.0.0`, please visit [GitHub](https://github.com/ant-design/ant-design/releases?after=2.0.0).
---
## Next
- Increase click area of Table's sort and filter icon.[#6528](https://github.com/ant-design/ant-design/pull/6528)
## 2.11.2
`2017-06-25`
- Dropdown.Button now support getPopupContainer function.[#6527](https://github.com/ant-design/ant-design/pull/6527)
- Fix disabled dropdown submenu style error. [#6548](https://github.com/ant-design/ant-design/issues/6548)
- Fix background color error of Calendar. [#aaf2a](https://github.com/ant-design/ant-design/commit/aaf2a508bef96f81faf556036649b2a2fe5b635b)
- Select of Calendar now take place in header. [#6479](https://github.com/ant-design/ant-design/pull/6479)
- Fix horia horizontal scroll error of Input and Textarea. [#6577](https://github.com/ant-design/ant-design/issues/6577)
- Improve document of `disabled` attribute of Checkbox and Radio. [#6597](https://github.com/ant-design/ant-design/pull/6597)
- Increase click area of Table's sort and filter icon.[#6528](https://github.com/ant-design/ant-design/pull/6528)
- Add `event:Event` parameter of Table.props.onRowClick. [#e2a99f5](https://github.com/ant-design/ant-design/commit/e2a99f53f7a27bd7de4adf99d0e1ee755b537c72)
## 2.11.1
`2017-06-18`
- Fix setting `className` of Table's pagination not working issue. [#6416](https://github.com/ant-design/ant-design/issues/6416)
- Fix nested Tabs style issue.[#6431](https://github.com/ant-design/ant-design/issues/6431) [@sadmark](https://github.com/sadmark)
- Fix RadioButton wrapping leaves off the left border on small screen.[#6492](https://github.com/ant-design/ant-design/issues/6492) [@pierreneter](https://github.com/pierreneter)
- Fix RangePicker footer border.
- Improve Dropdown.Button's type definitions. [#6482](https://github.com/ant-design/ant-design/pull/6482) [@newraina](https://github.com/newraina)
## 2.11.0
`2017-06-07`
- New component [Avatar](https://ant.design/components/avatar/). 🌝
- LocaleProvider
- Supporting Bulgarian. [#6297](https://github.com/ant-design/ant-design/pull/6297) [@dimitrov-adrian](https://github.com/dimitrov-adrian)
- Supporting Polish. [#6326](https://github.com/ant-design/ant-design/pull/6326) [@longersson](https://github.com/longersson)
- Supporting Britain English. [#6344](https://github.com/ant-design/ant-design/pull/6344) [@damiangreen](https://github.com/damiangreen)
- Supporting Italian. [#6344](https://github.com/ant-design/ant-design/pull/6344) [@damiangreen](https://github.com/damiangreen)
- Supporting French. [#6344](https://github.com/ant-design/ant-design/pull/6344) [@damiangreen](https://github.com/damiangreen)
- Supporting Belgian. [#6344](https://github.com/ant-design/ant-design/pull/6344) [@damiangreen](https://github.com/damiangreen)
- Collapse.Panel can be disabled now, which makes users cannot toggle panel with mouse/keyboard. [#6119](https://github.com/ant-design/ant-design/issues/6119) [demo](https://ant.design/components/collapse/#components-collapse-demo-basic)
- DatePicker and RangePicker support customized footer. [#6122](https://github.com/ant-design/ant-design/issues/6122) [#5188](https://github.com/ant-design/ant-design/issues/5188) [demo](https://ant.design/components/date-picker/#components-date-picker-demo-extra-footer)
- InputNumber can set precision with property `precision`, this means that precision need not to follow `step`. [#5998](https://github.com/ant-design/ant-design/issues/5998)
- TreeSelect supports `allowClear` in multiple mode.
- Improve keyboard support of Pagination. [rc-pagination#83](https://github.com/react-component/pagination/pull/83) [@geramirez](https://github.com/geramirez)
- Improve style of Progress. [#6354](https://github.com/ant-design/ant-design/issues/6354)
- Improve ARIA support of Slider. [#6301](https://github.com/ant-design/ant-design/pull/6301)
- Fix that animating elements should not be clickable. [#6314](https://github.com/ant-design/ant-design/issues/6314)
- Fix `Cannot read property '0' of undefined` issue of DatePicker, TimePicker, and RangePicker. [#6334](https://github.com/ant-design/ant-design/issues/6334)
- DatePicker
- Fix misplaced popup. [#6347](https://github.com/ant-design/ant-design/issues/6347)
- Fix wrong format of tooltip of date cell. [#5724](https://github.com/ant-design/ant-design/issues/5724) [@zefj](https://github.com/zefj)
- Fix that disabled date is selectable while using keyboard. [#6345](https://github.com/ant-design/ant-design/issues/6345)
- Fix nested fields support of Form `validateFieldsAndScroll`. [#5410](https://github.com/ant-design/ant-design/issues/5410)
- Input[addon]
- Fix that style doesn't work. [#6379](https://github.com/ant-design/ant-design/issues/6379)
- Fix vertical align issue. [#6403](https://github.com/ant-design/ant-design/issues/6403)
- Fix that confirm button not clickable when the returned promise of Modal.confirm is rejected. [#6183](https://github.com/ant-design/ant-design/issues/6183)
- Fix style of input of Pagination. [#6339](https://github.com/ant-design/ant-design/issues/6339)
- Fix that user input of Select should not be trimed in search mode. [#6382](https://github.com/ant-design/ant-design/issues/6382)
- Fix that timers of Spin should be removed correctly. [#6383](https://github.com/ant-design/ant-design/issues/6383)
- Fix onClick support of Switch. [#6373](https://github.com/ant-design/ant-design/issues/6373)
- Fix wrong TypeScript definition of Table.Column which will cause `error TS2304: Cannot find name 'T'`. [#6313](https://github.com/ant-design/ant-design/issues/6313)
- Fix error TypeScript definition of Timeline.Item and Dropdown.Button. [#6356](https://github.com/ant-design/ant-design/issues/6356)
- Fix broken style of disabled Tree and TreeSelect. [#6320](https://github.com/ant-design/ant-design/issues/6320)
## 2.10.4
`2017-06-01`
- Fix `rc-util` dependency. [#6310](https://github.com/ant-design/ant-design/pull/6311) [@bkniffler](https://github.com/bkniffler)
- Fix syntax error in es build. [#6310](https://github.com/ant-design/ant-design/issues/6310#issuecomment-305176273)
## 2.10.3
`2017-05-31`
- **Calendar**
- Fix disabledDate not be supported, and make supplement for the types and documentation. [#6074](https://github.com/ant-design/ant-design/issues/6074)
- Upgrade rc-calendar to 8.4.0, support Bulgarian, and user can select end date first. [commit/a4a6db](https://github.com/ant-design/ant-design/commit/a4a6db76de57ac2559a2be80208121ab5e168fbf)
- **Alert** Remove default margin-bottom. [commit/5ef482](https://github.com/ant-design/ant-design/commit/5ef48289747409b6d962f75627ddb11e2765f965)
- **Tabs** Fix inactive tab panel behavious. [#6237](https://github.com/ant-design/ant-design/issues/6237)
- **Layout** Fix children in the collapsed Sider not be hidden. [#6131](https://github.com/ant-design/ant-design/issues/6131)
- **Table** Fix table filter menu overflow issue. [#6245](https://github.com/ant-design/ant-design/issues/6245)
- **InputNumber** Fix hasFeedback misplaced validated icon. [#6289](https://github.com/ant-design/ant-design/issues/6289)
- **Typescript**
- Upgrade TypeScript to 2.3.x. [#6263](https://github.com/ant-design/ant-design/issues/6263)
- Add missing props in Table. [commit/acdc56](https://github.com/ant-design/ant-design/commit/acdc563a547c49960521b2b48cd5c707ac1e4cf2) [pull/6291](https://github.com/ant-design/ant-design/pull/6291) [@jch254](https://github.com/jch254)
- Fix wrong type in Mention and Form. [pull/6268](https://github.com/ant-design/ant-design/pull/6268) [@jch254](https://github.com/jch254)
- Fix wrong type in Badge. [pull/6291](https://github.com/ant-design/ant-design/pull/6291) [@jch254](https://github.com/jch254)
- Add missing props in Input related Components. [pull/6276](https://github.com/ant-design/ant-design/pull/6276/commits/94901de2e8c0a2ed6f62f5aa50c98994aad71844) [@panjiesw](https://github.com/panjiesw) [commit/220264](https://github.com/ant-design/ant-design/commit/2202648d6e1c53409ade2141955232922b0040d6#diff-26cb6da96d10397e18e7dbd6c5d8f7a1L265) [@clinyong](https://github.com/clinyong)
## 2.10.2
`2017-05-23`
- Fix `prop-types` warnings which due to upgrading React. [#5678](https://github.com/ant-design/ant-design/issues/5678)
- Fix `defaultValue` issue of DatePicker and RangePicker in showTime mode. [#6160](https://github.com/ant-design/ant-design/pull/6160)
- Fix style issue of TreeSelect. [#6137](https://github.com/ant-design/ant-design/issues/6137)
- Fix style issue of Input with prefix and addon. [#6144](https://github.com/ant-design/ant-design/issues/6144)
- Fix some bugs of `notification.destroy`. [#6161](https://github.com/ant-design/ant-design/issues/6161)
- Fix missing translations of Upload and Table. [#6218](https://github.com/ant-design/ant-design/issues/6218)
- Fix style issue of Cascader inside Input.Group. [#6208](https://github.com/ant-design/ant-design/issues/6208)
- Increase click area of Tree icons. [#6120](https://github.com/ant-design/ant-design/issues/6120)
## 2.10.1
`2017-05-14`
- Upgrade normalize.css to 7.0.0.
- Fix AutoComplete style issue when use with Input.Group. [#6058](https://github.com/ant-design/ant-design/issues/6058)
- Fix Tabs cann't set `animated` when use `card` or `editable-card` type. [#6070](https://github.com/ant-design/ant-design/issues/6070)
- Fix Form style issue when zoom out scrren. [#6097](https://github.com/ant-design/ant-design/issues/6097)
- Fix RangePicker style issue in Safari. [#6061](https://github.com/ant-design/ant-design/issues/6061)
- Notification
- Fix `getContainer` not working. [#6099](https://github.com/ant-design/ant-design/pull/6099) [@hardfist](https://github.com/hardfist)
- Fix overlaping issue. [#5895](https://github.com/ant-design/ant-design/issues/5895) [@ystarlongzi](https://github.com/ystarlongzi)
- Add new `fork` icon.
- Add some less variables. [#6039](https://github.com/ant-design/ant-design/pull/6039) [#6038](https://github.com/ant-design/ant-design/pull/6038) [#6105](https://github.com/ant-design/ant-design/issues/6105) [#6040](https://github.com/ant-design/ant-design/pull/6040)
## 2.10.0
`2017-05-02`
- LocaleProvider
- Support Traditional Chinese. [#5665](https://github.com/ant-design/ant-design/pull/5665) [@GeorgioWan](https://github.com/GeorgioWan)
- Support Finnish. [#5699](https://github.com/ant-design/ant-design/pull/5699) [@kirbo](https://github.com/kirbo)
- Support Vietnamese. [#5927](https://github.com/ant-design/ant-design/pull/5927) [@pnghai](https://github.com/pnghai)
- Update Spanish. [#5932](https://github.com/ant-design/ant-design/pull/5932) [@ginodeise](https://github.com/ginodeis)
- AutoComplete supports to listen to search events by `onSearch`.
- Checkbox.Group can support more flexible layout with nested Checkbox. [demo](http://ant.design/components/checkbox-cn/#components-checkbox-demo-layout)
- Notification's inline style and className can be customized now. [#5893](https://github.com/ant-design/ant-design/issues/5893) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
- TimePicker's open status can be controlled by `open` property. [#5913](https://github.com/ant-design/ant-design/pull/5913)
- The returned value of Upload `onRemove` could be a Promise to control remove logic asynchronously. [#5973](https://github.com/ant-design/ant-design/issues/5973) [@shlice](https://github.com/shlice)
- Adjust padding of popup of Dropdown. [#5088](https://github.com/ant-design/ant-design/issues/5088)
- AutoComplete
- Fix inconsistent behavior between `dataSource: Object[]` and `dataSource: String[]`. [#5860](https://github.com/ant-design/ant-design/issues/5860)
- Fix broken style of error style in Form. [#5834](https://github.com/ant-design/ant-design/issues/5834) [@kossel](https://github.com/kossel)
- Fix that Button should not insert space in Chinese characters while using Icon. [#5977](https://github.com/ant-design/ant-design/issues/5977)
- Fix broken style while using Cascader in Card[title]. [#5952](https://github.com/ant-design/ant-design/issues/5952)
- Fix broken disabled style of Checkbox Radio. [#5935](https://github.com/ant-design/ant-design/issues/5935)
- Fix broken style of DatePicker with nested TimePicker while using `use12Hours`. [#5959](https://github.com/ant-design/ant-design/issues/5959)
- Fix broken style while using AutoComplete, Cascader, Mention, TimePicker in Input.Group. [#5832](https://github.com/ant-design/ant-design/issues/5832)
- Fix missing TypeScript definition of `inlineIndent` Menu. [#5903](https://github.com/ant-design/ant-design/pull/5903) [@brookshi](https://github.com/brooksh)
- Mention
- Fix missing properties, readOnly and disabled. [#5175](https://github.com/ant-design/ant-design/issues/5175)
- Fix controlled mode. [#5788](https://github.com/ant-design/ant-design/issues/5788)
- Fix errors while using RangePicker with Form. [#5872](https://github.com/ant-design/ant-design/issues/5872)
- Fix that pagination is clickable when Table with loading status. [#5937](https://github.com/ant-design/ant-design/issues/5937)
- Tabs
- Fix broken style while using Table or Form in Tabs. [#5953](https://github.com/ant-design/ant-design/issues/5953)
- Fix broken style of vertical layout. [#5877](https://github.com/ant-design/ant-design/issues/5877)
- Transfer
- Fix invisible search result list. [#5631](https://github.com/ant-design/ant-design/issues/5631)
- Fix select all and unselect all logic in searching mode. [#5993](https://github.com/ant-design/ant-design/issues/5993)
## 2.9.3
`2017-04-24`
- **notification** Fix can't close itself after 4.5s. [#5869](https://github.com/ant-design/ant-design/issues/5869)
- **Tabs** Add transition for `ink-bar` width. [#5858](https://github.com/ant-design/ant-design/pull/5858) [@hlehmann](https://github.com/hlehmann)
## 2.9.2
`2017-04-22`
- **Alert** Fix props of banner mode can't be overrided. [#5800](https://github.com/ant-design/ant-design/issues/5800)
- **AutoComplete** Fix can't add `onKeyDown` event listener with customized input component. [#5487](https://github.com/ant-design/ant-design/issues/5487)
- **Button** New style for danger Button. [#5815](https://github.com/ant-design/ant-design/pull/5815)
- **DatePicker**
- Improve user experience of RangePicker, rc-calendar upgrade to `~8.0.0`. [#4985](https://github.com/ant-design/ant-design/issues/4985)
- Fix RangePicker not aligned after customizing the size of input. [pull/5718](https://github.com/ant-design/ant-design/pull/5718) [@leadream](https://github.com/leadream)
- **Form** Add a less variable to opt out of form item colons. [pull/5855](https://github.com/ant-design/ant-design/pull/5855) [@megawac](https://github.com/megawac)
- **Input**
- Fix Input.Search style issue when be used in Input.Group. [#5743](https://github.com/ant-design/ant-design/issues/5743)
- Fix AutoComplete style issue when be used in Input.Group. [#5832](https://github.com/ant-design/ant-design/issues/5832)
- Fix Select size when be used in Input.Group. [#5754](https://github.com/ant-design/ant-design/issues/5754)
- Change suffix color. [pull/5820](https://github.com/ant-design/ant-design/pull/5820) [@megawac](https://github.com/megawac)
- **InputNumber** Update docs and demos for how to use `parser` to work with `formatter`. [#5683](https://github.com/ant-design/ant-design/issues/5683)
- **Layout**
- Add [Fixed-Sider](https://ant.design/components/layout/#components-layout-demo-fixed-sider) demo.
- Fix style issue of responsive sider in firefox. [#5613](https://github.com/ant-design/ant-design/issues/5613)
- **LocaleProvider** Allow for seamless access to less variables. [#5712](https://github.com/ant-design/ant-design/issues/5712) [@lionkeng](https://github.com/lionkeng)
- **Menu** Override the default `a:focus` style when it nested in Menu component. [#5707](https://github.com/ant-design/ant-design/issues/5707)
- **Notification** Auto adjust style for singleline message. [#5846](https://github.com/ant-design/ant-design/issues/5846)
- **Radio** Add less variables for setting color and background color of Radio.Button. [pull/5791](https://github.com/ant-design/ant-design/pull/5791) [@megawac](https://github.com/megawac)
- **Table**
- Add less variables for setting head background color and row background hover color. [#5706](https://github.com/ant-design/ant-design/issues/5706) [@kappa-gooner](https://github.com/kappa-gooner)
- Improve the `Grouping table head` demo style. [#5697](https://github.com/ant-design/ant-design/issues/5697)
- **Tabs** Fix the position of the scrolling arrow in `vertical` mode. [#5765](https://github.com/ant-design/ant-design/issues/5765) [@dicklwm](https://github.com/dicklwm)
- **TreeSelect** Fix arrow rotate bug. [#5693](https://github.com/ant-design/ant-design/issues/5693)
- **TypeScript**
- Add missing props in InputNumber. [#5717](https://github.com/ant-design/ant-design/issues/5717) [@whtang906](https://github.com/whtang906)
- **Global Optimization**
- Fix deprecation warning of `React.PropTypes` due to React upgrading to v15.5.0. [pull/5723](https://github.com/ant-design/ant-design/pull/5723) [@manjitkumar](https://github.com/manjitkumar)
- **Site**
- Add native English translation for [icons spec](https://ant.design/docs/spec/icon). [@kenaniah](https://github.com/kenaniah)
- Add [English gitter chat room](https://gitter.im/ant-design/ant-design-english).
## 2.9.1
`2017-04-09`
- Step
- Add more less variables. [#5624](https://github.com/ant-design/ant-design/pull/5624) [@megawac](https://github.com/megawac)
- Fix style issue. [#5623](https://github.com/ant-design/ant-design/issues/5623)
- Button won't lose focus after click. [#5597](https://github.com/ant-design/ant-design/pull/5597) [@kenaniah](https://github.com/kenaniah)
- Add underline to focused link. [#5587](https://github.com/ant-design/ant-design/pull/5597) [@kenaniah](https://github.com/kenaniah)
- Fix Dropdown.Button can't use `placement` issue. [#5594](https://github.com/ant-design/ant-design/issues/5594)
- Fix Pagination alignment issue. [#5632](https://github.com/ant-design/ant-design/issues/5632)
- Fix AutoComplete style issue when use `allowClear`. [#5634](https://github.com/ant-design/ant-design/issues/5634)
- Fix DatePicker style issue when set `showToday` to `false`. [#5620](https://github.com/ant-design/ant-design/issues/5620)
- Fix Select shows Chinese defaultly. [#5661](https://github.com/ant-design/ant-design/pull/5661) [@LeeHarlan](https://github.com/LeeHarlan)
## 2.9.0
`2017-04-01` 👻
- Change the default font family to be monospaced for numbers. [b526083](https://github.com/ant-design/ant-design/commit/b526083fa6a619113a3d26c4f4f092a8648f3bd4)
- Select
- Add `mode` prop, deprecate the `tags|combobox|multiple` properties, replaced by `mode={tags|combobox|multiple}`.
- `tags|multiple` now supports `allowClear`. [#4843](https://github.com/ant-design/ant-design/issues/4843)
- Add a new type `dashboard` of Progress. [#5225](https://github.com/ant-design/ant-design/issues/5225) [@qiaolb](https://github.com/qiaolb)
- Add `showLine` prop of Tree, for connecting line style in tree nodes. [#3854](https://github.com/ant-design/ant-design/issues/3854)
- TimePicker now supports 12 hours via `use12Hours`. [#4063](https://github.com/ant-design/ant-design/issues/4063)
- Add `column.filterIcon` prop of Table, which can be used to customize filter icon. [#5293](https://github.com/ant-design/ant-design/pull/5293)
- Add `wrapperClassName` prop of Spin. [#5425](https://github.com/ant-design/ant-design/pull/5425) [@aaronplanell](https://github.com/aaronplanell)
- Add `onPrevClick` `onNextClick` props of Tabs. [#4395](https://github.com/ant-design/ant-design/issues/4395)
- Add `parser` prop of InputNumber, to extract value from formatter. [#5178](https://github.com/ant-design/ant-design/pull/5178#issuecomment-284557933)
- New locales support:
- Japanese [#5529](https://github.com/ant-design/ant-design/pull/5529) [@novi](https://github.com/novi)
- Slovak [#5304](https://github.com/ant-design/ant-design/pull/5304) [@Kamahl19](https://github.com/Kamahl19)
- Estonian [#5266](https://github.com/ant-design/ant-design/pull/5266) [@madisvain](https://github.com/madisvain)
- Turkish [#5536](https://github.com/ant-design/ant-design/pull/5536) [@c0b41](https://github.com/c0b41)
- TypeScript
- Fix definitions of Carousel following react-slick
- Fix some definitions of Form.
- Fix `getPopupContainer` definitions.
- Allow to disable animation of inkBar and panes of Tabs separately. [#5089](https://github.com/ant-design/ant-design/issues/5089) [@xieguanglei](https://github.com/xieguanglei)
- Button `loading` prop now supports like `{ delay: 1000 }`, removed the default loading delay. [#5365](https://github.com/ant-design/ant-design/issues/5365)
- Add less variables for Card header. [#5354](https://github.com/ant-design/ant-design/pull/5354) [@kossel](https://github.com/kossel)
- Fix extra separator of Breadcrumb without `breadcrumbName`.
- Fix `Unknown prop placement` warning of Dropdown.Button. [#5594](https://github.com/ant-design/ant-design/issues/5594)
- Fix RangePicker and InputNumber placeholder color.
- Fix that Cascader search can't use [Backspace]. [#5340](https://github.com/ant-design/ant-design/issues/5340)
- Fix that LocaleProvider can't affect `Modal.confirm` sometimes. [#5493](https://github.com/ant-design/ant-design/issues/5493) [@hargasinski](https://github.com/hargasinski)
- Fix scroll animation of BackTop which specifies the `target` prop. [#5564](https://github.com/ant-design/ant-design/issues/5564)
- Optimize the block style of Pagination. [#5557](https://github.com/ant-design/ant-design/issues/5557)
## 2.8.3
`2017-03-27`
- TypeScript
- Fixed missing definition of `AutoComplete[filterOption]`. [#5393](https://github.com/ant-design/ant-design/pull/5393) [@mitchelldemler](https://github.com/mitchelldemler)
- Improve definition of `getPopupContainer` `getCalendarContainer` `getTooltipContainer` `getSuggestionContainer`, etc. [322e9ef](https://github.com/ant-design/ant-design/commit/322e9efdc9db28bd92230fc690f1fdf5a72cf7cd)
- Improve definition of `Form.create`. [#5420](https://github.com/ant-design/ant-design/pull/5420) [@infeng](https://github.com/infeng)
- Fixed Badge should work in Maxthon. [#5477](https://github.com/ant-design/ant-design/issues/5477)
- Fixed Button cannot work with `null` `undefined` as children. [#5472](https://github.com/ant-design/ant-design/issues/5472) [@blade254353074](https://github.com/blade254353074)
- Breadcrumb are not rely on `route.breadcrumbName` now. [ac1c7f3](https://github.com/ant-design/ant-design/commit/ac1c7f312bc46ba6ef7aacace43e4ac99b87dd54)
- Fixed `Form.Item[hasFeedback]` will lost styles while using with `Input[prefix]`. [#5456](https://github.com/ant-design/ant-design/issues/5456) [@william-yz](https://github.com/william-yz)
- Fixed Layout.Content will show scrollbar while using with Carousel. [#5415](https://github.com/ant-design/ant-design/issues/5415)
- LocaleProvider
- Fixed missing locales of German. [#5387](https://github.com/ant-design/ant-design/pull/5387) [@Knacktus](https://github.com/Knacktus)
- Fixed missing locales of Russian. [#5406](https://github.com/ant-design/ant-design/pull/5406) [@plandem](https://github.com/plandem)
- Fixed it doesn't work with Upload. [#5388](https://github.com/ant-design/ant-design/pull/5388) [@natergj](https://github.com/natergj)
- Fixed inconsistet animation of Menu Icon and text. [#5495](https://github.com/ant-design/ant-design/issues/5495)
- Fixed `Modale[footer]` cannot be set to `null`. [#5462](https://github.com/ant-design/ant-design/issues/5462)
- Fixed Pagination will lost styles in `IE<=10` which is introduced in `2.8.2`. [#5484](https://github.com/ant-design/ant-design/issues/5484)
- Fixed Popover will be closed by mistake while using Table in it. [#5407](https://github.com/ant-design/ant-design/issues/5407)
- Remove restriction that Radio can only be direct chidlren of Radio.Group. [#5443](https://github.com/ant-design/ant-design/issues/5443)
- Fixed warning while using Switch in Form.Item. [#5368](https://github.com/ant-design/ant-design/issues/5368)
- Now we defaultly hide the Table's "Select All" dropdown icon, display it when set `selections` to true. [#5246](https://github.com/ant-design/ant-design/issues/5246) [@infeng](https://github.com/infeng)
- New theme variable `@info-color`. [#5442](https://github.com/ant-design/ant-design/issues/5442)
- Supporting suppress warning(You are using a whole package of antd...) with `NODE_ENV=test` while testing. [#5345](https://github.com/ant-design/ant-design/issues/5345)
- Upgrade moment to `2.18.0`.
## 2.8.2
`2017-03-11`
- New [design specification documentation](https://ant.design/docs/spec/colors).
- Fix error of Modal.confirm [#5269](https://github.com/ant-design/ant-design/issues/5269).
- Fix mask style of Upload [#5275](https://github.com/ant-design/ant-design/issues/5275).
- Fix progress not showing of Upload [#5323](https://github.com/ant-design/ant-design/issues/5323).
- Fix a pagination showTotal wrong data issue of Table [#5259](https://github.com/ant-design/ant-design/issues/5259).
- Fix a style issue while using Popconfirm and Button together [5301](https://github.com/ant-design/ant-design/issues/5301).
- Fix a style issue of Radio [#5336](https://github.com/ant-design/ant-design/pull/5336).
- Fix a issue that `getContainer` of Message didn't work [#5380](https://github.com/ant-design/ant-design/issues/5380).
- Fix text alignment of Checkbox and Radio [696a3c0](https://github.com/ant-design/ant-design/commit/696a3c0e34156d78e87d629a3f0f8703af1f03ec).
- Tweak animation and blur style of Spin [fa1e031](https://github.com/ant-design/ant-design/commit/fa1e031a7396c61fa9709a0c46fe63200c35d232).
- Tweak some styles of Mention [240a93c](https://github.com/ant-design/ant-design/commit/240a93cee25bc8c6ad4520cd907a14a7b22ed773).
## 2.8.1
`2017-03-11`
- **DatePicker** Fix can't select time when new props are passed, and improve the selection behavior of `DatePicker[showTime]`. [#5189](https://github.com/ant-design/ant-design/issues/5189) [@megawac](https://github.com/megawac)
- **Form**
- Add document for validate rules. [#5201](https://github.com/ant-design/ant-design/issues/5201)
- Fix some style issues. [#5196](https://github.com/ant-design/ant-design/issues/5196) [#5236](https://github.com/ant-design/ant-design/issues/5236) [#5222](https://github.com/ant-design/ant-design/issues/5222)
- **Icon** Add iconfont `shake` and `android-o`. [commit/941782](https://github.com/ant-design/ant-design/commit/941782f7ec000a9054c3bc945ab887f93ab46749)
- **Input** Fix `hasFeedback` not work with `addonBefore`. [#5228](https://github.com/ant-design/ant-design/issues/5228)
- **InputNumber** Add typings for props `formatter`. [#5240](https://github.com/ant-design/ant-design/issues/5240) [@hlehmann](https://github.com/hlehmann)
- **Modal** Call `onCancel` when pressing esc key. [#5203](https://github.com/ant-design/ant-design/issues/5203) [@elios264](https://github.com/elios264)
- **Table**
- Fix implicit type issue. [#5206](https://github.com/ant-design/ant-design/issues/5206) [@kvey](https://github.com/kvey)
- Fix right border not visible with no data in `small` size. [#5237](https://github.com/ant-design/ant-design/issues/5237)
- Fix sort not working when using grouping column. [#5158](https://github.com/ant-design/ant-design/issues/5158)
- **Tooltip** Fix layout style on disabled Button. [#5254](https://github.com/ant-design/ant-design/issues/5254)
- **Upload**
- Fix long name of upload item style. [commit/0a3519](https://github.com/ant-design/ant-design/commit/0a35197a35513ca45308bb7163c8243b75dd6f8d)
- Fix and improve animation. [pull/5210](https://github.com/ant-design/ant-design/pull/5210)
- Allow override `onProgress`. [pull/5260](https://github.com/ant-design/ant-design/pull/5260) [@minwe](https://github.com/minwe)
- **Global Optimization**
- Fix Cannot resolve module `lodash.debounce`. [#5230](https://github.com/ant-design/ant-design/issues/5230)
- **Site**
- Fix safari language check. [pull/5245](https://github.com/ant-design/ant-design/pull/5245)
- Add ability to copy color when clicking on palette. [pull/5247](https://github.com/ant-design/ant-design/pull/5247) [@bsheikh](https://github.com/bsheikh)
- Add boilerplate samples. [commit/f2f786](https://github.com/ant-design/ant-design/commit/f2f786d66d75eebef8406a72db8a15e1640cea1f)
## 2.8.0
`2017-03-06`
- Tabs
- Added `tabBarStyle` to allow customize style of tab bar. [#4966](https://github.com/ant-design/ant-design/issues/4966)
- Added `TabPane[closable]` to allow config whether to show delete icon or not. [#4807](https://github.com/ant-design/ant-design/pull/4807) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
- Anchor
- Added `showInkInFixed` to allow config whether to show circle icon or not when anchor is fixed. [#4960](https://github.com/ant-design/ant-design/pull/4960)
- Fix issue resulting in Anchor throw errors when `children` is not AnchorLink. [#5129](https://github.com/ant-design/ant-design/issues/5129)
- Table
- Added invert selection feature. [demo](https://ant.design/components/table-cn/#components-table-demo-row-selection-custom) [#4962](https://github.com/ant-design/ant-design/pull/4962)
- `spin` now spport Spin props. [#4824](https://github.com/ant-design/ant-design/pull/4824) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
- Fix issue resulting header's bottom border doesn't show when `size` is `small`. [#5182](https://github.com/ant-design/ant-design/issues/5182)
- Mention added custom trigger character support. [demo](https://ant.design/components/mention-cn/#components-mention-demo-multiple-trigger)
- ![Mention animation](https://zos.alipayobjects.com/rmsportal/QDYwAbwKrqOUOykRaNai.gif)
- Rate
- Support custom character. [demo](https://ant.design/components/rate-cn/#components-rate-demo-character)
- Added new `className` prop.
- Layout
- Added a new `Header Sider` demo. [demo](http://ant.design/components/layout-cn/#components-layout-demo-top-side-2)
- Added a new `Fixed Header` demo. [demo](https://ant.design/components/layout-cn/#components-layout-demo-fixed)
- Added `Sider[breakpoint]` to allow config responsive breakpoint. [#4931](https://github.com/ant-design/ant-design/pull/4931)
- Form
- Added `layout` to replace the original `horizontal`, `vertical`, `inline`. [#5056](https://github.com/ant-design/ant-design/issues/5056)
- Calendar
- Added `dateFullCellRender` and `monthFullCellRender` to allow override the content of cell. [#5138](https://github.com/ant-design/ant-design/pull/5138) [@wonyun](https://github.com/wonyun)
- Added `onSelect` for date selection. [demo](https://ant.design/components/calendar-cn/#components-calendar-demo-select)
- AutoComplete
- Fix alignment issue in Form.Item. [#5139](https://github.com/ant-design/ant-design/issues/5139)
- Adde a newd `Uncertain Category` demo. [demo](https://ant.design/components/auto-complete-cn/#components-auto-complete-demo-uncertain-category)
- Col added `xl` to support 1600px breakpoint. [#4796](https://github.com/ant-design/ant-design/pull/4796) [@hjin-me](https://github.com/hjin-me)
- Upload added `locale` to support i18n. [#4697](https://github.com/ant-design/ant-design/issues/4697)
- Transfer added `onScroll` to support load data dynamically. [#4188](https://github.com/ant-design/ant-design/issues/4188)
- `message` and `notification` add `getContainer` to allow config the render container. [#5019](https://github.com/ant-design/ant-design/issues/5019)
- Badge added `showZero` to allow config whether to show `0` or not. [#4251](https://github.com/ant-design/ant-design/issues/4251)
- InputNumber
- Added `formatter` to allow format the value to present.
- Added ctrl and shift key support. [detail](https://github.com/react-component/input-number#keyboard-navigation)
- Added some new icons. [#5107](https://github.com/ant-design/ant-design/pull/5107)
- New locale support:
- Dutch [#4785](https://github.com/ant-design/ant-design/pull/4785) [@corneyl](https://github.com/corneyl)
- Catalan [#4929](https://github.com/ant-design/ant-design/pull/4929) [@aaronplanell](https://github.com/aaronplanell)
- Czech [#5169](https://github.com/ant-design/ant-design/pull/5169) [@martinnov92](https://github.com/ant-design/ant-design/pull/5169)
- Korean [#5141](https://github.com/ant-design/ant-design/pull/5141) [@minsungryu](https://github.com/ant-design/ant-design/pull/5141)
- Improve Spin display position. [#4722](https://github.com/ant-design/ant-design/issues/4722)
- Fix Checkbox comatible issue with `browser-sync`. [#2744](https://github.com/ant-design/ant-design/issues/2744)
- Fix Steps width issue when resize window. [#5083](https://github.com/ant-design/ant-design/issues/5083)
- Fix Upload.Dragger unmount error. [#5162](https://github.com/ant-design/ant-design/issues/5162)
- Fix Button shifting during click in IE issue.
- FIx Input prefix and suffix vertical alignment.
## 2.7.4
`2017-02-28`
- Fix TreeSelect cannot display bug. [#5092](https://github.com/ant-design/ant-design/issues/5092)
- Fix Anchor `e.stopPreventDefault is not a function` error. [#5080](https://github.com/ant-design/ant-design/issues/5080)
- Fix some detail styles of Input, Cascader, Upload.
## 2.7.3
`2017-02-25`
- Unify demo code to ES6 class. [#4878](https://github.com/ant-design/ant-design/issues/4878)
- TypeScript
- Fix that `Cannot find module '../../package.json'` error. [#4935](https://github.com/ant-design/ant-design/issues/4935)
- Fix definitions of Table, RangePicker and Upload.
- Fix lack of event argument for Modal `onOk` `afterClose` and Popconfirm `onConfirm` `onCancel`. [#4787](https://github.com/ant-design/ant-design/issues/4787)
- Improve animation of Menu[inline] and Collapse.
- Improve Checkbox and Radio vertical align style.
- Table
- Fix misplace header when fix column. [#4936](https://github.com/ant-design/ant-design/issues/4936)
- Fix not clearing float issue. [#4945](https://github.com/ant-design/ant-design/issues/4945)
- Fix submenu of filter. [#4975](https://github.com/ant-design/ant-design/issues/4975)
- Fix that filterDropdown of fixed column cannot be interacted with. [#5010](https://github.com/ant-design/ant-design/issues/5010)
- Fix that arguments of `pagination.onChange` do not match Pagination `onChange`.
- Fix that table loading animation is not smoothing. [#4934](https://github.com/ant-design/ant-design/issues/4934)
- Improve multiple message display. [#3543](https://github.com/ant-design/ant-design/issues/3543)
- Fix Carousel autoplay not working after resize window. [#2550](https://github.com/ant-design/ant-design/issues/2550)
- Fix that controlled InputNumber cannot input number like `1.01` `1.001`. [#5012](https://github.com/ant-design/ant-design/issues/5012)
- Improve Button loading switching.[#4913](https://github.com/ant-design/ant-design/issues/4913)
- Fix Dropdown selected menu style and `Menu[theme="dark"]` style. [#5013](https://github.com/ant-design/ant-design/issues/5013) [#4903](https://github.com/ant-design/ant-design/issues/4903)
- Fix Menu submenu `z-index` issue. [#4937](https://github.com/ant-design/ant-design/issues/4937)
- Fix that DatePicker and RangePicker width cannot be reset below `300px` issue. [#4920](https://github.com/ant-design/ant-design/issues/4920)
- Fix style of Spin nested in Spin. [#4971](https://github.com/ant-design/ant-design/issues/4971)
- Fix that lack of Button style when import Popconfirm by babel-plugin-import.
- Fix that less variables cannot work on circle Progress. [#5002](https://github.com/ant-design/ant-design/issues/5002)
- Fix falsy children of Breadcrumb. [#5015](https://github.com/ant-design/ant-design/issues/5015)
- Fix blinking tooltip of Slider. [#5003](https://github.com/ant-design/ant-design/issues/5003)
- Fix that Transfer disabled option can be moved. [#4981](https://github.com/ant-design/ant-design/pull/4981) [@tianlizhao](https://github.com/tianlizhao)
- Documentation
- Fix and improve site for mobile devices.
- Improve 1.x to 2.x compatibility instruction.
## 2.7.2
`2017-02-17`
- Fix that `antd.version` doesn't work as expected. [#4844](https://github.com/ant-design/ant-design/issues/4844)
- Fix that dist files don't include locales. [#4910](https://github.com/ant-design/ant-design/pull/4910)
- Fix that disabled option is selectable in search mode of Cascader. [#4699](https://github.com/ant-design/ant-design/issues/4699)
- **Button**
- Fix click animation of `Button[type=danger]`.
- Fix broken style with `loading`. [#4875](https://github.com/ant-design/ant-design/issues/4875)
- **Menu**
- Fix that `openKeys` should be controlled property in `vertical` mode. [#4876](https://github.com/ant-design/ant-design/issues/4876)
- Fix selected animation of Menu.Item.
- Fix broken style of Menu.SubMenu. [#4906](https://github.com/ant-design/ant-design/issues/4906)
- **Table**
- Fix broken style of table which use small size and fixed header. [#4850](https://github.com/ant-design/ant-design/issues/4850)
- Fix placeholder style. [#4851](https://github.com/ant-design/ant-design/pull/4851)
- Simplify DOM structure. [#4868](https://github.com/ant-design/ant-design/issues/4868)
- Fix that Radio should support number `0` as children. [#4874](https://github.com/ant-design/ant-design/issues/4874) [@HQidea](https://github.com/HQidea)
- Fix that RangePicker should work with `style.width` which is small than 300. [#4920](https://github.com/ant-design/ant-design/issues/4920)
- Fix CSS compile error caused by Spin. [#4915](https://github.com/ant-design/ant-design/issues/4915)
- Fix that Tooltip should work with disabled button in Chrome. [#4865](https://github.com/ant-design/ant-design/pull/4865)
- Fix UX of Tree while dragging. [#4858](https://github.com/ant-design/ant-design/issues/4858)
- Fix failed style of Upload. [#4810](https://github.com/ant-design/ant-design/issues/4810)
- Fix that `Menu[vertical]`'s SubMenu cannot popup in Layout.Sider. [#4890](https://github.com/ant-design/ant-design/issues/4890)
- Improve animation of Button and `Badge[status=processing]`.
![Badge animation](https://camo.githubusercontent.com/6874b2333f2fac3fac346404c6e70684e4dafc1a/68747470733a2f2f7a6f732e616c697061796f626a656374732e636f6d2f726d73706f7274616c2f73516b72756c716346734b4e54785158615971512e676966)
![Button animation](https://camo.githubusercontent.com/3963d12b45de4f522c2799361dbc3177e7bd93d1/68747470733a2f2f7a6f732e616c697061796f626a656374732e636f6d2f726d73706f7274616c2f46624b776d636f766d795364666c557468494e522e676966)
## 2.7.1
`2017-02-10`
- **Affix**
- Fix the problem of element been hidden when hover on. [#4800](https://github.com/ant-design/ant-design/issues/4800)
- Fix event listener can not be removed. [#4755](https://github.com/ant-design/ant-design/issues/4755)
- Fix can not be unfixed when scrolling fastly. [#4760](https://github.com/ant-design/ant-design/issues/4760)
- **Anchor** Fix the location problem when offsetTop has been set. [#4706](https://github.com/ant-design/ant-design/issues/4706)
- **AutoComplete**
- Fix the wrong size. [#4766](https://github.com/ant-design/ant-design/issues/4766)
- Fix adding error character automatically. [#4778](https://github.com/ant-design/ant-design/issues/4778)
- **Dropdown** Add the documentation and demo about positioning of Dropdown menus. [#4811](https://github.com/ant-design/ant-design/issues/4811)
- **Layout** Improve Sider's animation effect. [#4752](https://github.com/ant-design/ant-design/issues/4752)
- **LocaleProvider** Fix issues with the new Swedish locale provider. [pull-4762](https://github.com/ant-design/ant-design/pull/4762) [@JesperWe](https://github.com/JesperWe)
- **RangePicker** Fix the overlapping problem about the date icon. [#4783](https://github.com/ant-design/ant-design/issues/4783) [@zhenzong](https://github.com/zhenzong)
- **Table**
- Add the missing value 'middle' for size definition. [#4819](https://github.com/ant-design/ant-design/pull/4819) [@warrenseymour](https://github.com/warrenseymour)
- Fix controlled filter does not work with JSX style. [#4759](https://github.com/ant-design/ant-design/issues/4759)
- Fix switch pagination problem. [#4779](https://github.com/ant-design/ant-design/issues/4779)
- **Tabs** Fix content missing problem since the second tab pane under IE9. [#4795](https://github.com/ant-design/ant-design/issues/4795)
- **rc-pagination** Upgrade to ~1.7.0, add pageSize as onChange's second argument.
- **Global optimization**
- Make some bugfixes and optimizations about documentation, link and style.
- Use stylelint instead of lesslint, and fix some lint issues. [#2179](https://github.com/ant-design/ant-design/issues/2179)
- Unify border radius to 4px. [#4772](https://github.com/ant-design/ant-design/issues/4772)
- Support `import { version } from 'antd'`. [#4751](https://github.com/ant-design/ant-design/pull/4751)
- **Site**
- Add default locale looking-up in Home Page. [#4552](https://github.com/ant-design/ant-design/issues/4552)
- Can search with Google. [#4814](https://github.com/ant-design/ant-design/issues/4814)
- Change the position of version switch. [pull-4799](https://github.com/ant-design/ant-design/pull/4799)
## 2.7.0
`2017-02-03`
* Added `danger` button and `ghost` button style. [#4679](https://github.com/ant-design/ant-design/pull/4679)
* Input element of AutoComplete can be customized. [#4483](https://github.com/ant-design/ant-design/pull/4483)
* Upgrade rc-cascader to `0.11.0`, keyborad interactions supported. [#4411](https://github.com/ant-design/ant-design/pull/4411)
* More popup directions are supported in notification. [#4732](https://github.com/ant-design/ant-design/pull/4700)
* Upgrade rc-steps to `2.3.0`, added `progressDot` property of Steps, which allows users to customize the display for Steps with progress dot style.
* Upgrade rc-input-number to `3.0.0`
* Input behavious will trigger `onChange` callback now.[#4265](https://github.com/ant-design/ant-design/pull/4265)
* Fixed `onKeyUp`. [#4717](https://github.com/ant-design/ant-design/issues/4717)
* Added `vertical` mode of Slider. [#4473](https://github.com/ant-design/ant-design/pull/4473)
* Tag
* Added preset colors. [#4571](https://github.com/ant-design/ant-design/pull/4571)
* Improvement vertical-align and margin.
* Add German localization for LocaleProvider.[#4686](https://github.com/ant-design/ant-design/pull/4686)
* Add Swedish localization for LocaleProvider. [#4455](https://github.com/ant-design/ant-design/pull/4455)
* Add French localization for LocaleProvider. [#4538](https://github.com/ant-design/ant-design/pull/4538)
* Added `onSearchChange` callback of Transfer. [#4464](https://github.com/ant-design/ant-design/pull/4464)
* Added `maskClosable` property of Modal.confirm. [#4488](https://github.com/ant-design/ant-design/pull/4488), [#4488](https://github.com/ant-design/ant-design/pull/4490)
* Form
* Added `options.onValuesChange` option, because `options.onFieldsChange` would be triggered multiply. [#2934](https://github.com/ant-design/ant-design/pull/2934)
* Added `props.form.getFieldsError` `props.form.isFieldTouched` `props.form.isFieldsTouched` options that can be used to disable submit button. [#4374](https://github.com/ant-design/ant-design/issues/4374)
* Added `hideRequiredMark` property. [#4732](https://github.com/ant-design/ant-design/pull/4732)
* Improvement upload list of Upload. [#4516](https://github.com/ant-design/ant-design/pull/4516)
* Upgrade rc-select to `6.7.1`.
* Fixed duplication `onChange` callback. [#156@rc-select](https://github.com/react-component/select/pull/156)
* Fixed displaying of initial value. [#152@rc-select](https://github.com/react-component/select/pull/152)
* Upgrade rc-tree-select to `1.9.0`.
* Added `treeDefaultExpandedKeys` property.[#43@rc-tree-select](https://github.com/react-component/tree-select/pull/43)
* Fixed an overflow-wrap issue. [#42@rc-tree-select](https://github.com/react-component/tree-select/pull/42)
* Added less variables: `@border-style-base` `@border-width-base` `@btn-danger-color` `@btn-danger-bg` and etc.
* Fixed Badge misplace issue when browser zoom above 100%. [#4747](https://github.com/ant-design/ant-design/issues/4747) [#4290](https://github.com/ant-design/ant-design/issues/4290)
* Fixed a mis-align issue of fixed header Table. [#4750](https://github.com/ant-design/ant-design/issues/4750)
* Fixed Table scrolling lag issue in IE. [#4522](https://github.com/ant-design/ant-design/issues/4522)
* Add icon aliases: `addfile` => `file-add`，`addfolder` => `folder-open`, and the old type names are still working. [#4758](https://github.com/ant-design/ant-design/issues/4758)
## 2.6.4
`2017-01-20`
* Improve RangePicker when selecting a preset date.[#4561](https://github.com/ant-design/ant-design/issues/4561)
* Fix DatePicker select time scroll issue.[#4412](https://github.com/ant-design/ant-design/issues/4412)
* Fix issue resulting in vertical Menu can't be controlled.[#3783](https://github.com/ant-design/ant-design/issues/3783)
* Fix Cascader's style when it's disabled.[#4648](https://github.com/ant-design/ant-design/issues/4648)
* Table
* Improve Table fixed header's scrollbar style.[#4637](https://github.com/ant-design/ant-design/issues/4637)
* Fix issue resulting in Table's header flashes when `loading` is true in Safari.[#4622](https://github.com/ant-design/ant-design/issues/4622)
* Fix multiple border issues. [#4647](https://github.com/ant-design/ant-design/issues/4647), [#4635](https://github.com/ant-design/ant-design/issues/4635)
* Fix `showHeader`'s default value.[#4658](https://github.com/ant-design/ant-design/issues/4658)
* Fix missing `TableColumnConfig` type.[#4660](https://github.com/ant-design/ant-design/issues/4660)
## 2.6.3
`2017-01-15`
* Fixed issue introduced in `2.6.2` that Popconfirm is not working. [#4606](https://github.com/ant-design/ant-design/issues/4606)
## 2.6.2
`2017-01-14`
* Added a Third-Party Library Page for recommending other greet react components. [Link](/docs/react/recommendation)
* Fixed misplaced Sider of Layout. [#4459](https://github.com/ant-design/ant-design/issues/4459)
* Fixed Input.Search wrong block layout and misplaced icon. [#4540](https://github.com/ant-design/ant-design/issues/4540)
* Added a customize Collapse panel demo. [Link](/components/collapse/#components-collapse-demo-custom)
* Table
* Enlarged the width of selection column and expand column.
* Fixed not-available pagination issue when property `pagination` is changed. [#4532](https://github.com/ant-design/ant-design/issues/4532)
* Fixed that three level filter menu is not working. [#4541](https://github.com/ant-design/ant-design/issues/4541)
* Fixed `column.filteredValue` issue of cannot being set to `null`.
* Now Carousel is undragglble and text-selectable defaultly.
* Added warnings when non-BreadcrumbItem node is nested under Breadcrumb. [#4403](https://github.com/ant-design/ant-design/issues/4403)
* Fixed Tooltip hidden issue when `onVisibleChange(visible)` return `true`. [#4579](https://github.com/ant-design/ant-design/issues/4579)
* Make TreeSelect panel default height smaller than screen height. [#4537](https://github.com/ant-design/ant-design/pull/4537)
* Added less variables of TimePicker and Spin.
* Replaced arrows of DatePicker year panel by year text. [#4415](https://github.com/ant-design/ant-design/issues/4415)
* Fixed TypeScript definites of AutoComplete and Form `[options.validateTrigger]`.
* Improved the animation details of Spin and Progress.
## 2.6.1
`2017-1-6`
* Fix style problem for Menu dark theme. [#4440](https://github.com/ant-design/ant-design/issues/4440)
* Fix TypeScript interface definition for `Select[tokenSeparators]` `Modal[afterClose]` `Input[name]` and so on. [#4441](https://github.com/ant-design/ant-design/pull/4441) [@eddhannay](https://github.com/eddhannay)
* Fix that `TimePicker[placeholder]` cannot be set to empty string. [#4446](https://github.com/ant-design/ant-design/pull/4446) [@jialeicui](https://github.com/jialeicui)
* Fix style problem in DatePicker year panel. [#4415](https://github.com/ant-design/ant-design/issues/4415)
* Fix that Table loading doesn't mask Pagination. [#4461](https://github.com/ant-design/ant-design/issues/4461)
* Fix align style for `Input[prefix|suffix]`. [commit](https://github.com/ant-design/ant-design/commit/c4ac4d1eca53ae2f6f4a1e15210b43745f283534)
* Fix align style for Cascader. [commit](https://github.com/ant-design/ant-design/commit/1fbebd4ecfff432e1b2261c9dfee4b9f471e7b1f)
## 2.6.0
`2017-1-2`
- Brand new color system. [pull/4426](https://github.com/ant-design/ant-design/pull/4426)
- Brand new color algorithm replacing the tint/shade system.
- Brand new color palattes generated by new algorithm. [Link](http://ant.design/docs/spec/colors)
- Change default font color.
- Add Layout component. [#3534](https://github.com/ant-design/ant-design/issues/3534)
- Add Grid playground demo. [commit/ee17ab](https://github.com/ant-design/ant-design/commit/ee17abfa9d0362c6f9baab4a9a09e57574583246)
- Input
- Support prefix and suffix. [#4226](https://github.com/ant-design/ant-design/issues/4226) [@ystarlongzi](https://github.com/ystarlongzi)
- InputGroup support compact display mode. [pull/4309](https://github.com/ant-design/ant-design/pull/4309)
- Spin support delayed display. [#4306](https://github.com/ant-design/ant-design/issues/4306)
- Fix the dislocation problem of Pagination in low resolution. [#4349](https://github.com/ant-design/ant-design/issues/4349)
- Fix wrapping display of Dropdown.Button. [pull/4355](https://github.com/ant-design/ant-design/pull/4355) [@Morhaus](https://github.com/Morhaus)
- Fix wrong background color of Cascader in disabled status. [#4434](https://github.com/ant-design/ant-design/issues/4434)
- Fix MonthPicker[monthCellContentRender] doesn't work, and some documentation errors. [#4394](https://github.com/ant-design/ant-design/issues/4394)
- Fix the extra border of ButtonGroup. [#4382](https://github.com/ant-design/ant-design/pull/4382) [@ystarlongzi](https://github.com/ystarlongzi)
- Fix wrong background color of the Submenu(horizontal mode). [#4414](https://github.com/ant-design/ant-design/issues/4414)
- Fix overlapping graphics with Select/Cascader in Form.Item with hasFeedback. [#4431](https://github.com/ant-design/ant-design/issues/4431) [@JesperWe](https://github.com/JesperWe)
- Reset border-radius of the first row in Table without header. [#4373](https://github.com/ant-design/ant-design/issues/4373)
- Improve the drag performance of Tree. [#4371](https://github.com/ant-design/ant-design/issues/4371)
- Improve official website and documentation, fix some bugs.
- Update rc-form to support nested style of getFieldDecorator[id].
## 2.5.3
`2016-12-24` 🎄🎄🎄
* Supports TypeScript@2.1. [#4208](https://github.com/ant-design/ant-design/issues/4208)
* Fix style issue resulting in nested Tabs. [#4317](https://github.com/ant-design/ant-design/issues/4317)
* Fix `onChange` callback issue resulting in Radio. [#4242](https://github.com/ant-design/ant-design/issues/4242) [@ystarlongzi](https://github.com/ystarlongzi)
* Fix a FormItem mis-aligin bug. [#4271](https://github.com/ant-design/ant-design/issues/4271)
* Fix background issue resulting in selected element of veritcal Menu.[#4253](https://github.com/ant-design/ant-design/issues/4253)
* Improve arguments type of `onVisibleChange` callback of Dropdown.[#4236](https://github.com/ant-design/ant-design/issues/4236) [@bang88](https://github.com/bang88)
* Improve first argument type of `onChange` callback of Cascader.[#4231](https://github.com/ant-design/ant-design/issues/4231) [@bang88](https://github.com/bang88)
* Improve default width of Datepicker[showTime]. [b912f1c](https://github.com/ant-design/ant-design/commit/b912f1cea6f470c16b8dd90554883460161cef47)
## 2.5.2
`2016-12-10`
* Improve selected item style of Menu.
* Fix issue resulting in Mention not responses `onFocus` and `onBlur`. [#4163](https://github.com/ant-design/ant-design/issues/4163)
* Fix issue resulting in there is a redundant shadow between `disabled` and `checked` Radio. [#4114](https://github.com/ant-design/ant-design/pull/4114) @jdz321
* Fix error when setting Momment `defaultValue` or `value` on RangePicker, TimePicker, Calendar. [#4147](https://github.com/ant-design/ant-design/issues/4147)
* Fix issue resulting in Affix disappears when it's uesed in animated Tabs. [#3943](https://github.com/ant-design/ant-design/issues/3943)
* Fix issue resulting in Cascader passes different `selectedOptions` to `onChange` when manually selecting and selecting by search. [#4096](https://github.com/ant-design/ant-design/issues/4096)
* Fix issue resulting in Tabs get offset, when too many tabs are opening. [#3637](https://github.com/ant-design/ant-design/issues/3637)
* Table
* Align text of grouped parent header to center.
* Fix issue resulting in `filterDropdownVisible` can't be set correctly. [#4162](https://github.com/ant-design/ant-design/issues/4162)
## 2.5.1
`2016-12-03`
* Improve website experience on mobile devices.
* Add some migrate warnings for `1.x` to `2.x`.
* ToolTip, Popover, Popconfirm support to wrap text node and multiple node directly now. [#3924](https://github.com/ant-design/ant-design/issues/3924)
* Anchor
* Fix current position bug when scroll fastly. [#4053](https://github.com/ant-design/ant-design/issues/4053)
* Fix a bug of parent component ref node is undefined. [#4037](https://github.com/ant-design/ant-design/issues/4037)
* Table
* Fix a selection problem when setting defaultChecked in rowSelection. [#4020](https://github.com/ant-design/ant-design/issues/4020)
* Fix grouping column title cannot work with filters. [#4099](https://github.com/ant-design/ant-design/issues/4099)
* Fix a misplace bug when using Popover over `Input[type="textarea"]`. [#4092](https://github.com/ant-design/ant-design/issues/4092)
* Fix Popconfirm `visible` is not-working problem. [#4068](https://github.com/ant-design/ant-design/issues/4068)
* Fix TimePicker can not override width by `style.width`.
* Unify Steps icon size. [#3817](https://github.com/ant-design/ant-design/issues/3817)
* Fix style details of Form, Button, Slider, Table.
## 2.5.0
`2016-11-25`
* Change the default theme to Alipay style and improve lots of style details.
* Supports server-side rendering. (`Mention` will throw warning for [draft-js](https://github.com/facebook/draft-js/issues/385)' issue)
* Introduce [Jest Snapshot](https://facebook.github.io/jest/docs/tutorial-react.html#snapshot-testing) to test the structure of components and SSR issues.
* Improve official website and documentation.
* Add [document](https://ant.design/docs/react/customize-theme) for customizing theme.
* Add [Sketch template files](https://ant.design/docs/resource/download).
* `LocaleProvider` supports Brazilian. [#4004](https://github.com/ant-design/ant-design/pull/4004) [@nathantn](https://github.com/nathantn)
* DatePicker
* DatePicker can determine whether to show "Today" button. [commit](https://github.com/ant-design/ant-design/commit/bbef274aae169d142e3e7e3ea0af922d48e6dd64)
* RangePicker can set presetted ranges. [demo](https://ant.design/components/date-picker/#components-date-picker-demo-presetted-ranges)
* Fix "Now" button doesn't work while `DatePicker[showTime]` is set. [#3748](https://github.com/ant-design/ant-design/issues/3748)
* Fix `RangePicker[format]` should work. [#3808](https://github.com/ant-design/ant-design/issues/3808)
* Fix issue that RangePicker `placeholder=['xx', 'xx']` not working.
* Add and update some icons. [#3977](https://github.com/ant-design/ant-design/pull/3977)
* New component `Input.Search`. [demo](https://ant.design/components/input/#components-input-demo-search-input)
* Mention onSelect event will get complete record. [#3867](https://github.com/ant-design/ant-design/issues/3867)
* Pagination can get current range. [demo](https://ant.design/components/pagination/#components-pagination-demo-total)
* Table
* We can control the visible of customized `filterDropdown`. [demo](https://ant.design/components/table/#components-table-demo-custom-filter-panel)
* Supports JSX-style columns. [demo](https://ant.design/components/table/#components-table-demo-jsx)
* Can listen the click event of table cell by `onCellClick`. [#3774](https://github.com/ant-design/ant-design/issues/3774)
* Fix border radius of head of border-less table.
* Fix that height of title and footer don't follow `Table[size]`. [commit](https://github.com/ant-design/ant-design/commit/9e6439b06cd099ab384a4a2f026f0def6e12bf23)
* Fix issue with selected status. [#3900](https://github.com/ant-design/ant-design/issues/3900)
* Upload
* Fix that children could not be `null`.
* Fix logic of preview. [commit](https://github.com/ant-design/ant-design/commit/e552880c32aaa3f5b0fb09a5e1fb7454c24d5378)
* Fix `z-index` of Badge. [#3898](https://github.com/ant-design/ant-design/issues/3898)
* Fix alignment of multi-line Checkbox. [#3971](https://github.com/ant-design/ant-design/issues/3971) [@flashback313](https://github.com/flashback313)
* Fix alignment of InputNumber while using with other form controls. [#3866(comment)](https://github.com/ant-design/ant-design/issues/3866#issuecomment-261148256)
* Fix style of `Menu.Divider`. [#3813](https://github.com/ant-design/ant-design/issues/3813)
* Fix that Popover should support Checkbox and Radio as children. [#3455](https://github.com/ant-design/ant-design/issues/3455)
* Fix height of `Select[combobox]`. [#3855](https://github.com/ant-design/ant-design/issues/3855)
* Fix style of actived Switch. [#3838](https://github.com/ant-design/ant-design/issues/3838)
* Fix that Transfer doesn't show "Not Found" while there is no search result. [#3996](https://github.com/ant-design/ant-design/issues/3996)
* Fix style of placeholder of TreeSelect. [#3841](https://github.com/ant-design/ant-design/issues/3841)
* Fix compile errors in TypeScript. [#3969](https://github.com/ant-design/ant-design/pull/3969) [@AlbertZheng](https://github.com/AlbertZheng)
* Fix that feedback icon should not affect users' operation. [#3891](https://github.com/ant-design/ant-design/issues/3891)
## 2.4.3
`2016-11-17`
* Fix errors in `Anchor` about querySelector, and make some experience Optimization .[#3832](https://github.com/ant-design/ant-design/issues/3832) [#3844](https://github.com/ant-design/ant-design/issues/3844)
## 2.4.2
`2016-11-13`
* Fix `Dropdown.Button` cannot popup menu.[#3815](https://github.com/ant-design/ant-design/issues/3815)
## 2.4.1
`2016-11-11`
* Fix `2.4.0` missing index files.
## 2.4.0
`2016-11-11`
* Adjust components structure.
* New [Anchor](https://ant.design/components/anchor) Component.
* Fix less variables `@font-size-base` and `@text-color`, add `@font-size-lg` `@text-color-secondary`.
@@ -743,8 +25,7 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
* Fix animate bug of `Progress` component. [#3784](https://github.com/ant-design/ant-design/issues/3784)
* Fix focus bug of `Select` component. [#3778](https://github.com/ant-design/ant-design/issues/3778)
* Fix `TimePicker` not support `format="HH"` bug. [#3793](https://github.com/ant-design/ant-design/issues/3793)
* Fix `Input` `suffix` mouse event responsive area. [#3714](https://github.com/ant-design/ant-design/issues/3714)
* Improve performance of `Table` selection. [#3757](https://github.com/ant-design/ant-design/pull/3757)
* Improve perfermance of `Table` selection. [#3757](https://github.com/ant-design/ant-design/pull/3757)
* Improve Carousel default UI style.
* Improve style of `Checkbox` and `Radio`. [#3590](https://github.com/ant-design/ant-design/issues/3590)
* Fix style of DatePickek, Form, Table.
@@ -773,13 +54,13 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
* Add `bordered` for `Collapse`.
* Improve `Tabs` switch animation.
* Improve `Radio` and `Checkbox` style when it's disabled and mouse hovered. [#3590](https://github.com/ant-design/ant-design/issues/3590)
* Optimize `Transfer` performance.[#2860](https://github.com/ant-design/ant-design/issues/2860)
* Opitimize `Transfer` performance.[#2860](https://github.com/ant-design/ant-design/issues/2860)
* Fix nested `Popover` style issue. [#3448](https://github.com/ant-design/ant-design/issues/3448)
* Fix issue resulting in server side render `Transfer` failed. [#3686](https://github.com/ant-design/ant-design/issues/3686)
* Fix issue resulting in preview image not display when `Upload` in `picture-card` mode. [#3706](https://github.com/ant-design/ant-design/pull/3706) [@denzw](https://github.com/denzw)
* DatePicker
* `onChange` will be triggered when `DatePicker` in `showTime` mode on blur now.
* Add `monthCellContentRender` for `MonthPicker`.
* Add `monthCellContentRender` and `cellContentRender` for `MonthPicker`.
* `Rangepicker` can input time manually now.[#3718](https://github.com/ant-design/ant-design/issues/3718)
* Add czech locale/translations.
* Badge
@@ -793,10 +74,10 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
* Add `type`. [#3560](https://github.com/ant-design/ant-design/issues/3560)
* Add `checkable`. [#3560](https://github.com/ant-design/ant-design/issues/3560)
* Radio.Group
* Add `className`.
* Add `className`。
* `null` or `undefined` `children` will be ignored.
* Select
* Add `tokenSeparators` to support automatic tokenization. [#2071](https://github.com/ant-design/ant-design/issues/2071)
* Add `tokenSeparators` to supoort automatic tokenization。[#2071](https://github.com/ant-design/ant-design/issues/2071)
* Add `onFocus` callback. [#3587](https://github.com/ant-design/ant-design/issues/3587)
* Fix issue resulting in Select can't display correct selected item text in `combobox` mode. [#3401](https://github.com/ant-design/ant-design/issues/3401)
@@ -893,7 +174,7 @@ If you want to read change logs before `2.0.0`, please visit [GitHub](https://gi
- Fix developers cannot call methods of react-slick. [#3164](https://github.com/ant-design/ant-design/issues/3164)
- Fix Steps.Step[icon] should support React.ReactNode. [#3159](https://github.com/ant-design/ant-design/issues/3159)
- Fix server-side render for Affix. [#3216](https://github.com/ant-design/ant-design/issues/3216)
- Fix Mention should support `onSelect` `placeholder`. [#3236](https://github.com/ant-design/ant-design/issues/3236) [#3226](https://github.com/ant-design/ant-design/issues/3226)
- Fix Mention should supoort `onSelect` `placeholder`. [#3236](https://github.com/ant-design/ant-design/issues/3236) [#3226](https://github.com/ant-design/ant-design/issues/3226)
- Fix Transfer cannot work with `getFieldDecorator`.
- Fix LocaleProvider doesn't work for time-related components.
- Fix Cascader doesn't show search text in search mode.
@@ -922,8 +203,6 @@ If you meet any problem while you try to upgrade from `antd@1.0.0`, feel free to
### 2.x Breaking changes
> We suggest you upgrade to lastest version of `2.x`.
There are some breaking changes in `antd@2.0.0`, and you need to modify your code to work with it.
* `value` and `defaultValue` of all the time-related components will not support type `String/Date`, please use [moment](http://momentjs.com/):
@@ -937,7 +216,7 @@ There are some breaking changes in `antd@2.0.0`, and you need to modify your cod
- <Calendar defaultValue={new Date('2010-10-10')} />
+ <Calendar defaultValue={moment('2010-10-10', 'YYYY-MM-DD')} />
```
* Parameters of type `Date/GregorianCalendar` of functions such as `onChange` and `onPanelChange`, plus other callback functions had been changed to type moment. Please consult [APIs of gregorian-calendar](https://github.com/yiminghe/gregorian-calendar) and [APIs of moment](http://momentjs.com/docs/), and update your code accordingly. And you can consult this [commit](https://github.com/ant-design/ant-design/commit/4026221d451b246956983bb42140142d4a48b7d7) to see how to update.
* Parameters of type `Date/GregorianCalendar` of functions such as `onChange` and `onPanelChange`, plus other callback functions had been changed to type moment. Please consult [APIs of gregorian-calendar](https://github.com/yiminghe/gregorian-calendar) and [APIs of moment](http://momentjs.com/docs/), and update your code accordingly. And you can consult this [commit](https://github.com/ant-design/ant-design/commit/5a4ebe535f0353089b30ac331bc4fb7877963371) to see how to upate.
Because the return value of `JSON.stringy(date: moment)` will lost time zone, we should use `.format` to convert date to string first, see related issue [#3082](https://github.com/ant-design/ant-design/issues/3082) for details:
```js
@@ -1035,6 +314,6 @@ The following change will throw some warnings in the console and it will still w
* [dva@1.0.0](https://github.com/dvajs/dva) is published and it is officially recommended framework [in real world](http://ant.design/docs/react/practical-projects).
* The officially recommended scaffold is [dva-cli](https://github.com/dvajs/dva-cli) now, the old `antd-init` is just for studying and demo.
## 1.11.4
## 1.0.0
Visit [GitHub](https://github.com/ant-design/ant-design/blob/1.x-stable/CHANGELOG.md) to read change logs from `0.x` to `1.x`.
Visit [GitHub](https://github.com/ant-design/ant-design/releases?after=2.0.0) to read change logs from `0.x` to `1.x`。

1201
CHANGELOG.zh-CN.md
View File

File diff suppressed because it is too large Load Diff

46
CODE_OF_CONDUCT.md
View File

@@ -1,46 +0,0 @@
# Contributor Covenant Code of Conduct
## Our Pledge
In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, nationality, personal appearance, race, religion, or sexual identity and orientation.
## Our Standards
Examples of behavior that contributes to creating a positive environment include:
* Using welcoming and inclusive language
* Being respectful of differing viewpoints and experiences
* Gracefully accepting constructive criticism
* Focusing on what is best for the community
* Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
* The use of sexualized language or imagery and unwelcome sexual attention or advances
* Trolling, insulting/derogatory comments, and personal or political attacks
* Public or private harassment
* Publishing others' private information, such as a physical or electronic address, without explicit permission
* Other conduct which could reasonably be considered inappropriate in a professional setting
## Our Responsibilities
Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
## Scope
This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at xingmin.zhu@alipay.com. The project team will review and investigate all complaints, and will respond in a way that it deems appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately.
Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at [http://contributor-covenant.org/version/1/4][version]
[homepage]: http://contributor-covenant.org
[version]: http://contributor-covenant.org/version/1/4/

95
README-zh_CN.md
View File

@@ -5,37 +5,21 @@
</p>
# Ant Design
[![](https://img.shields.io/travis/ant-design/ant-design.svg?style=flat-square)](https://travis-ci.org/ant-design/ant-design)
[![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master)
[![Dependency Status](https://img.shields.io/gemnasium/react-component/trigger.svg?style=flat-square)](https://gemnasium.com/ant-design/ant-design)
[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](https://npmjs.org/package/antd)
[![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
[![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
[![CDNJS](https://img.shields.io/cdnjs/v/antd.svg?style=flat-square)](https://cdnjs.com/libraries/antd)
[![Dependency Status](https://david-dm.org/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design)
[![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
一套企业级的 UI 设计语言和 React 实现。
[README in English](README.md)
## 特性
- 提炼自企业级中后台产品的交互语言和视觉风格。
- 开箱即用的高质量 React 组件。
- 提炼和服务企业级中后台产品的交互语言和视觉风格。
- [React Component](http://react-component.github.io/badgeboard/) 基础上精心封装的高质量 UI 组件。
- 使用 TypeScript 构建，提供完整的类型定义文件。
- 基于 npm + webpack + [dva](https://github.com/dvajs/dva) 的企业级开发框架。
## 支持环境
* 现代浏览器和 IE9 及以上。
* 支持服务端渲染。
* [Electron](http://electron.atom.io/)
## 参与共建 [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
`antd` 是一个开源项目，我们欢迎社区参与共建。如果你对此项目感兴趣，有 [很多方式](https://opensource.guide/how-to-contribute/) 进行参与。你可以 watch 这个仓库，加入 [issue 中的讨论](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3ADiscussion)，以及尝试实现一些 [已接受的特性](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22PR+welcome%22)。我们会给予有活跃贡献的社区成员 [collaborator 权限](https://github.com/ant-design/ant-design/issues/3222)。
- 基于 npm + webpack + babel + [dora](https://github.com/dora-js/dora) + [dva](https://github.com/dvajs/dva) 的企业级业务开发框架。
## 安装
@@ -58,10 +42,18 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
按需加载可通过此写法 `import DatePicker from 'antd/lib/date-picker'` 或使用插件 [babel-plugin-import](https://github.com/ant-design/babel-plugin-import)。
## 浏览器支持
现代浏览器和 IE9 及以上。
> [IE8 issues](https://github.com/xcatliu/react-ie8)
## TypeScript
```js
// tsconfig.json
tsconfig.json
```
{
"compilerOptions": {
"moduleResolution": "node",
@@ -71,55 +63,24 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
}
```
> 注意：
> - 设置 `allowSyntheticDefaultImports` 避免 `error TS1192: Module 'react' has no default export` 的错误。
> - 不要使用 @types/antd, antd 已经自带了 TypeScript 定义。
## 国际化
参考 [国际化文档](http://ant.design/docs/react/i18n)。
## 链接
- [首页](http://ant.design/index-cn)
- [UI 组件库](http://ant.design/docs/react/introduce-cn)
- [更新日志](CHANGELOG.en-US.md)
- [官方脚手架](https://github.com/dvajs/dva-cli)
- [首页](http://ant.design/)
- [React 实现](http://ant.design/docs/react/introduce)
- [修改记录](CHANGELOG.zh-CN.md)
- [开发脚手架](https://github.com/ant-design/antd-init/)
- [开发工具文档](http://ant-tool.github.io/)
- [脚手架市场](http://scaffold.ant.design)
- [React 底层基础组件](http://react-component.github.io/)
- [React 基础组件](http://react-component.github.io/)
- [移动端组件](http://mobile.ant.design)
- [动效](https://motion.ant.design)
- [设计规范速查手册](https://github.com/ant-design/ant-design/wiki/Ant-Design-%E8%AE%BE%E8%AE%A1%E5%9F%BA%E7%A1%80%E7%AE%80%E7%89%88)
- [开发者说明](https://github.com/ant-design/ant-design/wiki/Development)
- [版本发布规则](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [React 代码规范](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md)
- [组件设计原则](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md)
- [网站和组件开发说明](https://github.com/ant-design/ant-design/wiki/%E7%BD%91%E7%AB%99%E5%92%8C%E7%BB%84%E4%BB%B6%E5%BC%80%E5%8F%91%E8%AF%B4%E6%98%8E)
- [版本发布手册](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [社区贡献脚手架和范例](https://github.com/ant-design/ant-design/issues/129)
- [常见问题](https://github.com/ant-design/ant-design/wiki/FAQ)
- [CodePen 模板](http://codepen.io/benjycui/pen/KgPZrE?editors=001) for bug reports
- [CodePen 模板](http://codepen.io/benjycui/pen/KgPZrE?editors=001)
- [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
- [定制主题](http://ant.design/docs/react/customize-theme-cn)
## 本地开发
```bash
$ git clone git@github.com:ant-design/ant-design.git
$ npm install
$ npm start
```
打开浏览器访问 http://127.0.0.1:8001 ，更多本地开发文档参见: https://github.com/ant-design/ant-design/wiki/Development 。
## 如何贡献
在任何形式的参与前，请先阅读 [贡献者文档](https://github.com/ant-design/ant-design/blob/master/.github/CONTRIBUTING.md)。如果你希望参与贡献，欢迎 [Pull Request](https://github.com/ant-design/ant-design/pulls)，或给我们 [报告 Bug](http://new-issue.ant.design/)。
> 强烈推荐阅读 [《提问的智慧》](https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way)、[《如何向开源社区提问题》](https://github.com/seajs/seajs/issues/545) 和 [《如何有效地报告 Bug》](http://www.chiark.greenend.org.uk/%7Esgtatham/bugs-cn.html)、[《如何向开源项目提交无法解答的问题》](https://zhuanlan.zhihu.com/p/25795393)，更好的问题更容易获得帮助。
## 社区互助
如果您在使用的过程中碰到问题，可以通过下面几个途径寻求帮助，同时我们也鼓励资深用户通过下面的途径给新人提供帮助。
通过 Stack Overflow 或者 Segment Fault 提问时，建议加上 `antd` 标签。
1. [Stack Overflow](http://stackoverflow.com/questions/tagged/antd)（英文）
2. [Segment Fault](https://segmentfault.com/t/antd)（中文）
3. [![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
我们欢迎任何形式的贡献，有任何建议或意见您可以进行 [Pull Request](https://github.com/ant-design/ant-design/pulls)，或者给我们 [提问](https://github.com/ant-design/ant-design/issues)。

91
README.md
View File

@@ -5,37 +5,21 @@
</p>
# Ant Design
[![](https://img.shields.io/travis/ant-design/ant-design.svg?style=flat-square)](https://travis-ci.org/ant-design/ant-design)
[![Codecov](https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square)](https://codecov.io/gh/ant-design/ant-design/branch/master)
[![Dependency Status](https://img.shields.io/gemnasium/react-component/trigger.svg?style=flat-square)](https://gemnasium.com/ant-design/ant-design)
[![npm package](https://img.shields.io/npm/v/antd.svg?style=flat-square)](https://www.npmjs.org/package/antd)
[![NPM downloads](http://img.shields.io/npm/dm/antd.svg?style=flat-square)](https://npmjs.org/package/antd)
[![Percentage of issues still open](http://isitmaintained.com/badge/open/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
[![Gitter](https://badges.gitter.im/ant-design/ant-design-english.svg)](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
[![Join the chat at https://gitter.im/ant-design/ant-design](https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
[![Dependency Status](https://david-dm.org/ant-design/ant-design.svg?style=flat-square)](https://david-dm.org/ant-design/ant-design)
[![Average time to resolve an issue](http://isitmaintained.com/badge/resolution/ant-design/ant-design.svg)](http://isitmaintained.com/project/ant-design/ant-design "Average time to resolve an issue")
[![Join the chat at https://gitter.im/ant-design/ant-design](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
An enterprise-class UI design language and React-based implementation.
[中文 README](README-zh_CN.md)
## Features
- An enterprise-class UI design language for web applications.
- A set of high-quality React components out of the box.
- Written in TypeScript with complete define types.
- A npm + webpack + [dva](https://github.com/dvajs/dva) front-end development workflow.
## Environment Support
* Modern browsers and Internet Explorer 9+ (with [polyfills](https://ant.design/docs/react/getting-started#Compatibility))
* Server-side Rendering
* [Electron](http://electron.atom.io/)
## Let's build a better antd together [![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
`antd` is an open source project, improvements are welcomed. If you are interested in contributing to `antd`, you can watch this repository, join in [discussion](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3ADiscussion), or try to implement some [features which have been accepted](https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22PR+welcome%22). Actually, there are [many ways](https://opensource.guide/how-to-contribute/) to contribute. And we are always happy to [offer collaborator permission](https://github.com/ant-design/ant-design/issues/3222) for some active contributors.
- An enterprise-class design language and high quality UI.
- Graceful UI components out of the box, base on [React Component](http://react-component.github.io/badgeboard/).
- Writen in TypeScript with complete define types.
- A npm + webpack + babel + [dora](https://github.com/dora-js/dora) + [dva](https://github.com/dvajs/dva) development framework.
## Install
@@ -45,6 +29,8 @@ npm install antd
## Usage
### Use prebuilt bundle
```jsx
import { DatePicker } from 'antd';
ReactDOM.render(<DatePicker />, mountNode);
@@ -61,15 +47,13 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
- Use [babel-plugin-import](https://github.com/ant-design/babel-plugin-import) (Recommended)
```js
// .babelrc or babel-loader option
// .babelrc
{
"plugins": [
["import", { libraryName: "antd", style: "css" }] // `style: true` for less
]
"plugins": [["import", { libraryName: "antd", style: "css" }]]
}
```
Then you can import components from antd, equivalent to import manually below.
Then you can import components from antd directly.
```jsx
// import js and css modularly, parsed by babel-plugin-import
@@ -79,15 +63,22 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
- Manually import
```jsx
import DatePicker from 'antd/lib/date-picker'; // for js
import 'antd/lib/date-picker/style/css'; // for css
// import 'antd/lib/date-picker/style'; // that will import less
import DatePicker from 'antd/lib/date-picker'; // just for js
import 'antd/lib/date-picker/style/css'; // with style
```
### TypeScript
```js
// tsconfig.json
## Browser Support
Normal browsers and Internet Explorer 9+.
> [IE8 issues](https://github.com/xcatliu/react-ie8)
## TypeScript
tsconfig.json
```
{
"compilerOptions": {
"moduleResolution": "node",
@@ -97,42 +88,26 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
}
```
> Note:
> - set `allowSyntheticDefaultImports` to prevent `error TS1192: Module 'react' has no default export`.
> - Don't use @types/antd, antd provide a built-in ts definition already.
## Internationalization
See [i18n](http://ant.design/docs/react/i18n).
## Links
- [Home page](http://ant.design/)
- [UI library](http://ant.design/docs/react/introduce)
- [Change Log](CHANGELOG.en-US.md)
- [Offcial Scaffold Tool](https://github.com/dvajs/dva-cli/)
- [Development Tool](http://ant-tool.github.io/)
- [Scaffold Market](http://scaffold.ant.design)
- [rc-components](http://react-component.github.io/)
- [ChangeLog](CHANGELOG.en-US.md)
- [Scaffold tool](https://github.com/ant-design/antd-init/)
- [Development tool](http://ant-tool.github.io/)
- [React components](http://react-component.github.io/)
- [Mobile UI](http://mobile.ant.design)
- [Motion](https://motion.ant.design)
- [React style guide](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-code-style.md)
- [React component design guide](https://github.com/react-component/react-component.github.io/blob/master/docs/zh-cn/component-design.md)
- [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
- [Boilerplates](https://github.com/ant-design/ant-design/issues/129)
- [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ)
- [CodePen boilerplate](http://codepen.io/benjycui/pen/KgPZrE?editors=001) for bug reports
- [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
- [Customize Theme](http://ant.design/docs/react/customize-theme)
## Development
```bash
$ git clone git@github.com:ant-design/ant-design.git
$ npm install
$ npm start
```
Open your browser and visit http://127.0.0.1:8001 , see more at https://github.com/ant-design/ant-design/wiki/Development .
## Contributing
We welcome all contributions, please read our [CONTRIBUTING.md](https://github.com/ant-design/ant-design/blob/master/.github/CONTRIBUTING.md) first. You can submit any ideas as [pull requests](https://github.com/ant-design/ant-design/pulls) or as [GitHub issues](https://github.com/ant-design/ant-design/issues). If you'd like to improve code, check out the [Development Instructions](https://github.com/ant-design/ant-design/wiki/Development) and have a good time! :)
We welcome all contributions, please read our [CONTRIBUTING.md](https://github.com/ant-design/ant-design/blob/master/.github/CONTRIBUTING.md) first. You can submit any ideas as [pull requests](https://github.com/ant-design/ant-design/pulls) or as a [GitHub issue](https://github.com/ant-design/ant-design/issues). If you'd like to improve code, check out the [Development Instruction](https://github.com/ant-design/ant-design/wiki/Development) and have a good time! :)

58
components/__tests__/__snapshots__/index.test.js.snap
View File

@@ -1,58 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`antd exports modules correctly 1`] = `
Array [
"Affix",
"Anchor",
"AutoComplete",
"Alert",
"Avatar",
"BackTop",
"Badge",
"Breadcrumb",
"Button",
"Calendar",
"Card",
"Collapse",
"Carousel",
"Cascader",
"Checkbox",
"Col",
"DatePicker",
"Dropdown",
"Form",
"Icon",
"Input",
"InputNumber",
"Layout",
"LocaleProvider",
"message",
"Menu",
"Modal",
"notification",
"Pagination",
"Popconfirm",
"Popover",
"Progress",
"Radio",
"Rate",
"Row",
"Select",
"Slider",
"Spin",
"Steps",
"Switch",
"Table",
"Transfer",
"Tree",
"TreeSelect",
"Tabs",
"Tag",
"TimePicker",
"Timeline",
"Tooltip",
"Mention",
"Upload",
"version",
]
`;

7
components/__tests__/index.test.js
View File

@@ -1,7 +0,0 @@
import * as antd from '..';
describe('antd', () => {
it('exports modules correctly', () => {
expect(Object.keys(antd)).toMatchSnapshot();
});
});

29
components/_util/__tests__/util.test.js
View File

@@ -1,29 +0,0 @@
import throttleByAnimationFrame from '../throttleByAnimationFrame';
jest.useFakeTimers();
describe('Test utils function', () => {
it('throttle function should work', () => {
const callback = jest.fn();
const throttled = throttleByAnimationFrame(callback);
expect(callback).not.toBeCalled();
throttled();
throttled();
jest.runAllTimers();
expect(callback).toBeCalled();
expect(callback.mock.calls.length).toBe(1);
});
it('throttle function should be canceled', () => {
const callback = jest.fn();
const throttled = throttleByAnimationFrame(callback);
throttled();
throttled.cancel();
jest.runAllTimers();
expect(callback).not.toBeCalled();
});
});

22
components/_util/getLocale.tsx
View File

@@ -1,26 +1,10 @@
import assign from 'object-assign';
export function getComponentLocale(props, context, componentName, getDefaultLocale) {
let locale: any = {};
if (context && context.antLocale && context.antLocale[componentName]) {
locale = context.antLocale[componentName];
} else {
const defaultLocale = getDefaultLocale();
// TODO: make default lang of antd be English
// https://github.com/ant-design/ant-design/issues/6334
locale = defaultLocale.default || defaultLocale;
}
export default function getLocale(props, context, componentName, getDefaultLocale) {
const locale = context && context.antLocale && context.antLocale[componentName] ?
context.antLocale[componentName] : getDefaultLocale();
const result = assign({}, locale, props.locale);
result.lang = assign({}, locale.lang, props.locale.lang);
return result;
}
export function getLocaleCode(context) {
const localeCode = context.antLocale && context.antLocale.locale;
// Had use LocaleProvide but didn't set locale
if (context.antLocale && context.antLocale.exist && !localeCode) {
return 'zh-cn';
}
return localeCode;
}

35
components/_util/getRequestAnimationFrame.tsx
View File

@@ -1,16 +1,3 @@
const availablePrefixs = ['moz', 'ms', 'webkit'];
function requestAnimationFramePolyfill() {
let lastTime = 0;
return function(callback) {
const currTime = new Date().getTime();
const timeToCall = Math.max(0, 16 - (currTime - lastTime));
const id = window.setTimeout(function() { callback(currTime + timeToCall); }, timeToCall);
lastTime = currTime + timeToCall;
return id;
};
}
export default function getRequestAnimationFrame() {
if (typeof window === 'undefined') {
return () => {};
@@ -18,26 +5,8 @@ export default function getRequestAnimationFrame() {
if (window.requestAnimationFrame) {
return window.requestAnimationFrame;
}
const prefix = availablePrefixs.filter(key => `${key}RequestAnimationFrame` in window)[0];
const prefix = ['moz', 'ms', 'webkit'].filter(key => `${key}RequestAnimationFrame` in window)[0];
return prefix
? window[`${prefix}RequestAnimationFrame`]
: requestAnimationFramePolyfill();
}
export function cancelRequestAnimationFrame(id) {
if (typeof window === 'undefined') {
return null;
}
if (window.cancelAnimationFrame) {
return window.cancelAnimationFrame(id);
}
const prefix = availablePrefixs.filter(key =>
`${key}CancelAnimationFrame` in window || `${key}CancelRequestAnimationFrame` in window,
)[0];
return prefix ?
(window[`${prefix}CancelAnimationFrame`] || window[`${prefix}CancelRequestAnimationFrame`]).call(this, id)
: clearTimeout(id);
: callback => setTimeout(callback, 1000 / 60);
}

10
components/_util/isFlexSupported.tsx
View File

@@ -1,10 +0,0 @@
export default function isFlexSupported() {
if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
const { documentElement } = window.document;
return 'flex' in documentElement.style ||
'webkitFlex' in documentElement.style ||
'Flex' in documentElement.style ||
'msFlex' in documentElement.style;
}
return false;
}

18
components/_util/openAnimation.tsx
View File

@@ -1,37 +1,21 @@
import cssAnimation from 'css-animation';
import getRequestAnimationFrame, { cancelRequestAnimationFrame } from './getRequestAnimationFrame';
const reqAnimFrame = getRequestAnimationFrame();
function animate(node, show, done) {
let height;
let requestAnimationFrameId;
return cssAnimation(node, 'ant-motion-collapse', {
start() {
if (!show) {
node.style.height = `${node.offsetHeight}px`;
node.style.opacity = 1;
} else {
height = node.offsetHeight;
node.style.height = 0;
node.style.opacity = 0;
}
},
active() {
if (requestAnimationFrameId) {
cancelRequestAnimationFrame(requestAnimationFrameId);
}
requestAnimationFrameId = reqAnimFrame(() => {
node.style.height = `${show ? height : 0}px`;
node.style.opacity = show ? 1 : 0;
});
node.style.height = `${show ? height : 0}px`;
},
end() {
if (requestAnimationFrameId) {
cancelRequestAnimationFrame(requestAnimationFrameId);
}
node.style.height = '';
node.style.opacity = '';
done();
},
});

12
components/_util/splitObject.tsx Normal file
View File

@@ -0,0 +1,12 @@
export default function splitObject(obj, parts): Array<any> {
const left = {};
const right = {};
Object.keys(obj).forEach((k) => {
if (parts.indexOf(k) !== -1) {
left[k] = obj[k];
} else {
right[k] = obj[k];
}
});
return [left, right];
}

47
components/_util/throttleByAnimationFrame.tsx
View File

@@ -1,47 +0,0 @@
import getRequestAnimationFrame, { cancelRequestAnimationFrame } from '../_util/getRequestAnimationFrame';
const reqAnimFrame = getRequestAnimationFrame();
export default function throttleByAnimationFrame(fn) {
let requestId;
const later = args => () => {
requestId = null;
fn(...args);
};
const throttled = (...args) => {
if (requestId == null) {
requestId = reqAnimFrame(later(args));
}
};
(throttled as any).cancel = () => cancelRequestAnimationFrame(requestId);
return throttled;
}
export function throttleByAnimationFrameDecorator() {
return function(target, key, descriptor) {
let fn = descriptor.value;
let definingProperty = false;
return {
configurable: true,
get() {
if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
return fn;
}
let boundFn = throttleByAnimationFrame(fn.bind(this));
definingProperty = true;
Object.defineProperty(this, key, {
value: boundFn,
configurable: true,
writable: true,
});
definingProperty = false;
return boundFn;
},
};
};
}

8
components/_util/triggerEvent.tsx
View File

@@ -1,8 +0,0 @@
export default function triggerEvent(el, type) {
if ('createEvent' in document) {
// modern browsers, IE9+
const e = document.createEvent('HTMLEvents');
e.initEvent(type, false, true);
el.dispatchEvent(e);
}
}

68
components/affix/__tests__/Affix.test.js
View File

@@ -1,68 +0,0 @@
import React from 'react';
import { mount } from 'enzyme';
import Affix from '..';
import Button from '../../button';
jest.useFakeTimers();
const events = {};
class AffixMounter extends React.Component {
componentDidMount() {
this.container.scrollTop = 100;
this.container.addEventListener = jest.fn().mockImplementation((event, cb) => {
events[event] = cb;
});
}
getTarget = () => {
return this.container;
}
render() {
return (<div
style={{
height: 100,
overflowY: 'scroll',
}}
ref={(node) => { this.container = node; }}
>
<div
className="background"
style={{
paddingTop: 60,
height: 300,
}}
>
<Affix
target={() => this.container}
ref={ele => this.affix = ele}
>
<Button type="primary" >
Fixed at the top of container
</Button>
</Affix>
</div>
</div>);
}
}
describe('Affix Render', () => {
it('Anchor render perfectly', () => {
document.body.innerHTML = '<div id="mounter" />';
const wrapper = mount(<AffixMounter />, { attachTo: document.getElementById('mounter') });
jest.runAllTimers();
wrapper.node.affix.refs.fixedNode.parentNode.getBoundingClientRect = jest.fn(() => {
return {
bottom: 100, height: 28, left: 0, right: 0, top: -50, width: 195,
};
});
events.scroll({
type: 'scroll',
});
jest.runAllTimers();
expect(wrapper.node.affix.state.affixStyle).not.toBe(null);
});
});

77
components/affix/__tests__/__snapshots__/demo.test.js.snap
View File

@@ -1,77 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/affix/demo/basic.md correctly 1`] = `
<div>
<div>
<div
class=""
>
<button
class="ant-btn ant-btn-primary"
type="button"
>
<span>
Affix top
</span>
</button>
</div>
</div>
<br />
<div>
<div
class=""
>
<button
class="ant-btn ant-btn-primary"
type="button"
>
<span>
Affix bottom
</span>
</button>
</div>
</div>
</div>
`;
exports[`renders ./components/affix/demo/on-change.md correctly 1`] = `
<div>
<div
class=""
>
<button
class="ant-btn"
type="button"
>
<span>
120px to affix top
</span>
</button>
</div>
</div>
`;
exports[`renders ./components/affix/demo/target.md correctly 1`] = `
<div
class="scrollable-container"
>
<div
class="background"
>
<div>
<div
class=""
>
<button
class="ant-btn ant-btn-primary"
type="button"
>
<span>
Fixed at the top of container
</span>
</button>
</div>
</div>
</div>
</div>
`;

3
components/affix/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('affix');

30
components/affix/demo/target.md
View File

@@ -16,32 +16,36 @@ Set a `target` for 'Affix', which is listen to scroll event of target element (d
````jsx
import { Affix, Button } from 'antd';
class Demo extends React.Component {
render() {
return (
<div className="scrollable-container" ref={(node) => { this.container = node; }}>
const Demo = () => {
return (
<div className="view-port">
<div id="scrollable-container">
<div className="background">
<Affix target={() => this.container}>
<Button type="primary">
Fixed at the top of container
</Button>
<br />
<br />
<br />
<Affix target={() => document.getElementById('scrollable-container')} offsetTop={20}>
<Button type="primary">Fixed at the top of container</Button>
</Affix>
</div>
</div>
);
}
}
</div>
);
};
ReactDOM.render(<Demo />, mountNode);
````
<style>
#components-affix-demo-target .scrollable-container {
#components-affix-demo-target .view-port {
height: 100px;
overflow: hidden;
}
#components-affix-demo-target #scrollable-container {
height: 100%;
overflow-y: scroll;
}
#components-affix-demo-target .background {
padding-top: 60px;
height: 300px;
background-image: url('https://zos.alipayobjects.com/rmsportal/RmjwQiJorKyobvI.jpg');
}

9
components/affix/index.en-US.md
View File

@@ -8,17 +8,16 @@ Make an element sticky to viewport.
## When To Use
When user browses a long web page, some content need to stick to the viewport. This is common for menus and actions.
When user browses a long web page, some content need to sticky to viewport. It is common for menus and actions.
Please note that Affix should not cover other content on the page, especially when the size of the viewport is small.
Please note that Affix should not cover other content in page, especially when the size of viewport is small.
## API
| Property | Description | Type | Default |
|--------------|-----------------------|----------|--------------|
| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |
| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |
| target | specifies the scrollable area dom node | () => HTMLElement | () => window |
| offsetTop | Pixels to offset from top when calculating position of scroll | Number | 0 |
| offsetBottom | Pixels to offset from bottom when calculating position of scroll | Number | - |
| onChange | Callback when affix state is changed | Function(affixed) | - |
**Note:** Children of `Affix` can not be `position: absolute`, but you can set `Affix` as `position: absolute`:

69
components/affix/index.tsx
View File

@@ -1,12 +1,10 @@
import React from 'react';
import ReactDOM from 'react-dom';
import PropTypes from 'prop-types';
import addEventListener from 'rc-util/lib/Dom/addEventListener';
import classNames from 'classnames';
import shallowequal from 'shallowequal';
import omit from 'omit.js';
import getScroll from '../_util/getScroll';
import { throttleByAnimationFrameDecorator } from '../_util/throttleByAnimationFrame';
function getTargetRect(target): ClientRect {
return target !== window ?
@@ -30,8 +28,6 @@ function getOffset(element: HTMLElement, target) {
scrollTop - clientTop,
left: elemRect.left - targetRect.left +
scrollLeft - clientLeft,
width: elemRect.width,
height: elemRect.height,
};
}
@@ -40,7 +36,7 @@ function noop() {}
function getDefaultTarget() {
return typeof window !== 'undefined' ?
window : null;
}
};
// Affix
export interface AffixProps {
@@ -61,14 +57,13 @@ export interface AffixProps {
export default class Affix extends React.Component<AffixProps, any> {
static propTypes = {
offsetTop: PropTypes.number,
offsetBottom: PropTypes.number,
target: PropTypes.func,
offsetTop: React.PropTypes.number,
offsetBottom: React.PropTypes.number,
target: React.PropTypes.func,
};
scrollEvent: any;
resizeEvent: any;
timeout: any;
refs: {
fixedNode: HTMLElement;
};
@@ -100,16 +95,18 @@ export default class Affix extends React.Component<AffixProps, any> {
});
}
setPlaceholderStyle(placeholderStyle) {
setPlaceholderStyle(e, placeholderStyle) {
const originalPlaceholderStyle = this.state.placeholderStyle;
if (e.type === 'resize') {
return;
}
if (shallowequal(placeholderStyle, originalPlaceholderStyle)) {
return;
}
this.setState({ placeholderStyle });
}
@throttleByAnimationFrameDecorator()
updatePosition(e) {
updatePosition = (e) => {
let { offsetTop, offsetBottom, offset, target = getDefaultTarget } = this.props;
const targetNode = target();
@@ -139,53 +136,43 @@ export default class Affix extends React.Component<AffixProps, any> {
const targetRect = getTargetRect(targetNode);
const targetInnerHeight =
(targetNode as Window).innerHeight || (targetNode as HTMLElement).clientHeight;
if (scrollTop > elemOffset.top - (offsetTop as number) && offsetMode.top) {
if (scrollTop > elemOffset.top - offsetTop && offsetMode.top) {
// Fixed Top
const width = elemOffset.width;
this.setAffixStyle(e, {
position: 'fixed',
top: targetRect.top + (offsetTop as number),
top: targetRect.top + offsetTop,
left: targetRect.left + elemOffset.left,
width,
width: affixNode.offsetWidth,
});
this.setPlaceholderStyle({
width,
this.setPlaceholderStyle(e, {
width: affixNode.offsetWidth,
height: affixNode.offsetHeight,
});
} else if (
scrollTop < elemOffset.top + elemSize.height + (offsetBottom as number) - targetInnerHeight &&
scrollTop < elemOffset.top + elemSize.height + offsetBottom - targetInnerHeight &&
offsetMode.bottom
) {
// Fixed Bottom
const targetBottomOffet = targetNode === window ? 0 : (window.innerHeight - targetRect.bottom);
const width = elemOffset.width;
this.setAffixStyle(e, {
position: 'fixed',
bottom: targetBottomOffet + (offsetBottom as number),
bottom: targetBottomOffet + offsetBottom,
left: targetRect.left + elemOffset.left,
width,
width: affixNode.offsetWidth,
});
this.setPlaceholderStyle({
width,
this.setPlaceholderStyle(e, {
width: affixNode.offsetWidth,
height: affixNode.offsetHeight,
});
} else {
const { affixStyle } = this.state;
if (e.type === 'resize' && affixStyle && affixStyle.position === 'fixed' && affixNode.offsetWidth) {
this.setAffixStyle(e, { ...affixStyle, width: affixNode.offsetWidth });
} else {
this.setAffixStyle(e, null);
}
this.setPlaceholderStyle(null);
this.setAffixStyle(e, null);
this.setPlaceholderStyle(e, null);
}
}
componentDidMount() {
const target = this.props.target || getDefaultTarget;
// Wait for parent component ref has its value
this.timeout = setTimeout(() => {
this.setTargetEventListeners(target);
});
this.setTargetEventListeners(target);
}
componentWillReceiveProps(nextProps) {
@@ -200,16 +187,10 @@ export default class Affix extends React.Component<AffixProps, any> {
componentWillUnmount() {
this.clearScrollEventListeners();
clearTimeout(this.timeout);
(this.updatePosition as any).cancel();
}
setTargetEventListeners(getTarget) {
const target = getTarget();
if (!target) {
return;
}
this.clearScrollEventListeners();
this.scrollEvent = addEventListener(target, 'scroll', this.updatePosition);
this.resizeEvent = addEventListener(target, 'resize', this.updatePosition);
}
@@ -227,10 +208,10 @@ export default class Affix extends React.Component<AffixProps, any> {
[this.props.prefixCls || 'ant-affix']: this.state.affixStyle,
});
const props = omit(this.props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target', 'onChange']);
const placeholderStyle = { ...this.state.placeholderStyle, ...this.props.style };
const props = omit(this.props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target']);
return (
<div {...props} style={placeholderStyle}>
<div {...props} style={this.state.placeholderStyle}>
<div className={className} ref="fixedNode" style={this.state.affixStyle}>
{this.props.children}
</div>

6
components/affix/index.zh-CN.md
View File

@@ -17,9 +17,9 @@ title: Affix
| 成员 | 说明 | 类型 | 默认值 |
|-------------|----------------|--------------------|--------------|
| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number | |
| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number | |
| target | 设置 `Affix` 需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | () => HTMLElement | () => window |
| offsetTop | 距离窗口顶部达到指定偏移量后触发 | Number | |
| offsetBottom | 距离窗口底部达到指定偏移量后触发 | Number | |
| target | 设置 `Affix` 需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | Function | () => window |
| onChange | 固定状态改变时触发的回调函数 | Function(affixed) | 无 |
**注意：**`Affix` 内的元素不要使用绝对定位，如需要绝对定位的效果，可以直接设置 `Affix` 为绝对定位：

424
components/alert/__tests__/__snapshots__/demo.test.js.snap
View File

@@ -1,424 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
<div>
<div
class="ant-alert ant-alert-warning ant-alert-banner"
data-show="true"
>
<i
class="anticon anticon-exclamation-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Warning text
</span>
<span
class="ant-alert-description"
/>
</div>
<br />
<div
class="ant-alert ant-alert-warning ant-alert-banner"
data-show="true"
>
<i
class="anticon anticon-exclamation-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Very long warning text warning text text text text text text text
</span>
<span
class="ant-alert-description"
/>
<a
class="ant-alert-close-icon"
>
<i
class="anticon anticon-cross"
/>
</a>
</div>
<br />
<div
class="ant-alert ant-alert-warning ant-alert-no-icon ant-alert-banner"
data-show="true"
>
<span
class="ant-alert-message"
>
Warning text without icon
</span>
<span
class="ant-alert-description"
/>
</div>
<br />
<div
class="ant-alert ant-alert-error ant-alert-banner"
data-show="true"
>
<i
class="anticon anticon-cross-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Error text
</span>
<span
class="ant-alert-description"
/>
</div>
</div>
`;
exports[`renders ./components/alert/demo/basic.md correctly 1`] = `
<div
class="ant-alert ant-alert-success ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Success Text
</span>
<span
class="ant-alert-description"
/>
</div>
`;
exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
<div>
<div
class="ant-alert ant-alert-warning ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text
</span>
<span
class="ant-alert-description"
/>
<a
class="ant-alert-close-icon"
>
<i
class="anticon anticon-cross"
/>
</a>
</div>
<div
class="ant-alert ant-alert-error ant-alert-with-description ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Error Text
</span>
<span
class="ant-alert-description"
>
Error Description Error Description Error Description Error Description Error Description Error Description
</span>
<a
class="ant-alert-close-icon"
>
<i
class="anticon anticon-cross"
/>
</a>
</div>
</div>
`;
exports[`renders ./components/alert/demo/close-text.md correctly 1`] = `
<div
class="ant-alert ant-alert-info ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Info Text
</span>
<span
class="ant-alert-description"
/>
<a
class="ant-alert-close-icon"
>
Close Now
</a>
</div>
`;
exports[`renders ./components/alert/demo/description.md correctly 1`] = `
<div>
<div
class="ant-alert ant-alert-success ant-alert-with-description ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Success Text
</span>
<span
class="ant-alert-description"
>
Success Description Success Description Success Description
</span>
</div>
<div
class="ant-alert ant-alert-info ant-alert-with-description ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Info Text
</span>
<span
class="ant-alert-description"
>
Info Description Info Description Info Description Info Description
</span>
</div>
<div
class="ant-alert ant-alert-warning ant-alert-with-description ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Warning Text
</span>
<span
class="ant-alert-description"
>
Warning Description Warning Description Warning Description Warning Description
</span>
</div>
<div
class="ant-alert ant-alert-error ant-alert-with-description ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Error Text
</span>
<span
class="ant-alert-description"
>
Error Description Error Description Error Description Error Description
</span>
</div>
</div>
`;
exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
<div>
<div
class="ant-alert ant-alert-success"
data-show="true"
>
<i
class="anticon anticon-check-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Success Tips
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-info"
data-show="true"
>
<i
class="anticon anticon-info-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Informational Notes
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-warning"
data-show="true"
>
<i
class="anticon anticon-exclamation-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Warning
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-error"
data-show="true"
>
<i
class="anticon anticon-cross-circle ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Error
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-success ant-alert-with-description"
data-show="true"
>
<i
class="anticon anticon-check-circle-o ant-alert-icon"
/>
<span
class="ant-alert-message"
>
success tips
</span>
<span
class="ant-alert-description"
>
Detailed description and advices about successful copywriting.
</span>
</div>
<div
class="ant-alert ant-alert-info ant-alert-with-description"
data-show="true"
>
<i
class="anticon anticon-info-circle-o ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Informational Notes
</span>
<span
class="ant-alert-description"
>
Additional description and informations about copywriting.
</span>
</div>
<div
class="ant-alert ant-alert-warning ant-alert-with-description"
data-show="true"
>
<i
class="anticon anticon-exclamation-circle-o ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Warning
</span>
<span
class="ant-alert-description"
>
This is a warning notice about copywriting.
</span>
</div>
<div
class="ant-alert ant-alert-error ant-alert-with-description"
data-show="true"
>
<i
class="anticon anticon-cross-circle-o ant-alert-icon"
/>
<span
class="ant-alert-message"
>
Error
</span>
<span
class="ant-alert-description"
>
This is an error message about copywriting.
</span>
</div>
</div>
`;
exports[`renders ./components/alert/demo/style.md correctly 1`] = `
<div>
<div
class="ant-alert ant-alert-success ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Success Text
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-info ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Info Text
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-warning ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Warning Text
</span>
<span
class="ant-alert-description"
/>
</div>
<div
class="ant-alert ant-alert-error ant-alert-no-icon"
data-show="true"
>
<span
class="ant-alert-message"
>
Error Text
</span>
<span
class="ant-alert-description"
/>
</div>
</div>
`;

3
components/alert/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('alert');

9
components/alert/demo/banner.md
View File

@@ -1,6 +1,5 @@
---
order: 6
iframe: 250
title:
zh-CN: 顶部公告
en-US: Banner
@@ -8,11 +7,11 @@ title:
## zh-CN
页面顶部通告形式，默认有图标且`type` 为 'warning'。
用作顶部公告时，默认有图标，`type` 为 'warning'，并有特殊样式。
## en-US
Display Alert as a banner at top of page.
When `Alert` is used as banner, it has particular style, Icon and `type`(warning) are specified by default.
````jsx
import { Alert } from 'antd';
@@ -22,10 +21,6 @@ ReactDOM.render(
<Alert message="Warning text" banner />
<br />
<Alert message="Very long warning text warning text text text text text text text" banner closable />
<br />
<Alert showIcon={false} message="Warning text without icon" banner />
<br />
<Alert type="error" message="Error text" banner />
</div>
, mountNode);
````

6
components/alert/demo/basic.md
View File

@@ -20,9 +20,3 @@ ReactDOM.render(
<Alert message="Success Text" type="success" />
, mountNode);
````
<style>
.ant-alert {
margin-bottom: 16px;
}
</style>

16
components/alert/index.en-US.md
View File

@@ -9,17 +9,17 @@ Alert component for feedback.
## When To Use
- When you need to show alert messages for users.
- When you need a persistent static container which is closable by user actions.
- When you need a persist static container, and closable by user actions.
## API
| Property | Description | Type | Default |
|----------- |--------------------------------------------------------- | ---------- |-------|
| type | Type of Alert styles, options:`success`, `info`, `warning`, `error` | string | `info`, in `banner` mode it's `warning` |
| closable | Whether Alert can be closed | boolean | - |
| closeText | Close text to show | string\|ReactNode | - |
| message | Content of Alert | string\|ReactNode | - |
| description | Additional content of Alert | string\|ReactNode | - |
| type | Type of Alert styles, options:`success`, `info`, `warning`, `error` | String | `info` |
| closable | Whether Alert can be closed | Boolean | - |
| closeText | Close text to show | React.Node | - |
| message | Content of Alert | React.Node | - |
| description | Additional content of Alert | React.Node | - |
| onClose | Callback when close Alert | Function | - |
| showIcon | Whether to show icon | boolean | false, in `banner` mode it's true |
| banner | Whether to show as banner | boolean | false |
| showIcon | Whether to show icon | Boolean | false |
| banner | Whether to show as banner | Boolean | false |

31
components/alert/index.tsx
View File

@@ -4,7 +4,7 @@ import Animate from 'rc-animate';
import Icon from '../icon';
import classNames from 'classnames';
function noop() { }
function noop() {}
export interface AlertProps {
/**
@@ -20,7 +20,7 @@ export interface AlertProps {
/** Additional content of Alert */
description?: React.ReactNode;
/** Callback when close Alert */
onClose?: React.MouseEventHandler<HTMLAnchorElement>;
onClose?: React.MouseEventHandler<any>;
/** Whether to show icon */
showIcon?: boolean;
style?: React.CSSProperties;
@@ -30,14 +30,17 @@ export interface AlertProps {
}
export default class Alert extends React.Component<AlertProps, any> {
constructor(props: AlertProps) {
static defaultProps = {
type: 'info',
};
constructor(props) {
super(props);
this.state = {
closing: true,
closed: false,
};
}
handleClose = (e: React.MouseEvent<HTMLAnchorElement>) => {
handleClose = (e) => {
e.preventDefault();
let dom = ReactDOM.findDOMNode(this) as HTMLElement;
dom.style.height = `${dom.offsetHeight}px`;
@@ -63,9 +66,9 @@ export default class Alert extends React.Component<AlertProps, any> {
} = this.props;
// banner模式默认有 Icon
showIcon = banner && showIcon === undefined ? true : showIcon;
showIcon = showIcon || banner;
// banner模式默认为警告
type = banner && type === undefined ? 'warning' : type || 'info';
type = banner ? 'warning' : type;
let iconType = '';
switch (type) {
@@ -90,25 +93,21 @@ export default class Alert extends React.Component<AlertProps, any> {
iconType += '-o';
}
let alertCls = classNames(prefixCls, {
let alertCls = classNames({
[prefixCls]: true,
[`${prefixCls}-${type}`]: true,
[`${prefixCls}-close`]: !this.state.closing,
[`${prefixCls}-with-description`]: !!description,
[`${prefixCls}-no-icon`]: !showIcon,
[`${prefixCls}-banner`]: !!banner,
}, className);
[className]: !!className,
});
// closeable when closeText is assigned
if (closeText) {
closable = true;
}
const closeIcon = closable ? (
<a onClick={this.handleClose} className={`${prefixCls}-close-icon`}>
{closeText || <Icon type="cross" />}
</a>
) : null;
return this.state.closed ? null : (
<Animate
component=""
@@ -120,7 +119,9 @@ export default class Alert extends React.Component<AlertProps, any> {
{showIcon ? <Icon className={`${prefixCls}-icon`} type={iconType} /> : null}
<span className={`${prefixCls}-message`}>{message}</span>
<span className={`${prefixCls}-description`}>{description}</span>
{closeIcon}
{closable ? <a onClick={this.handleClose} className={`${prefixCls}-close-icon`}>
{closeText || <Icon type="cross" />}
</a> : null}
</div>
</Animate>
);

15
components/alert/index.zh-CN.md
View File

@@ -16,11 +16,12 @@ title: Alert
| 参数 | 说明 | 类型 | 默认值 |
|----------- |--------------------------------------------------------- | ---------- |-------|
| type | 指定警告提示的样式，有四种选择 `success`、`info`、`warning`、`error` | string | `info`，`banner` 模式下默认值为 `warning` |
| closable | 默认不显示关闭按钮 | boolean | 无 |
| closeText | 自定义关闭按钮 | string\|ReactNode | 无 |
| message | 警告提示内容 | string\|ReactNode | 无 |
| description | 警告提示的辅助性文字介绍 | string\|ReactNode | 无 |
| type | 指定警告提示的样式，有四种选择 `success`、`info`、`warning`、`error` | String | `info` |
| closable | 默认不显示关闭按钮 | Boolean | 无 |
| closeText | 自定义关闭按钮 | React.Node | 无 |
| message | 警告提示内容 | React.Node | 无 |
| description | 警告提示的辅助性文字介绍 | React.Node | 无 |
| onClose | 关闭时触发的回调函数 | Function | 无 |
| showIcon | 是否显示辅助图标 | boolean | false，`banner` 模式下默认值为 true |
| banner | 是否用作顶部公告 | boolean | false |
| showIcon | 是否显示辅助图标 | Boolean | false |
| banner | 是否用作顶部公告 | Boolean | false |

29
components/alert/style/index.less
View File

@@ -2,16 +2,14 @@
@alert-prefix-cls: ~"@{ant-prefix}-alert";
@alert-message-color: @heading-color;
@alert-text-color: @text-color;
.@{alert-prefix-cls} {
position: relative;
padding: 8px 48px 8px 38px;
border-radius: @border-radius-base;
color: @alert-text-color;
color: @text-color;
font-size: @font-size-base;
line-height: 16px;
margin-bottom: 10px;
&&-no-icon {
padding: 8px 48px 8px 16px;
@@ -19,7 +17,7 @@
&-icon {
font-size: @font-size-lg;
top: 9.5px;
top: 9px;
left: 16px;
position: absolute;
}
@@ -31,32 +29,32 @@
}
&-success {
border: @border-width-base @border-style-base @green-2;
background-color: @green-1;
border: 1px solid tint(@success-color, 80%);
background-color: tint(@success-color, 90%);
.@{alert-prefix-cls}-icon {
color: @success-color;
}
}
&-info {
border: @border-width-base @border-style-base @primary-2;
background-color: @primary-1;
border: 1px solid tint(@primary-color, 80%);
background-color: tint(@primary-color, 90%);
.@{alert-prefix-cls}-icon {
color: @info-color;
color: @primary-color;
}
}
&-warning {
border: @border-width-base @border-style-base @yellow-2;
background-color: @yellow-1;
border: 1px solid tint(@warning-color, 80%);
background-color: tint(@warning-color, 90%);
.@{alert-prefix-cls}-icon {
color: @warning-color;
}
}
&-error {
border: @border-width-base @border-style-base @red-2;
background-color: @red-1;
border: 1px solid tint(@error-color, 80%);
background-color: tint(@error-color, 90%);
.@{alert-prefix-cls}-icon {
color: @error-color;
}
@@ -90,6 +88,7 @@
padding: 16px 16px 16px 60px;
position: relative;
border-radius: @border-radius-base;
margin-bottom: 10px;
color: @text-color;
line-height: 1.5;
}
@@ -115,7 +114,7 @@
&-with-description &-message {
font-size: @font-size-lg;
color: @alert-message-color;
color: @heading-color;
display: block;
margin-bottom: 4px;
}

76
components/anchor/AnchorLink.tsx
View File

@@ -1,25 +1,26 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import AnchorHelper, { scrollTo } from './anchorHelper';
export interface AnchorLinkProps {
href: string;
onClick?: (href: string, component: Element) => void;
onClick: (href: string) => void;
active?: boolean;
prefixCls?: string;
children?: any;
title: React.ReactNode;
offsetTop?: number;
bounds?: number;
title?: Element;
bounds: number;
target?: () => HTMLElement | Window;
affix?: boolean;
}
export default class AnchorLink extends React.Component<AnchorLinkProps, any> {
static __ANT_ANCHOR_LINK = true;
static contextTypes = {
anchorHelper: PropTypes.any,
anchorHelper: React.PropTypes.any,
};
static childContextTypes = {
anchorHelper: React.PropTypes.any,
};
static defaultProps = {
@@ -31,62 +32,45 @@ export default class AnchorLink extends React.Component<AnchorLinkProps, any> {
anchorHelper: AnchorHelper;
};
private _component: HTMLAnchorElement;
setActiveAnchor() {
const { bounds, offsetTop, href, affix } = this.props;
const { anchorHelper } = this.context;
const active = affix && anchorHelper && anchorHelper.getCurrentAnchor(offsetTop, bounds) === href;
if (active && anchorHelper) {
anchorHelper.setActiveAnchor(this._component);
}
constructor(props, context) {
super(props, context);
}
componentDidMount() {
this.setActiveAnchor();
getChildContext() {
return {
anchorHelper: this.context.anchorHelper,
};
}
componentDidUpdate() {
this.setActiveAnchor();
}
renderAnchorLink = (child: React.ReactChild) => {
// Here child is a ReactChild type
if (typeof child !== 'string' && typeof child !== 'number') {
const { href } = child.props;
if (href) {
this.context.anchorHelper.addLink(href);
return React.cloneElement(child, {
onClick: this.props.onClick,
prefixCls: this.props.prefixCls,
affix: this.props.affix,
offsetTop: this.props.offsetTop,
});
}
renderAnchorLink = (child) => {
const { href } = child.props;
if (href) {
this.context.anchorHelper.addLink(href);
return React.cloneElement(child, {
onClick: this.context.anchorHelper.scrollTo,
prefixCls: this.props.prefixCls,
});
}
return child;
}
refsTo = (component: HTMLAnchorElement) => {
this._component = component;
}
scrollTo = (e: React.MouseEvent<HTMLAnchorElement>) => {
e.preventDefault();
scrollTo = (e) => {
const { onClick, href } = this.props;
const { anchorHelper } = this.context;
e.preventDefault();
if (onClick) {
onClick(href, this._component);
onClick(href);
} else {
e.stopPreventDefault();
const scrollToFn = anchorHelper ? anchorHelper.scrollTo : scrollTo;
scrollToFn(href, this.props.offsetTop);
scrollToFn(href);
}
}
render() {
const { prefixCls, href, children, title, bounds, offsetTop, affix } = this.props;
const { prefixCls, href, children, title, bounds, affix } = this.props;
const { anchorHelper } = this.context;
const active = affix && anchorHelper && anchorHelper.getCurrentAnchor(offsetTop, bounds) === href;
const active = affix && anchorHelper && anchorHelper.getCurrentAnchor(bounds) === href;
const cls = classNames({
[`${prefixCls}-link`]: true,
[`${prefixCls}-link-active`]: active,
@@ -94,7 +78,7 @@ export default class AnchorLink extends React.Component<AnchorLinkProps, any> {
return (
<div className={cls}>
<a
ref={this.refsTo}
ref={(component) => component && active && anchorHelper ? anchorHelper.setActiveAnchor(component) : null}
className={`${prefixCls}-link-title`}
onClick={this.scrollTo}
href={href}

20
components/anchor/__tests__/Anchor.test.js
View File

@@ -1,20 +0,0 @@
import React from 'react';
import { mount } from 'enzyme';
import Anchor from '..';
const { Link } = Anchor;
describe('Anchor Render', () => {
it('Anchor render perfectly', () => {
const wrapper = mount(
<Anchor>
<Link href="#API" title="API" />
</Anchor>
);
wrapper.find('a[href="#API"]').simulate('click');
wrapper.node.handleScroll();
expect(wrapper.node.state).not.toBe(null);
});
});

153
components/anchor/__tests__/__snapshots__/demo.test.js.snap
View File

@@ -1,153 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/anchor/demo/basic.md correctly 1`] = `
<div>
<div
class=""
>
<div
class="ant-anchor-wrapper"
>
<div
class="ant-anchor"
>
<div
class="ant-anchor-ink"
>
<span
class="ant-anchor-ink-ball animated"
/>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#components-anchor-demo-basic"
title="Basic demo"
>
Basic demo
</a>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#components-anchor-demo-fixed"
title="Fixed demo"
>
Fixed demo
</a>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#API"
title="API"
>
API
</a>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#Anchor-Props"
title="Anchor Props"
>
Anchor Props
</a>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#Link-Props"
title="Link Props"
>
Link Props
</a>
</div>
</div>
</div>
</div>
</div>
</div>
`;
exports[`renders ./components/anchor/demo/fixed.md correctly 1`] = `
<div
class="ant-anchor-wrapper"
>
<div
class="ant-anchor fixed"
>
<div
class="ant-anchor-ink"
>
<span
class="ant-anchor-ink-ball animated"
/>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#components-anchor-demo-basic"
title="Basic demo"
>
Basic demo
</a>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#components-anchor-demo-fixed"
title="Fixed demo"
>
Fixed demo
</a>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#API"
title="API"
>
API
</a>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#Anchor-Props"
title="Anchor Props"
>
Anchor Props
</a>
</div>
<div
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title"
href="#Link-Props"
title="Link Props"
>
Link Props
</a>
</div>
</div>
</div>
</div>
`;

3
components/anchor/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('anchor');

76
components/anchor/anchorHelper.tsx
View File

@@ -3,7 +3,7 @@ import getRequestAnimationFrame from '../_util/getRequestAnimationFrame';
export const reqAnimFrame = getRequestAnimationFrame();
export const easeInOutCubic = (t: number, b: number, c: number, d: number) => {
export const easeInOutCubic = (t, b, c, d) => {
const cc = c - b;
t /= d / 2;
if (t < 1) {
@@ -17,7 +17,7 @@ export function getDefaultTarget() {
window : null;
}
export function getOffsetTop(element: HTMLElement): number {
export function getOffsetTop(element): number {
if (!element) {
return 0;
}
@@ -28,29 +28,23 @@ export function getOffsetTop(element: HTMLElement): number {
const rect = element.getBoundingClientRect();
if (rect.width || rect.height) {
if ( rect.width || rect.height ) {
const doc = element.ownerDocument;
const docElem = doc.documentElement;
return rect.top - docElem.clientTop;
return rect.top - docElem.clientTop;
}
return rect.top;
}
export type Section = {
top: number;
bottom: number;
section: any;
};
export function scrollTo(href: string, offsetTop = 0, target = getDefaultTarget, callback = () => { }) {
export function scrollTo(href, target = getDefaultTarget) {
const scrollTop = getScroll(target(), true);
const targetElement = document.getElementById(href.substring(1));
const targetElement = document.querySelector(href);
if (!targetElement) {
return;
}
const eleOffsetTop = getOffsetTop(targetElement);
const targetScrollTop = scrollTop + eleOffsetTop - offsetTop;
const offsetTop = getOffsetTop(targetElement);
const targetScrollTop = scrollTop + offsetTop;
const startTime = Date.now();
const frameFunc = () => {
const timestamp = Date.now();
@@ -58,17 +52,15 @@ export function scrollTo(href: string, offsetTop = 0, target = getDefaultTarget,
window.scrollTo(window.pageXOffset, easeInOutCubic(time, scrollTop, targetScrollTop, 450));
if (time < 450) {
reqAnimFrame(frameFunc);
} else {
callback();
}
};
reqAnimFrame(frameFunc);
history.pushState(null, '', href);
history.pushState(null, undefined, href);
}
class AnchorHelper {
private links: Array<string>;
private currentAnchor: HTMLAnchorElement | null;
private currentAnchor: HTMLElement | null;
private _activeAnchor: string;
constructor() {
@@ -77,52 +69,38 @@ class AnchorHelper {
this._activeAnchor = '';
}
addLink(link: string) {
addLink(link) {
if (this.links.indexOf(link) === -1) {
this.links.push(link);
}
}
getCurrentActiveAnchor(): HTMLAnchorElement | null {
getCurrentActiveAnchor(): HTMLElement | null {
return this.currentAnchor;
}
setActiveAnchor(component: HTMLAnchorElement) {
setActiveAnchor(component) {
this.currentAnchor = component;
}
getCurrentAnchor(offsetTop: number = 0, bounds = 5) {
getCurrentAnchor(bounds = 5) {
let activeAnchor = '';
if (typeof document === 'undefined') {
return activeAnchor;
}
const linksPositions = (this.links
.map(section => {
const target = document.getElementById(section.substring(1));
if (target && getOffsetTop(target) < offsetTop + bounds) {
const top = getOffsetTop(target);
if (top <= offsetTop + bounds) {
return {
section,
top,
bottom: top + target.clientHeight,
};
}
this.links.forEach(section => {
const target = document.querySelector(section);
if (target) {
const top = getOffsetTop(target);
const bottom = top + target.clientHeight;
if ((top <= bounds) && (bottom >= -bounds)) {
activeAnchor = section;
}
return null;
})
.filter(section => section !== null) as Array<Section>);
if (linksPositions.length) {
const maxSection = linksPositions.reduce((prev, curr) => curr.top > prev.top ? curr : prev);
return maxSection.section;
}
return '';
}
});
this._activeAnchor = activeAnchor || this._activeAnchor;
return this._activeAnchor;
}
scrollTo(href: string, offsetTop: number | undefined, target = getDefaultTarget, callback = () => { }) {
scrollTo(href, offsetTop, target, callback);
scrollTo(href, target = getDefaultTarget) {
scrollTo(href, target);
}
}

16
components/anchor/index.en-US.md
View File

@@ -1,7 +1,7 @@
---
category: Components
type: Other
cols: 2
cols: 1
title: Anchor
---
@@ -9,7 +9,7 @@ Hyperlinks to scroll on one page.
## When To Use
For displaying anchor hyperlinks on page and jumping between them.
For displaying anchor hyperlinks on page, and jump between them.
## API
@@ -17,15 +17,13 @@ For displaying anchor hyperlinks on page and jumping between them.
| Property | Description | Type | Default |
|--------------|-----------------------|----------|--------------|
| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |
| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |
| bounds | Bounding distance of anchor area | number | 5(px) |
| affix | Fixed mode of Anchor | boolean | false |
| showInkInFixed | Whether show ink-balls in Fixed mode | boolean | false |
| offsetTop | Pixels to offset from top when calculating position of scroll | Number | 0 |
| offsetBottom | Pixels to offset from bottom when calculating position of scroll | Number | - |
| bounds | Bounding distance of anchor area | Number | 5(px) |
### Link Props
| Property | Description | Type | Default |
|-------------|----------------|--------------------|--------------|
| href | target of hyperlink | string | |
| title | content of hyperlink | string\|ReactNode | |
| href | target of hyperlink | String | |
| title | content of hyperlink | React.Node | |

54
components/anchor/index.tsx
View File

@@ -1,5 +1,4 @@
import React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import addEventListener from 'rc-util/lib/Dom/addEventListener';
import AnchorLink from './AnchorLink';
@@ -7,15 +6,14 @@ import Affix from '../affix';
import AnchorHelper, { getDefaultTarget } from './anchorHelper';
export interface AnchorProps {
target?: () => HTMLElement | Window;
children?: React.ReactNode;
target: () => HTMLElement | Window;
children: React.ReactNode;
prefixCls?: string;
offsetTop?: number;
bounds?: number;
className?: string;
style?: React.CSSProperties;
affix?: boolean;
showInkInFixed?: boolean;
}
export default class Anchor extends React.Component<AnchorProps, any> {
@@ -24,11 +22,10 @@ export default class Anchor extends React.Component<AnchorProps, any> {
static defaultProps = {
prefixCls: 'ant-anchor',
affix: true,
showInkInFixed: false,
};
static childContextTypes = {
anchorHelper: PropTypes.any,
anchorHelper: React.PropTypes.any,
};
refs: {
@@ -37,20 +34,18 @@ export default class Anchor extends React.Component<AnchorProps, any> {
private scrollEvent: any;
private anchorHelper: AnchorHelper;
private _avoidInk: boolean;
constructor(props: AnchorProps) {
constructor(props) {
super(props);
this.state = {
activeAnchor: null,
animated: true,
};
this.anchorHelper = new AnchorHelper();
}
handleScroll = () => {
this.setState({
activeAnchor: this.anchorHelper.getCurrentAnchor(this.props.offsetTop, this.props.bounds),
activeAnchor: this.anchorHelper.getCurrentAnchor(this.props.bounds),
});
}
@@ -73,9 +68,7 @@ export default class Anchor extends React.Component<AnchorProps, any> {
}
componentDidUpdate() {
if (!this._avoidInk) {
this.updateInk();
}
this.updateInk();
}
updateInk = () => {
@@ -85,45 +78,36 @@ export default class Anchor extends React.Component<AnchorProps, any> {
}
}
clickAnchorLink = (href: string, component: HTMLElement) => {
this._avoidInk = true;
this.refs.ink.style.top = `${component.offsetTop + component.clientHeight / 2 - 4.5}px`;
this.anchorHelper.scrollTo(href, this.props.offsetTop, getDefaultTarget, () => {
this._avoidInk = false;
});
}
renderAnchorLink = (child: React.ReactElement<any>) => {
renderAnchorLink = (child) => {
const { href } = child.props;
const { type } = child as any;
if (type.__ANT_ANCHOR_LINK && href) {
if (href) {
this.anchorHelper.addLink(href);
return React.cloneElement(child, {
onClick: this.clickAnchorLink,
onClick: this.anchorHelper.scrollTo,
prefixCls: this.props.prefixCls,
bounds: this.props.bounds,
affix: this.props.affix || this.props.showInkInFixed,
offsetTop: this.props.offsetTop,
affix: this.props.affix,
});
}
return child;
}
render() {
const { prefixCls, offsetTop, style, className = '', affix, showInkInFixed } = this.props;
const { activeAnchor, animated } = this.state;
const { prefixCls, offsetTop, style, className = '', affix } = this.props;
const { activeAnchor } = this.state;
const inkClass = classNames({
[`${prefixCls}-ink-ball`]: true,
animated,
visible: !!activeAnchor,
});
const wrapperClass = classNames({
[`${prefixCls}-wrapper`]: true,
}, className);
[className]: !!className,
});
const anchorClass = classNames(prefixCls, {
'fixed': !affix && !showInkInFixed,
const anchorClass = classNames({
[`${prefixCls}`]: true,
'fixed': !affix,
});
const anchorContent = (
@@ -132,12 +116,12 @@ export default class Anchor extends React.Component<AnchorProps, any> {
<div className={`${prefixCls}-ink`} >
<span className={inkClass} ref="ink" />
</div>
{React.Children.toArray(this.props.children).map(this.renderAnchorLink)}
{React.Children.map(this.props.children, this.renderAnchorLink)}
</div>
</div>
);
return !affix ? anchorContent : (
return affix === false ? anchorContent : (
<Affix offsetTop={offsetTop}>
{anchorContent}
</Affix>

14
components/anchor/index.zh-CN.md
View File

@@ -1,7 +1,7 @@
---
category: Components
subtitle: 锚点
cols: 2
cols: 1
type: Other
title: Anchor
---
@@ -18,15 +18,13 @@ title: Anchor
| 成员 | 说明 | 类型 | 默认值 |
|-------------|----------------|--------------------|--------------|
| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number | |
| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number | |
| bounds | 锚点区域边界 | number | 5(px) |
| affix | 固定模式 | boolean | false |
| showInkInFixed | 固定模式是否显示小圆点 | boolean | false |
| offsetTop | 距离窗口顶部达到指定偏移量后触发 | Number | |
| offsetBottom | 距离窗口底部达到指定偏移量后触发 | Number | |
| bounds | 锚点区域边界 | Number | 5(px) |
### Link Props
| 成员 | 说明 | 类型 | 默认值 |
|-------------|----------------|--------------------|--------------|
| href | 锚点链接 | string | |
| title | 文字内容 | string\|ReactNode | |
| href | 锚点链接 | String | |
| title | 文字内容 | React.Node | |

20
components/anchor/style/index.less
View File

@@ -4,11 +4,13 @@
&-anchor {
position: relative;
&-wrapper {
background-color: @component-background;
padding: 6px;
background-color: white;
}
&-ink {
position: absolute;
width: 9px;
height: 100%;
left: 0;
top: 0;
@@ -28,9 +30,9 @@
height: 9px;
border-radius: 9px;
border: 3px solid @primary-color;
background-color: @component-background;
left: 50%;
background-color: white;
transition: top .3s ease-in-out;
left: 50%;
transform: translateX(-50%);
&.visible {
display: inline-block;
@@ -44,14 +46,9 @@
}
&-anchor-link {
padding: 8px 0 8px 18px;
padding: 4px 0 4px 16px;
line-height: 1;
& & {
padding-top: 6px;
padding-bottom: 6px;
}
&-title {
display: block;
position: relative;
@@ -60,11 +57,6 @@
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
margin-bottom: 8px;
}
&-title:only-child {
margin-bottom: 0;
}
&-active > &-title {

19
components/auto-complete/InputElement.tsx
View File

@@ -1,19 +0,0 @@
import React from 'react';
import { findDOMNode } from 'react-dom';
export default class InputElement extends React.Component<any, any> {
private ele: HTMLInputElement;
focus = () => {
this.ele.focus ? this.ele.focus() : (findDOMNode(this.ele) as HTMLInputElement).focus();
}
blur = () => {
this.ele.blur ? this.ele.blur() : (findDOMNode(this.ele) as HTMLInputElement).blur();
}
render() {
return React.cloneElement(this.props.children, {
...this.props,
ref: ele => this.ele = (ele as HTMLInputElement),
}, null);
}
}

367
components/auto-complete/__tests__/__snapshots__/demo.test.js.snap
View File

@@ -1,367 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/auto-complete/demo/antd.md correctly 1`] = `
<div
class="ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
style="width:200px;height:50px;"
>
<div
aria-autocomplete="list"
aria-expanded="false"
aria-haspopup="true"
class="ant-select-selection
ant-select-selection--single"
role="combobox"
>
<div
class="ant-select-selection__rendered"
>
<div
class="ant-select-selection__placeholder"
style="display:block;user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
input here
</div>
<ul>
<li
class="ant-select-search ant-select-search--inline"
>
<div
class="ant-select-search__field__wrap"
>
<textarea
class="ant-input ant-select-search__field"
style="height:50px;"
/>
<span
class="ant-select-search__field__mirror"
>
 
</span>
</div>
</li>
</ul>
</div>
<span
class="ant-select-arrow"
style="user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
<b />
</span>
</div>
</div>
`;
exports[`renders ./components/auto-complete/demo/basic.md correctly 1`] = `
<div
class="ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
style="width:200px;"
>
<div
aria-autocomplete="list"
aria-expanded="false"
aria-haspopup="true"
class="ant-select-selection
ant-select-selection--single"
role="combobox"
>
<div
class="ant-select-selection__rendered"
>
<div
class="ant-select-selection__placeholder"
style="display:block;user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
input here
</div>
<ul>
<li
class="ant-select-search ant-select-search--inline"
>
<div
class="ant-select-search__field__wrap"
>
<input
class="ant-input ant-input ant-select-search__field"
type="text"
value=""
/>
<span
class="ant-select-search__field__mirror"
>
 
</span>
</div>
</li>
</ul>
</div>
<span
class="ant-select-arrow"
style="user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
<b />
</span>
</div>
</div>
`;
exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1`] = `
<div
class="certain-category-search-wrapper"
style="width:250px;"
>
<div
class="ant-select-lg ant-select-lg certain-category-search ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
style="width:100%;"
>
<div
aria-autocomplete="list"
aria-expanded="false"
aria-haspopup="true"
class="ant-select-selection
ant-select-selection--single"
role="combobox"
>
<div
class="ant-select-selection__rendered"
>
<div
class="ant-select-selection__placeholder"
style="display:block;user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
input here
</div>
<ul>
<li
class="ant-select-search ant-select-search--inline"
>
<div
class="ant-select-search__field__wrap"
>
<span
class="ant-input-affix-wrapper"
>
<input
class="ant-input ant-input ant-select-search__field"
type="text"
value=""
/>
<span
class="ant-input-suffix"
>
<i
class="anticon anticon-search certain-category-icon"
/>
</span>
</span>
<span
class="ant-select-search__field__mirror"
>
 
</span>
</div>
</li>
</ul>
</div>
<span
class="ant-select-arrow"
style="user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
<b />
</span>
</div>
</div>
</div>
`;
exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly 1`] = `
<div
class="ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
style="width:200px;"
>
<div
aria-autocomplete="list"
aria-expanded="false"
aria-haspopup="true"
class="ant-select-selection
ant-select-selection--single"
role="combobox"
>
<div
class="ant-select-selection__rendered"
>
<div
class="ant-select-selection__placeholder"
style="display:block;user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
try to type \`b\`
</div>
<ul>
<li
class="ant-select-search ant-select-search--inline"
>
<div
class="ant-select-search__field__wrap"
>
<input
class="ant-input ant-input ant-select-search__field"
type="text"
value=""
/>
<span
class="ant-select-search__field__mirror"
>
 
</span>
</div>
</li>
</ul>
</div>
<span
class="ant-select-arrow"
style="user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
<b />
</span>
</div>
</div>
`;
exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
<div
class="ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
style="width:200px;"
>
<div
aria-autocomplete="list"
aria-expanded="false"
aria-haspopup="true"
class="ant-select-selection
ant-select-selection--single"
role="combobox"
>
<div
class="ant-select-selection__rendered"
>
<div
class="ant-select-selection__placeholder"
style="display:block;user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
input here
</div>
<ul>
<li
class="ant-select-search ant-select-search--inline"
>
<div
class="ant-select-search__field__wrap"
>
<input
class="ant-input ant-input ant-select-search__field"
type="text"
value=""
/>
<span
class="ant-select-search__field__mirror"
>
 
</span>
</div>
</li>
</ul>
</div>
<span
class="ant-select-arrow"
style="user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
<b />
</span>
</div>
</div>
`;
exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly 1`] = `
<div
class="global-search-wrapper"
style="width:300px;"
>
<div
class="ant-select-lg ant-select-lg global-search ant-select-show-search ant-select-auto-complete ant-select ant-select-combobox ant-select-enabled"
style="width:100%;"
>
<div
aria-autocomplete="list"
aria-expanded="false"
aria-haspopup="true"
class="ant-select-selection
ant-select-selection--single"
role="combobox"
>
<div
class="ant-select-selection__rendered"
>
<div
class="ant-select-selection__placeholder"
style="display:block;user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
input here
</div>
<ul>
<li
class="ant-select-search ant-select-search--inline"
>
<div
class="ant-select-search__field__wrap"
>
<span
class="ant-input-affix-wrapper"
>
<input
class="ant-input ant-input ant-select-search__field"
type="text"
value=""
/>
<span
class="ant-input-suffix"
>
<button
class="ant-btn ant-btn-primary ant-btn-lg search-btn"
type="button"
>
<i
class="anticon anticon-search"
/>
</button>
</span>
</span>
<span
class="ant-select-search__field__mirror"
>
 
</span>
</div>
</li>
</ul>
</div>
<span
class="ant-select-arrow"
style="user-select:none;-webkit-user-select:none;"
unselectable="unselectable"
>
<b />
</span>
</div>
</div>
</div>
`;

20
components/auto-complete/__tests__/ac.test.js
View File

@@ -1,20 +0,0 @@
import React from 'react';
import { mount } from 'enzyme';
import AutoComplete from '..';
describe('AutoComplete with Custom Input Element Render', () => {
it('AutoComplete with custom Input render perfectly', () => {
const wrapper = mount(
<AutoComplete dataSource={['12345', '23456', '34567']}>
<textarea />
</AutoComplete>
);
expect(wrapper.find('textarea').length).toBe(1);
wrapper.find('textarea').simulate('change', { target: { value: '123' } });
const dropdownWrapper = mount(wrapper.find('Trigger').node.getComponent());
// should not filter data source defaultly
expect(dropdownWrapper.find('MenuItem').length).toBe(3);
});
});

3
components/auto-complete/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('auto-complete');

59
components/auto-complete/demo/antd.md
View File

@@ -1,59 +0,0 @@
---
order: 3
title:
zh-CN: 自定义输入组件
en-US: Customize Input Component
---
## zh-CN
自定义输入组件。
## en-US
Customize Input Component
````jsx
import { AutoComplete } from 'antd';
function onSelect(value) {
console.log('onSelect', value);
}
class Complete extends React.Component {
state = {
dataSource: [],
}
handleSearch = (value) => {
this.setState({
dataSource: !value ? [] : [
value,
value + value,
value + value + value,
],
});
}
handleKeyPress = (ev) => {
console.log('handleKeyPress', ev);
}
render() {
const { dataSource } = this.state;
return (
<AutoComplete
dataSource={dataSource}
style={{ width: 200, height: 50 }}
onSelect={onSelect}
onSearch={this.handleSearch}
placeholder="input here"
>
<textarea onKeyPress={this.handleKeyPress} style={{ height: 50 }} />
</AutoComplete>
);
}
}
ReactDOM.render(<Complete />, mountNode);
````

23
components/auto-complete/demo/basic.md
View File

@@ -20,12 +20,13 @@ function onSelect(value) {
console.log('onSelect', value);
}
class Complete extends React.Component {
state = {
dataSource: [],
}
handleSearch = (value) => {
const Complete = React.createClass({
getInitialState() {
return {
dataSource: [],
};
},
handleChange(value) {
this.setState({
dataSource: !value ? [] : [
value,
@@ -33,8 +34,7 @@ class Complete extends React.Component {
value + value + value,
],
});
}
},
render() {
const { dataSource } = this.state;
return (
@@ -42,12 +42,11 @@ class Complete extends React.Component {
dataSource={dataSource}
style={{ width: 200 }}
onSelect={onSelect}
onSearch={this.handleSearch}
placeholder="input here"
onChange={this.handleChange}
/>
);
}
}
},
});
ReactDOM.render(<Complete />, mountNode);
````

152
components/auto-complete/demo/certain-category.md
View File

@@ -1,152 +0,0 @@
---
order: 4
title:
zh-CN: 查询模式 - 确定类目
en-US: Lookup-Patterns - Certain Category
---
## zh-CN
[查询模式: 确定类目](https://ant.design/docs/spec/reaction#Lookup-Patterns) 示例。
## en-US
Demonstration of [Lookup Patterns: Certain Category](https://ant.design/docs/spec/reaction#Lookup-Patterns).
Basic Usage, set datasource of autocomplete with `dataSource` property.
````jsx
import { Icon, Input, AutoComplete } from 'antd';
const Option = AutoComplete.Option;
const OptGroup = AutoComplete.OptGroup;
const dataSource = [{
title: '话题',
children: [{
title: 'AntDesign',
count: 10000,
}, {
title: 'AntDesign UI',
count: 10600,
}],
}, {
title: '问题',
children: [{
title: 'AntDesign UI 有多好',
count: 60100,
}, {
title: 'AntDesign 是啥',
count: 30010,
}],
}, {
title: '文章',
children: [{
title: 'AntDesign 是一个设计语言',
count: 100000,
}],
}];
function renderTitle(title) {
return (
<span>
{title}
<a
style={{ float: 'right' }}
href="https://www.google.com/search?q=antd"
target="_blank"
rel="noopener noreferrer"
>更多
</a>
</span>
);
}
const options = dataSource.map(group => (
<OptGroup
key={group.title}
label={renderTitle(group.title)}
>
{group.children.map(opt => (
<Option key={opt.title} value={opt.title}>
{opt.title}
<span className="certain-search-item-count">{opt.count} 人 关注</span>
</Option>
))}
</OptGroup>
)).concat([
<Option disabled key="all" className="show-all">
<a
href="https://www.google.com/search?q=antd"
target="_blank"
rel="noopener noreferrer"
>
查看所有结果
</a>
</Option>,
]);
function Complete() {
return (
<div className="certain-category-search-wrapper" style={{ width: 250 }}>
<AutoComplete
className="certain-category-search"
dropdownClassName="certain-category-search-dropdown"
dropdownMatchSelectWidth={false}
dropdownStyle={{ width: 300 }}
size="large"
style={{ width: '100%' }}
dataSource={options}
placeholder="input here"
optionLabelProp="value"
>
<Input suffix={<Icon type="search" className="certain-category-icon" />} />
</AutoComplete>
</div>
);
}
ReactDOM.render(<Complete />, mountNode);
````
````css
.certain-category-search.ant-select-auto-complete .ant-input-affix-wrapper .ant-input-suffix {
right: 12px;
}
.certain-category-search-dropdown .ant-select-dropdown-menu-item-group-title {
color: #666;
font-weight: bold;
}
.certain-category-search-dropdown .ant-select-dropdown-menu-item-group {
border-bottom: 1px solid #F6F6F6;
}
.certain-category-search-dropdown .ant-select-dropdown-menu-item {
padding-left: 16px;
}
.certain-category-search-dropdown .ant-select-dropdown-menu-item.show-all {
text-align: center;
cursor: default;
}
.certain-category-search-dropdown .ant-select-dropdown-menu {
max-height: 300px;
}
.certain-search-item-count {
position: absolute;
color: #999;
right: 16px;
}
.certain-category-search.ant-select-focused .certain-category-icon {
color: #108ee9;
}
.certain-category-icon {
color: #6E6E6E;
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
font-size: 16px;
}
````

33
components/auto-complete/demo/non-case-sensitive.md
View File

@@ -1,33 +0,0 @@
---
order: 3
title:
zh-CN: 不区分大小写
en-US: Non-case-sensitive AutoComplete
---
## zh-CN
不区分大小写的 AutoComplete
## en-US
A non-case-sensitive AutoComplete
````jsx
import { AutoComplete } from 'antd';
const dataSource = ['Burns Bay Road', 'Downing Street', 'Wall Street'];
function Complete() {
return (
<AutoComplete
style={{ width: 200 }}
dataSource={dataSource}
placeholder="try to type `b`"
filterOption={(inputValue, option) => option.props.children.toUpperCase().indexOf(inputValue.toUpperCase()) !== -1}
/>
);
}
ReactDOM.render(<Complete />, mountNode);
````

23
components/auto-complete/demo/options.md
View File

@@ -18,12 +18,13 @@ import { AutoComplete } from 'antd';
const Option = AutoComplete.Option;
class Complete extends React.Component {
state = {
result: [],
}
handleSearch = (value) => {
const Complete = React.createClass({
getInitialState() {
return {
result: [],
};
},
handleChange(value) {
let result;
if (!value || value.indexOf('@') >= 0) {
result = [];
@@ -31,8 +32,7 @@ class Complete extends React.Component {
result = ['gmail.com', '163.com', 'qq.com'].map(domain => `${value}@${domain}`);
}
this.setState({ result });
}
},
render() {
const { result } = this.state;
const children = result.map((email) => {
@@ -41,14 +41,13 @@ class Complete extends React.Component {
return (
<AutoComplete
style={{ width: 200 }}
onSearch={this.handleSearch}
placeholder="input here"
onChange={this.handleChange}
>
{children}
</AutoComplete>
);
}
}
},
});
ReactDOM.render(<Complete />, mountNode);
````

126
components/auto-complete/demo/uncertain-category.md
View File

@@ -1,126 +0,0 @@
---
order: 5
title:
zh-CN: 查询模式 - 不确定类目
en-US: Lookup-Patterns - Uncertain Category
---
## zh-CN
[查询模式: 不确定类目](https://ant.design/docs/spec/reaction#Lookup-Patterns) 示例。
## en-US
Demonstration of [Lookup Patterns: Uncertain Category](https://ant.design/docs/spec/reaction#Lookup-Patterns).
Basic Usage, set datasource of autocomplete with `dataSource` property.
````jsx
import { Icon, Button, Input, AutoComplete } from 'antd';
const Option = AutoComplete.Option;
function onSelect(value) {
console.log('onSelect', value);
}
function getRandomInt(max, min = 0) {
return Math.floor(Math.random() * (max - min + 1)) + min; // eslint-disable-line no-mixed-operators
}
function searchResult(query) {
return (new Array(getRandomInt(5))).join('.').split('.')
.map((item, idx) => ({
query,
category: `${query}${idx}`,
count: getRandomInt(200, 100),
}));
}
function renderOption(item) {
return (
<Option key={item.category} text={item.category}>
{item.query} 在
<a
href={`https://s.taobao.com/search?q=${item.query}`}
target="_blank"
rel="noopener noreferrer"
>
{item.category}
</a>
区块中
<span className="global-search-item-count">约 {item.count} 个结果</span>
</Option>
);
}
class Complete extends React.Component {
state = {
dataSource: [],
}
handleSearch = (value) => {
this.setState({
dataSource: value ? searchResult(value) : [],
});
}
render() {
const { dataSource } = this.state;
return (
<div className="global-search-wrapper" style={{ width: 300 }}>
<AutoComplete
className="global-search"
size="large"
style={{ width: '100%' }}
dataSource={dataSource.map(renderOption)}
onSelect={onSelect}
onSearch={this.handleSearch}
placeholder="input here"
optionLabelProp="text"
>
<Input
suffix={(
<Button className="search-btn" size="large" type="primary">
<Icon type="search" />
</Button>
)}
/>
</AutoComplete>
</div>
);
}
}
ReactDOM.render(<Complete />, mountNode);
````
````css
.global-search-wrapper {
padding-right: 50px;
}
.global-search {
width: 100%;
}
.global-search.ant-select-auto-complete .ant-select-selection--single {
margin-right: -46px;
}
.global-search.ant-select-auto-complete .ant-input-affix-wrapper .ant-input:not(:last-child) {
padding-right: 62px;
}
.global-search.ant-select-auto-complete .ant-input-affix-wrapper .ant-input-suffix {
right: 0;
}
.global-search.ant-select-auto-complete .ant-input-affix-wrapper .ant-input-suffix button {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
.global-search-item-count {
position: absolute;
right: 16px;
}
````

18
components/auto-complete/index.en-US.md
View File

@@ -1,7 +1,7 @@
---
category: Components
type: Data Entry
cols: 2
cols: 1
title: AutoComplete
---
@@ -9,7 +9,7 @@ Autocomplete function of input field.
## When To Use
When there is a need for autocomplete functionality.
When need to use autocomplete function.
## API
@@ -17,20 +17,14 @@ When there is a need for autocomplete functionality.
const dataSource = ['12345', '23456', '34567'];
<AutoComplete dataSource={dataSource} />
```
Since `AutoComplete` is based on `Select`, so besides following API, `AutoComplete` has same API as `Select`.
| Property | Description | Type | Default |
|----------------|----------------------------------|------------|--------|
| dataSource | Data source for autocomplete | [DataSourceItemType](https://git.io/vMMKF)[] | |
| value | selected option | string\|string[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | - |
| defaultValue | Initial selected option. | string\|string[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | - |
| dataSource | Data source for autocomplete | Array | |
| value | selected option | String/Array<String>/{key: String, label: React.Node}/Array<{key, label}> | - |
| defaultValue | Initial selected option. | string/Array<String> | - |
| allowClear | Show clear button, effective in multiple mode only. | boolean | false |
| onChange | Called when select an option or input value change, or value of input is changed | function(value, label) | - |
| onSelect | Called when a option is selected. param is option's value and option instance. | function(value, option) | - |
| onSearch | Called when searching items. | function(value) | - |
| disabled | Whether disabled select | boolean | false |
| defaultActiveFirstOption | Whether active first option by default | boolean | true |
| placeholder | placeholder of input | string | - |
| children (for dataSource) | Data source for autocomplet | React.ReactElement<OptionProps> / Array<React.ReactElement<OptionProps>> | - |
| children (for customize input element) | customize input element | HTMLInputElement / HTMLTextAreaElement / React.ReactElement<InputProps> | `<Input />` |
| optionLabelProp | Which prop value of option will render as content of select. | string | `children` |
| filterOption | If true, filter options by input, if function, filter options against it. The function will receive two arguments, `inputValue` and `option`, if the function returns `true`, the option will be included in the filtered set; Otherwise, it will be excluded. | boolean or function(inputValue, option) | true |

113
components/auto-complete/index.tsx
View File

@@ -1,37 +1,31 @@
import React from 'react';
import Select, { OptionProps, OptGroupProps } from '../select';
import { Option, OptGroup } from 'rc-select';
import classNames from 'classnames';
import Select, { AbstractSelectProps, SelectValue, OptionProps, OptGroupProps } from '../select';
import Input from '../input';
import InputElement from './InputElement';
export interface DataSourceItemObject { value: string; text: string; }
export interface SelectedValue {
key: string;
label: React.ReactNode;
}
export interface DataSourceItemObject { value: string; text: string; };
export type DataSourceItemType = string | DataSourceItemObject;
export interface InputProps {
onChange?: React.FormEventHandler<any>;
value: any;
}
export type ValidInputElement =
HTMLInputElement |
HTMLTextAreaElement |
React.ReactElement<InputProps>;
export interface AutoCompleteProps extends AbstractSelectProps {
value?: SelectValue;
defaultValue?: SelectValue;
export interface AutoCompleteProps {
size?: 'large' | 'small' | 'default';
className?: string;
notFoundContent?: Element;
dataSource: DataSourceItemType[];
prefixCls?: string;
transitionName?: string;
optionLabelProp?: string;
onChange?: (value: SelectValue) => void;
onSelect?: (value: SelectValue, option: Object) => any;
children?: ValidInputElement |
React.ReactElement<OptionProps> |
Array<React.ReactElement<OptionProps>>;
}
function isSelectOptionOrSelectOptGroup(child: any): Boolean {
return child && child.type && (child.type.isSelectOption || child.type.isSelectOptGroup);
choiceTransitionName?: string;
showSearch?: boolean;
defaultValue?: string | Array<any> | SelectedValue | Array<SelectedValue>;
value?: string | Array<any> | SelectedValue | Array<SelectedValue>;
allowClear?: boolean;
onChange?: (value: string | Array<any> | SelectedValue | Array<SelectedValue>) => void;
disabled?: boolean;
}
export default class AutoComplete extends React.Component<AutoCompleteProps, any> {
@@ -44,23 +38,11 @@ export default class AutoComplete extends React.Component<AutoCompleteProps, any
optionLabelProp: 'children',
choiceTransitionName: 'zoom',
showSearch: false,
filterOption: false,
};
getInputElement = () => {
const { children } = this.props;
const element = children && React.isValidElement(children) && children.type !== Option ?
React.Children.only(this.props.children) :
<Input/>;
return (
<InputElement
{...element.props}
className={classNames('ant-input', element.props.className)}
>
{element}
</InputElement>
);
}
static contextTypes = {
antLocale: React.PropTypes.object,
};
render() {
let {
@@ -72,44 +54,29 @@ export default class AutoComplete extends React.Component<AutoCompleteProps, any
[`${prefixCls}-sm`]: size === 'small',
[className]: !!className,
[`${prefixCls}-show-search`]: true,
[`${prefixCls}-auto-complete`]: true,
});
let options;
const childArray = React.Children.toArray(children);
if (childArray.length &&
isSelectOptionOrSelectOptGroup(childArray[0])
) {
options = children;
} else {
options = dataSource ? dataSource.map((item) => {
if (React.isValidElement(item)) {
return item;
}
switch (typeof item) {
case 'string':
return <Option key={item}>{item}</Option>;
case 'object':
return (
<Option key={(item as DataSourceItemObject).value}>
{(item as DataSourceItemObject).text}
</Option>
);
default:
throw new Error('AutoComplete[dataSource] only supports type `string[] | Object[]`.');
}
}) : [];
}
const options = children || (dataSource ? dataSource.map((item) => {
switch (typeof item) {
case 'string':
return <Option key={item}>{item}</Option>;
case 'object':
return (
<Option key={(item as DataSourceItemObject).value}>
{(item as DataSourceItemObject).text}
</Option>
);
default:
throw new Error('AutoComplete[dataSource] only supports type `string[] | Object[]`.');
}
}) : []);
return (
<Select
{...this.props}
<Select {...this.props}
className={cls}
mode="combobox"
optionLabelProp={optionLabelProp}
getInputElement={this.getInputElement}
notFoundContent={notFoundContent}
>
combobox
notFoundContent={notFoundContent} >
{options}
</Select>
);

16
components/auto-complete/index.zh-CN.md
View File

@@ -2,7 +2,7 @@
category: Components
subtitle: 自动完成
type: Data Entry
cols: 2
cols: 1
title: AutoComplete
---
@@ -18,20 +18,14 @@ title: AutoComplete
const dataSource = ['12345', '23456', '34567'];
<AutoComplete dataSource={dataSource} />
```
因为 `AutoComplete` 是基于 `Select` 封装的，所以除了以下 API 外，`AutoComplete` 跟 `Select` 拥有一样的 API。
| 参数 | 说明 | 类型 | 默认值 |
|----------------|----------------------------------|------------|---------|
| dataSource | 自动完成的数据源 | [DataSourceItemType](https://git.io/vMMKF)[] | |
| value | 指定当前选中的条目 | string\|string[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | 无 |
| defaultValue | 指定默认选中的条目 | string\|string[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode}> | 无 |
| dataSource | 自动完成的数据源 | Array | |
| value | 指定当前选中的条目 | String/Array<String>/{key: String, label: React.Node}/Array<{key, label}> | 无 |
| defaultValue | 指定默认选中的条目 | String/Array<String>/{key: String, label: React.Node}/Array<{key, label}> | 无 |
| allowClear | 支持清除, 单选模式有效 | boolean | false |
| onChange | 选中 option，或 input 的 value 变化时，调用此函数 | function(value) | 无 |
| onSelect | 被选中时调用，参数为选中项的 value 值 | function(value, option) | 无 |
| onSearch | 搜索补全项的时候调用 | function(value) | 无 |
| disabled | 是否禁用 | boolean | false |
| defaultActiveFirstOption | 是否默认高亮第一个选项。 | boolean | true
| placeholder | 输入框提示 | string | - |
| children (自动完成的数据源) | 自动完成的数据源 | React.ReactElement<OptionProps> / Array<React.ReactElement<OptionProps>> | - |
| children (自定义输入框) | 自定义输入框 | HTMLInputElement / HTMLTextAreaElement / React.ReactElement<InputProps> | `<Input />` |
| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` |
| filterOption | 是否根据输入项进行筛选。当其为一个函数时，会接收 `inputValue` `option` 两个参数，当 `option` 符合筛选条件时，应返回 `true`，反之则返回 `false`。 | boolean or function(inputValue, option) | true |

64
components/auto-complete/style/index.less
View File

@@ -1,64 +0,0 @@
@import "../../style/themes/default";
@import "../../style/mixins/index";
@import "../../input/style/mixin";
@input-prefix-cls: ~"@{ant-prefix}-input";
@select-prefix-cls: ~"@{ant-prefix}-select";
@autocomplete-prefix-cls: ~"@{select-prefix-cls}-auto-complete";
.@{autocomplete-prefix-cls} {
&.@{select-prefix-cls} {
.@{select-prefix-cls} {
&-selection {
border: 0;
box-shadow: none;
&__rendered {
margin-left: 0;
margin-right: 0;
height: 100%;
line-height: @input-height-base;
}
&__placeholder {
margin-left: (@input-padding-horizontal + 1);
margin-right: (@input-padding-horizontal + 1);
}
}
}
&-allow-clear {
.@{select-prefix-cls}-selection:hover .@{select-prefix-cls}-selection__rendered {
margin-right: 0 !important;
}
}
.@{input-prefix-cls} {
background: transparent;
}
&-lg {
.@{select-prefix-cls}-selection__rendered {
line-height: @input-height-lg;
}
.@{input-prefix-cls} {
.input-lg();
}
}
&-sm {
.@{select-prefix-cls}-selection__rendered {
line-height: @input-height-sm;
}
.@{input-prefix-cls} {
.input-sm();
}
}
.@{input-prefix-cls} {
border-width: @border-width-base;
&:focus,
&:hover {
.hover;
}
}
}
}

11
components/avatar/__tests__/Avatar.test.js
View File

@@ -1,11 +0,0 @@
import React from 'react';
import { mount } from 'enzyme';
import Avatar from '..';
describe('Avatar Render', () => {
it('Render long string correctly', () => {
const wrapper = mount(<Avatar>TestString</Avatar>);
const children = wrapper.find('.ant-avatar-string');
expect(children.length).toBe(1);
});
});

329
components/avatar/__tests__/__snapshots__/demo.test.js.snap
View File

@@ -1,329 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/avatar/demo/badge.md correctly 1`] = `
<div>
<span
style="margin-right:24px;"
>
<span
class="ant-badge"
title="1"
>
<span
class="ant-avatar ant-avatar-square ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<sup
class="ant-scroll-number ant-badge-count"
data-show="true"
>
<span
class="ant-scroll-number-only"
style="transition:none;-ms-transform:translateY(-1100%);-webkit-transform:translateY(-1100%);transform:translateY(-1100%);"
>
<p
class=""
>
0
</p>
<p
class=""
>
1
</p>
<p
class=""
>
2
</p>
<p
class=""
>
3
</p>
<p
class=""
>
4
</p>
<p
class=""
>
5
</p>
<p
class=""
>
6
</p>
<p
class=""
>
7
</p>
<p
class=""
>
8
</p>
<p
class=""
>
9
</p>
<p
class=""
>
0
</p>
<p
class="current"
>
1
</p>
<p
class=""
>
2
</p>
<p
class=""
>
3
</p>
<p
class=""
>
4
</p>
<p
class=""
>
5
</p>
<p
class=""
>
6
</p>
<p
class=""
>
7
</p>
<p
class=""
>
8
</p>
<p
class=""
>
9
</p>
<p
class=""
>
0
</p>
<p
class=""
>
1
</p>
<p
class=""
>
2
</p>
<p
class=""
>
3
</p>
<p
class=""
>
4
</p>
<p
class=""
>
5
</p>
<p
class=""
>
6
</p>
<p
class=""
>
7
</p>
<p
class=""
>
8
</p>
<p
class=""
>
9
</p>
</span>
</sup>
</span>
</span>
<span>
<span
class="ant-badge"
>
<span
class="ant-avatar ant-avatar-square ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<sup
class="ant-scroll-number ant-badge-dot"
data-show="true"
/>
</span>
</span>
</div>
`;
exports[`renders ./components/avatar/demo/basic.md correctly 1`] = `
<div>
<div>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<span
class="ant-avatar ant-avatar-sm ant-avatar-circle ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
</div>
<div>
<span
class="ant-avatar ant-avatar-lg ant-avatar-square ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<span
class="ant-avatar ant-avatar-square ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<span
class="ant-avatar ant-avatar-sm ant-avatar-square ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
</div>
</div>
`;
exports[`renders ./components/avatar/demo/dynamic.md correctly 1`] = `
<div>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color:#f56a00;"
>
<span
class="ant-avatar-string"
>
U
</span>
</span>
<button
class="ant-btn ant-btn-sm"
style="margin-left:16px;"
type="button"
>
<span>
Change
</span>
</button>
</div>
`;
exports[`renders ./components/avatar/demo/type.md correctly 1`] = `
<div>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
>
<i
class="anticon anticon-user"
/>
</span>
<span
class="ant-avatar ant-avatar-circle"
>
<span
class="ant-avatar-string"
>
U
</span>
</span>
<span
class="ant-avatar ant-avatar-circle"
>
<span
class="ant-avatar-string"
>
USER
</span>
</span>
<span
class="ant-avatar ant-avatar-circle ant-avatar-image"
>
<img
src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png"
/>
</span>
<span
class="ant-avatar ant-avatar-circle"
style="color:#f56a00;background-color:#fde3cf;"
>
<span
class="ant-avatar-string"
>
U
</span>
</span>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color:#87d068;"
>
<i
class="anticon anticon-user"
/>
</span>
</div>
`;

3
components/avatar/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('avatar');

29
components/avatar/demo/badge.md
View File

@@ -1,29 +0,0 @@
---
order: 3
title:
zh-CN: 带徽标的头像
en-US: With Badge
---
## zh-CN
通常用于消息提示。
## en-US
Usually used for messages remind.
````jsx
import { Avatar, Badge } from 'antd';
ReactDOM.render(
<div>
<span style={{ marginRight: 24 }}>
<Badge count={1}><Avatar shape="square" icon="user" /></Badge>
</span>
<span>
<Badge dot><Avatar shape="square" icon="user" /></Badge>
</span>
</div>
, mountNode);
````

40
components/avatar/demo/basic.md
View File

@@ -1,40 +0,0 @@
---
order: 0
title:
zh-CN: 基本
en-US: Basic
---
## zh-CN
头像有三种尺寸，两种形状可选。
## en-US
Three sizes and two shapes are available.
````jsx
import { Avatar } from 'antd';
ReactDOM.render(
<div>
<div>
<Avatar size="large" icon="user" />
<Avatar icon="user" />
<Avatar size="small" icon="user" />
</div>
<div>
<Avatar shape="square" size="large" icon="user" />
<Avatar shape="square" icon="user" />
<Avatar shape="square" size="small" icon="user" />
</div>
</div>
, mountNode);
````
<style>
#components-avatar-demo-basic .ant-avatar {
margin-top: 16px;
margin-right: 16px;
}
</style>

49
components/avatar/demo/dynamic.md
View File

@@ -1,49 +0,0 @@
---
order: 2
title:
zh-CN: 自动调整字符大小
en-US: Autoset Font Size
---
## zh-CN
对于字符型的头像，当字符串较长时，字体大小可以根据头像宽度自动调整。
## en-US
For letter type Avatar, when the letters are too long to display, the font size can be automatically adjusted according to the width of the Avatar.
````jsx
import { Avatar, Button } from 'antd';
const UserList = ['U', 'Lucy', 'Tom', 'Edward'];
const colorList = ['#f56a00', '#7265e6', '#ffbf00', '#00a2ae'];
class Autoset extends React.Component {
constructor(props) {
super(props);
this.state = {
user: UserList[0],
color: colorList[0],
};
}
changeUser = () => {
const index = UserList.indexOf(this.state.user);
this.setState({
user: index < UserList.length - 1 ? UserList[index + 1] : UserList[0],
color: index < colorList.length - 1 ? colorList[index + 1] : colorList[0],
});
}
render() {
return (
<div>
<Avatar style={{ backgroundColor: this.state.color }} size="large">{this.state.user}</Avatar>
<Button size="small" style={{ marginLeft: 16 }} onClick={this.changeUser}>Change</Button>
</div>
);
}
}
ReactDOM.render(<Autoset />
, mountNode);
````

36
components/avatar/demo/type.md
View File

@@ -1,36 +0,0 @@
---
order: 1
title:
zh-CN: 类型
en-US: Type
---
## zh-CN
支持三种类型：图片、Icon 以及字符，其中 Icon 和字符型可以自定义图标颜色及背景色。
## en-US
Image, Icon and letter are supported, and the latter two kinds avatar can have custom colors and background colors.
````jsx
import { Avatar } from 'antd';
ReactDOM.render(
<div>
<Avatar icon="user" />
<Avatar>U</Avatar>
<Avatar>USER</Avatar>
<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
<Avatar style={{ color: '#f56a00', backgroundColor: '#fde3cf' }}>U</Avatar>
<Avatar style={{ backgroundColor: '#87d068' }} icon="user" />
</div>
, mountNode);
````
<style>
#components-avatar-demo-type .ant-avatar {
margin-top: 16px;
margin-right: 16px;
}
</style>

16
components/avatar/index.en-US.md
View File

@@ -1,16 +0,0 @@
---
category: Components
type: Data Display
title: Avatar
---
Avatars can be used to represent people or object, which supports image, antd-Icon, or letter.
## API
| Property | Description | Type | Default |
|----------- |--------------------------------------------------------- | ---------- |-------|
| type | to set the shape of avatar | Enum{ 'circle', 'square' } | `circle` |
| size | to set the size of avatar | Enum{ 'large', 'small', 'default' } | `default` |
| src | the address of a image avatar | string | - |
| icon | the icon type of a icon avatar, see `Icon` Component | string | - |

124
components/avatar/index.tsx
View File

@@ -1,124 +0,0 @@
import React from 'react';
import ReactDOM from 'react-dom';
import Icon from '../icon';
import classNames from 'classnames';
export interface AvatarProps {
/** Shape of avatar, options:`circle`, `square` */
shape?: 'circle' | 'square';
/** Size of avatar, options:`large`, `small`, `default` */
size?: 'large' | 'small' | 'default';
/** Src of image avatar */
src?: string;
/** Type of the Icon to be used in avatar */
icon?: string;
style?: React.CSSProperties;
prefixCls?: string;
className?: string;
children?: any;
}
export default class Avatar extends React.Component<AvatarProps, any> {
static defaultProps = {
prefixCls: 'ant-avatar',
shape: 'circle',
size: 'default',
};
private avatarChildren: any;
constructor(props) {
super(props);
this.state = {
scale: 1,
};
}
componentDidMount() {
this.setScale();
}
componentDidUpdate(prevProps, prevState) {
if (prevProps.children !== this.props.children
|| (prevState.scale !== this.state.scale && this.state.scale === 1)) {
this.setScale();
}
}
setScale = () => {
const childrenNode = this.avatarChildren;
if (childrenNode) {
const childrenWidth = childrenNode.offsetWidth;
const avatarWidth = ReactDOM.findDOMNode(this).getBoundingClientRect().width;
// add 4px gap for each side to get better performance
if (avatarWidth - 8 < childrenWidth) {
this.setState({
scale: (avatarWidth - 8) / childrenWidth,
});
} else {
this.setState({
scale: 1,
});
}
}
}
render() {
const {
prefixCls, shape, size, src, icon, className, ...others,
} = this.props;
const sizeCls = classNames({
[`${prefixCls}-lg`]: size === 'large',
[`${prefixCls}-sm`]: size === 'small',
});
const classString = classNames(prefixCls, className, sizeCls, {
[`${prefixCls}-${shape}`]: shape,
[`${prefixCls}-image`]: src,
[`${prefixCls}-icon`]: icon,
});
let children = this.props.children;
if (src) {
children = <img src={src} />;
} else if (icon) {
children = <Icon type={icon} />;
} else {
const childrenNode = this.avatarChildren;
if (childrenNode || this.state.scale !== 1) {
const childrenStyle: React.CSSProperties = {
msTransform: `scale(${this.state.scale})`,
WebkitTransform: `scale(${this.state.scale})`,
transform: `scale(${this.state.scale})`,
position: 'absolute',
display: 'inline-block',
left: `calc(50% - ${Math.round(childrenNode.offsetWidth / 2)}px)`,
};
children = (
<span
className={`${prefixCls}-string`}
ref={span => this.avatarChildren = span}
style={childrenStyle}
>
{children}
</span>
);
} else {
children = (
<span
className={`${prefixCls}-string`}
ref={span => this.avatarChildren = span}
>
{children}
</span>
);
}
}
return (
<span {...others} className={classString}>
{children}
</span>
);
}
}

17
components/avatar/index.zh-CN.md
View File

@@ -1,17 +0,0 @@
---
category: Components
subtitle: 头像
type: Data Display
title: Avatar
---
用来代表用户或事物，支持图片、图标或字符展示。
## API
| 参数 | 说明 | 类型 | 默认值 |
|----------- |--------------------------------------------------------- | ---------- | ------- |
| shape | 指定头像的形状 | Enum{ 'circle', 'square' } | `circle` |
| size | 设置头像的大小 | Enum{ 'large', 'small', 'default' } | `default` |
| src | 图片类头像的资源地址 | string | - |
| icon | 设置头像的图标类型，参考 `Icon` 组件 | string | - |

47
components/avatar/style/index.less
View File

@@ -1,47 +0,0 @@
@import "../../style/themes/default";
@avatar-prefix-cls: ~"@{ant-prefix}-avatar";
.@{avatar-prefix-cls} {
display: inline-block;
text-align: center;
background: @avatar-bg;
color: @avatar-color;
white-space: nowrap;
position: relative;
overflow: hidden;
.avatar-size(@avatar-size-base, @avatar-font-size-base);
&-lg {
.avatar-size(@avatar-size-lg, @avatar-font-size-lg);
}
&-sm {
.avatar-size(@avatar-size-sm, @avatar-font-size-sm);
}
&-square {
border-radius: @avatar-border-radius;
}
& > img {
width: 100%;
height: 100%;
}
}
.avatar-size(@size, @font-size) {
width: @size;
height: @size;
line-height: @size;
border-radius: @size / 2;
& > * {
line-height: @size;
}
&.@{avatar-prefix-cls}-icon {
font-size: @font-size;
}
}

2
components/avatar/style/index.tsx
View File

@@ -1,2 +0,0 @@
import '../../style/index.less';
import './index.less';

25
components/back-top/__tests__/__snapshots__/demo.test.js.snap
View File

@@ -1,25 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders ./components/back-top/demo/basic.md correctly 1`] = `
<div>
Scroll down to see the bottom-right
<strong
style="color:rgba(64, 64, 64, 0.6);"
>
gray
</strong>
button.
</div>
`;
exports[`renders ./components/back-top/demo/custom.md correctly 1`] = `
<div>
Scroll down to see the bottom-right
<strong
style="color:#1088e9;"
>
blue
</strong>
button.
</div>
`;

3
components/back-top/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('back-top');

4
components/back-top/demo/custom.md
View File

@@ -23,7 +23,7 @@ ReactDOM.render(
<div className="ant-back-top-inner">UP</div>
</BackTop>
Scroll down to see the bottom-right
<strong style={{ color: '#1088e9' }}> blue </strong>
<strong style={{ color: '#57c5f7' }}> blue </strong>
button.
</div>,
mountNode
@@ -39,7 +39,7 @@ ReactDOM.render(
width: 40px;
line-height: 40px;
border-radius: 4px;
background-color: #1088e9;
background-color: #57c5f7;
color: #fff;
text-align: center;
font-size: 20px;

6
components/back-top/index.en-US.md
View File

@@ -1,6 +1,6 @@
---
category: Components
type: Other
type: Navigation
title: BackTop
---
@@ -20,6 +20,6 @@ title: BackTop
Property | Description | Type | Default
-----|-----|-----|------
visibilityHeight | the `BackTop` button will not show until the scroll height reaches this value | number | 400
visibilityHeight | the `BackTop` button will not show until the scroll height reaches this value | Number | 400
onClick | a callback function, which can be executed when you click the button | Function | -
target | specifies the scrollable area dom node | () => HTMLElement | () => window

35
components/back-top/index.tsx
View File

@@ -9,6 +9,10 @@ import getRequestAnimationFrame from '../_util/getRequestAnimationFrame';
const reqAnimFrame = getRequestAnimationFrame();
const currentScrollTop = () => {
return window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
};
const easeInOutCubic = (t, b, c, d) => {
const cc = c - b;
t /= d / 2;
@@ -49,16 +53,8 @@ export default class BackTop extends React.Component<BackTopProps, any> {
};
}
getCurrentScrollTop = () => {
const targetNode = (this.props.target || getDefaultTarget)();
if (targetNode === window) {
return window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
}
return (targetNode as HTMLElement).scrollTop;
}
scrollToTop = (e) => {
const scrollTop = this.getCurrentScrollTop();
const scrollTop = currentScrollTop();
const startTime = Date.now();
const frameFunc = () => {
const timestamp = Date.now();
@@ -86,7 +82,7 @@ export default class BackTop extends React.Component<BackTopProps, any> {
const { visibilityHeight, target = getDefaultTarget } = this.props;
const scrollTop = getScroll(target(), true);
this.setState({
visible: scrollTop > (visibilityHeight as number),
visible: scrollTop > visibilityHeight,
});
}
@@ -103,7 +99,10 @@ export default class BackTop extends React.Component<BackTopProps, any> {
render() {
const { prefixCls = 'ant-back-top', className = '', children } = this.props;
const classString = classNames(prefixCls, className);
const classString = classNames({
[prefixCls]: true,
[className]: !!className,
});
const defaultElement = (
<div className={`${prefixCls}-content`}>
@@ -119,15 +118,15 @@ export default class BackTop extends React.Component<BackTopProps, any> {
'visibilityHeight',
]);
const backTopBtn = this.state.visible ? (
<div {...divProps} className={classString} onClick={this.scrollToTop}>
{children || defaultElement}
</div>
) : null;
return (
<Animate component="" transitionName="fade">
{backTopBtn}
{
this.state.visible ?
<div {...divProps} className={classString} onClick={this.scrollToTop}>
{children || defaultElement}
</div>
: null
}
</Animate>
);
}

5
components/back-top/index.zh-CN.md
View File

@@ -1,6 +1,6 @@
---
category: Components
type: Other
type: Navigation
subtitle: 回到顶部
title: BackTop
---
@@ -20,6 +20,5 @@ title: BackTop
| 参数 | 说明 | 类型 | 默认值 |
|-------------|----------------|--------------------|--------------|
| visibilityHeight | 滚动高度达到此参数值才出现 `BackTop` | number | 400 |
| visibilityHeight | 滚动高度达到此参数值才出现 `BackTop` | Number | 400 |
| onClick | 点击按钮的回调函数 | Function | - |
| target | 设置需要监听其滚动事件的元素，值为一个返回对应 DOM 元素的函数 | Function | () => window |

6
components/back-top/style/index.less
View File

@@ -15,13 +15,13 @@
height: 40px;
width: 40px;
border-radius: 20px;
background-color: @back-top-bg;
color: @back-top-color;
background-color: rgba(64, 64, 64, 0.4);
color: #fff;
text-align: center;
transition: all .3s @ease-in-out;
&:hover {
background-color: @back-top-hover-bg;
background-color: rgba(64, 64, 64, 0.6);
transition: all .3s @ease-in-out;
}
}

27
components/badge/ScrollNumber.tsx
View File

@@ -1,5 +1,7 @@
import React from 'react';
import { createElement, Component } from 'react';
import {findDOMNode} from 'react-dom';
import isCssAnimationSupported from '../_util/isCssAnimationSupported';
import assign from 'object-assign';
import omit from 'omit.js';
@@ -17,7 +19,8 @@ export interface ScrollNumberProps {
count?: string | number;
component?: string;
onAnimated?: Function;
style?: React.CSSProperties;
height?: number;
style: React.CSSProperties;
}
export default class ScrollNumber extends Component<ScrollNumberProps, any> {
@@ -26,6 +29,7 @@ export default class ScrollNumber extends Component<ScrollNumberProps, any> {
count: null,
onAnimated() {
},
height: 18,
};
lastCount: any;
@@ -38,6 +42,12 @@ export default class ScrollNumber extends Component<ScrollNumberProps, any> {
};
}
componentDidMount() {
if (!isCssAnimationSupported()) {
findDOMNode(this).className += ' not-support-css-animation';
}
}
getPositionByNum(num, i) {
if (this.state.animateStarted) {
return 10 + num;
@@ -95,15 +105,16 @@ export default class ScrollNumber extends Component<ScrollNumberProps, any> {
renderCurrentNumber(num, i) {
const position = this.getPositionByNum(num, i);
const height = this.props.height;
const removeTransition = this.state.animateStarted ||
(getNumberArray(this.lastCount)[i] === undefined);
return createElement('span', {
className: `${this.props.prefixCls}-only`,
style: {
transition: removeTransition && 'none',
msTransform: `translateY(${-position * 100}%)`,
WebkitTransform: `translateY(${-position * 100}%)`,
transform: `translateY(${-position * 100}%)`,
WebkitTransform: `translateY(${-position * height}px)`,
transform: `translateY(${-position * height}px)`,
height,
},
key: i,
}, this.renderNumberList(position));
@@ -128,16 +139,10 @@ export default class ScrollNumber extends Component<ScrollNumberProps, any> {
]), {
className: `${this.props.prefixCls} ${this.props.className}`,
});
// allow specify the border
// mock border-color by box-shadow for compatible with old usage:
// <Badge count={4} style={{ backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9' }} />
if (props.style && props.style.borderColor) {
props.style.boxShadow = `0 0 0 1px ${props.style.borderColor} inset`;
}
return createElement(
this.props.component || 'sup',
props,
this.renderNumberElement(),
this.renderNumberElement()
);
}
}

1611
components/badge/__tests__/__snapshots__/demo.test.js.snap
View File

File diff suppressed because it is too large Load Diff

3
components/badge/__tests__/demo.test.js
View File

@@ -1,3 +0,0 @@
import demoTest from '../../../tests/shared/demoTest';
demoTest('badge');

27
components/badge/demo/99plus.md Normal file
View File

@@ -0,0 +1,27 @@
---
order: 1
title:
zh-CN: 大数字
en-US: Overflowed count
---
## zh-CN
超过 99 的会显示为 `99+`。
## en-US
`99+` is displayed when count is larger than `99`.
````jsx
import { Badge } from 'antd';
ReactDOM.render(<div>
<Badge count={99}>
<a href="#" className="head-example" />
</Badge>
<Badge count={200}>
<a href="#" className="head-example" />
</Badge>
</div>, mountNode);
````

19
components/badge/demo/basic.md
View File

@@ -7,28 +7,23 @@ title:
## zh-CN
简单的徽章展示，当 `count` 为 `0` 时，默认不显示，但是可以使用 `showZero` 修改为显示。
简单的徽章展示。
## en-US
Simplest Usage. Badge will be hidden when `count` is `0`, but we can use `showZero` to show it.
Simplest Usage.
````jsx
import { Badge } from 'antd';
ReactDOM.render(
<div>
<Badge count={5}>
<a href="#" className="head-example" />
</Badge>
<Badge count={0} showZero>
<a href="#" className="head-example" />
</Badge>
</div>
<Badge count={5}>
<a href="#" className="head-example" />
</Badge>
, mountNode);
````
<style>
````css
.ant-badge:not(.ant-badge-status) {
margin-right: 16px;
}
@@ -39,4 +34,4 @@ ReactDOM.render(
background: #eee;
display: inline-block;
}
</style>
````

64
components/badge/demo/change.md
View File

@@ -14,58 +14,58 @@ title:
The count will be animated as it changes.
````jsx
import { Badge, Button, Icon, Switch } from 'antd';
import { Badge, Button, Icon } from 'antd';
const ButtonGroup = Button.Group;
class Demo extends React.Component {
state = {
count: 5,
show: true,
}
increase = () => {
const Test = React.createClass({
getInitialState() {
return {
count: 5,
show: true,
};
},
increase() {
const count = this.state.count + 1;
this.setState({ count });
}
decline = () => {
},
decline() {
let count = this.state.count - 1;
if (count < 0) {
count = 0;
}
this.setState({ count });
}
onChange = (show) => {
this.setState({ show });
}
},
onClick() {
this.setState({
show: !this.state.show,
});
},
render() {
return (
<div>
<div>
<Badge count={this.state.count}>
<a href="#" className="head-example" />
</Badge>
<Badge count={this.state.count}>
<a href="#" className="head-example" />
</Badge>
<Badge dot={this.state.show}>
<a href="#" className="head-example" />
</Badge>
<div style={{ marginTop: 10 }}>
<ButtonGroup>
<Button onClick={this.decline}>
<Button type="ghost" onClick={this.decline}>
<Icon type="minus" />
</Button>
<Button onClick={this.increase}>
<Button type="ghost" onClick={this.increase}>
<Icon type="plus" />
</Button>
</ButtonGroup>
</div>
<div style={{ marginTop: 10 }}>
<Badge dot={this.state.show}>
<a href="#" className="head-example" />
</Badge>
<Switch onChange={this.onChange} />
<Button type="ghost" onClick={this.onClick} style={{ marginLeft: 8 }}>
Switch state
</Button>
</div>
</div>
);
}
}
},
});
ReactDOM.render(<Demo />, mountNode);
ReactDOM.render(<Test />, mountNode);
````

18
components/badge/demo/dot.md
View File

@@ -16,16 +16,14 @@ This will simply display a red badge, without a specific count.
````jsx
import { Badge, Icon } from 'antd';
ReactDOM.render(
<div>
<Badge dot>
<Icon type="notification" />
</Badge>
<Badge dot>
<a href="#">Link something</a>
</Badge>
</div>
, mountNode);
ReactDOM.render(<div>
<Badge dot>
<Icon type="notification" />
</Badge>
<Badge dot>
<a href="#">Link something</a>
</Badge>
</div>, mountNode);
````
<style>

2
components/badge/demo/link.md
View File

@@ -1,5 +1,5 @@
---
order: 3
order: 2
title:
zh-CN: 可点击
en-US: Clickable

14
components/badge/demo/no-wrapper.md
View File

@@ -1,5 +1,5 @@
---
order: 1
order: 0
title:
zh-CN: 独立使用
en-US: Standalone
@@ -18,11 +18,9 @@ Used in standalone when children is empty.
````jsx
import { Badge } from 'antd';
ReactDOM.render(
<div>
<Badge count={25} />
<Badge count={4} style={{ backgroundColor: '#fff', color: '#999', boxShadow: '0 0 0 1px #d9d9d9 inset' }} />
<Badge count={109} style={{ backgroundColor: '#87d068' }} />
</div>
, mountNode);
ReactDOM.render(<div>
<Badge count={25} />
<Badge count={4} style={{ backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9' }} />
<Badge count={109} style={{ backgroundColor: '#87d068' }} />
</div>, mountNode);
````

32
components/badge/demo/overflow.md
View File

@@ -1,35 +1,27 @@
---
order: 2
order: 6
title:
zh-CN: 封顶数字
en-US: Overflow Count
en-US: Customized overflow count
---
## zh-CN
超过 `overflowCount` 的会显示为 `${overflowCount}+`，默认的 `overflowCount` 为 `99`。
超过 `overflowCount` 的会显示为 `${overflowCount}+`。
## en-US
`${overflowCount}+` is displayed when count is larger than `overflowCount`. The default value of `overflowCount` is `99`.
`${overflowCount}+` is displayed when count is larger than `overflowCount`.
````jsx
import { Badge } from 'antd';
ReactDOM.render(
<div>
<Badge count={99}>
<a href="#" className="head-example" />
</Badge>
<Badge count={100}>
<a href="#" className="head-example" />
</Badge>
<Badge count={99} overflowCount={10}>
<a href="#" className="head-example" />
</Badge>
<Badge count={1000} overflowCount={999}>
<a href="#" className="head-example" />
</Badge>
</div>
, mountNode);
ReactDOM.render(<div>
<Badge count={99} overflowCount={10}>
<a href="#" className="head-example" />
</Badge>
<Badge count={1000} overflowCount={999}>
<a href="#" className="head-example" />
</Badge>
</div>, mountNode);
````

2
components/badge/demo/status.md
View File

@@ -1,5 +1,5 @@
---
order: 6
order: 7
title:
zh-CN: 状态点
en-US: Status

9
components/badge/index.en-US.md
View File

@@ -25,9 +25,8 @@ Badge normally appears in proximity to notification or head picture with eye-cat
| Property | Description | Type | Default |
|----------------|-------------------------|------------|---------|
| count | Number to show in badge | number | |
| overflowCount | Max count to show | number | 99 |
| showZero | Whether to show badge when `count` is zero | boolean | false |
| dot | Whether to show red dot without number | boolean | false |
| count | Number to show in badge | Number | |
| overflowCount | Max count to show | Number | 99 |
| dot | whether to show red dot without number | Boolean | false |
| status | Set Badge as a status dot | Enum{ 'success', 'processing, 'default', 'error', 'warning' } | '' |
| text | If `status` is set, `text` is to set the text of status dot | string | '' |
| text | If `status` is set, `text` is to set the text of status dot | String | '' |

83
components/badge/index.tsx
View File

@@ -1,14 +1,13 @@
import React from 'react';
import PropTypes from 'prop-types';
import Animate from 'rc-animate';
import ScrollNumber from './ScrollNumber';
import classNames from 'classnames';
import warning from '../_util/warning';
import splitObject from '../_util/splitObject';
export interface BadgeProps {
/** Number to show in badge */
count?: number | string;
showZero?: boolean;
count: number | string;
/** Max count to show */
overflowCount?: number;
/** whether to show red dot without number */
@@ -24,57 +23,51 @@ export default class Badge extends React.Component<BadgeProps, any> {
static defaultProps = {
prefixCls: 'ant-badge',
count: null,
showZero: false,
dot: false,
overflowCount: 99,
};
static propTypes = {
count: PropTypes.oneOfType([
PropTypes.string,
PropTypes.number,
count: React.PropTypes.oneOfType([
React.PropTypes.string,
React.PropTypes.number,
]),
showZero: PropTypes.bool,
dot: PropTypes.bool,
overflowCount: PropTypes.number,
dot: React.PropTypes.bool,
overflowCount: React.PropTypes.number,
};
render() {
const {
count,
showZero,
prefixCls,
overflowCount,
className,
style,
children,
dot,
status,
text,
...restProps,
} = this.props;
let [{
count, prefixCls, overflowCount, className, style, children, dot, status, text,
}, restProps] = splitObject(
this.props,
['count', 'prefixCls', 'overflowCount', 'className', 'style', 'children', 'dot', 'status', 'text']
);
const isDot = dot || status;
let displayCount = (count as number) > (overflowCount as number) ? `${overflowCount}+` : count;
const realCount = count;
count = count > overflowCount ? `${overflowCount}+` : count;
// dot mode don't need count
if (isDot) {
displayCount = '';
count = '';
}
const isZero = displayCount === '0' || displayCount === 0;
const isEmpty = displayCount === null || displayCount === undefined || displayCount === '';
const hidden = (isEmpty || (isZero && !showZero)) && !isDot;
// null undefined "" "0" 0
const hidden = (!count || count === '0') && !isDot;
const scrollNumberCls = classNames({
[`${prefixCls}-dot`]: isDot,
[`${prefixCls}-count`]: !isDot,
});
const badgeCls = classNames(className, prefixCls, {
const badgeCls = classNames({
[className]: !!className,
[prefixCls]: true,
[`${prefixCls}-status`]: !!status,
[`${prefixCls}-not-a-wrapper`]: !children,
});
warning(
!(children && status),
'`Badge[children]` and `Badge[status]` cannot be used at the same time.',
'`Badge[children]` and `Badge[status]` cannot be used at the same time.'
);
// <Badge status="success" />
if (!children && status) {
@@ -90,21 +83,8 @@ export default class Badge extends React.Component<BadgeProps, any> {
);
}
const scrollNumber = hidden ? null : (
<ScrollNumber
data-show={!hidden}
className={scrollNumberCls}
count={displayCount}
style={style}
/>
);
const statusText = (hidden || !text) ? null : (
<span className={`${prefixCls}-status-text`}>{text}</span>
);
return (
<span {...restProps} className={badgeCls} title={count as string}>
<span {...restProps} className={badgeCls} title={realCount}>
{children}
<Animate
component=""
@@ -112,9 +92,20 @@ export default class Badge extends React.Component<BadgeProps, any> {
transitionName={children ? `${prefixCls}-zoom` : ''}
transitionAppear
>
{scrollNumber}
{
hidden ? null :
<ScrollNumber
data-show={!hidden}
className={scrollNumberCls}
count={count}
style={style}
/>
}
</Animate>
{statusText}
{
hidden || !text ? null :
<span className={`${prefixCls}-status-text`}>{text}</span>
}
</span>
);
}

15
components/badge/index.zh-CN.md
View File

@@ -24,11 +24,10 @@ title: Badge
<Badge count={5} />
```
| 参数 | 说明 | 类型 | 默认值 |
|----------------|----------------------------------|------------|---------|
| count | 展示的数字，大于 overflowCount 时显示为 `${overflowCount}+`，为 0 时隐藏 | number | |
| overflowCount | 展示封顶的数字值 | number | 99 |
| showZero | 当数值为 0 时，是否展示 Badge | boolean | false |
| dot | 不展示数字，只有一个小红点 | boolean | false |
| status | 设置 Badge 为状态点 | Enum{ 'success', 'processing, 'default', 'error', 'warning' } | '' |
| text | 在设置了 `status` 的前提下有效，设置状态点的文本 | string | '' |
| 参数 | 说明 | 类型 | 可选值 | 默认值 |
|----------------|----------------------------------|------------|---------|--------|
| count | 展示的数字，大于 overflowCount 时显示为 `${overflowCount}+`，为 0 时隐藏 | Number | | |
| overflowCount | 展示封顶的数字值 | Number | | 99 |
| dot | 不展示数字，只有一个小红点 | Boolean | | false |
| status | 设置 Badge 为状态点 | Enum | 'success'、'processing'、'default'、'error'、'warning' | '' |
| text | 在设置了 `status` 的前提下有效，设置状态点的文本 | String | | '' |

53
components/badge/style/index.less
View File

@@ -12,18 +12,20 @@
&-count {
position: absolute;
transform: translateX(-50%);
top: -@badge-height / 2;
height: @badge-height;
border-radius: @badge-height / 2;
min-width: @badge-height;
top: -10px;
height: 20px;
border-radius: 10px;
min-width: 20px;
background: @highlight-color;
border: 1px solid transparent;
color: #fff;
line-height: @badge-height;
line-height: 18px;
text-align: center;
padding: 0 6px;
font-size: @font-size-base;
white-space: nowrap;
transform-origin: -10% center;
z-index: 10;
font-family: tahoma;
box-shadow: 0 0 0 1px #fff;
a,
@@ -35,10 +37,10 @@
&-dot {
position: absolute;
transform: translateX(-50%);
transform-origin: 0 center;
top: -@badge-dot-size / 2;
height: @badge-dot-size;
width: @badge-dot-size;
transform-origin: 0px center;
top: -4px;
height: 8px;
width: 8px;
border-radius: 100%;
background: @highlight-color;
z-index: 10;
@@ -60,18 +62,7 @@
}
&-processing {
background-color: @primary-color;
position: relative;
&:after {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 50%;
border: 1px solid @primary-color;
content: '';
animation: antStatusProcessing 1.2s infinite ease-in-out;
}
animation: antStatusProcessing 1.2s infinite ease-in-out;
}
&-default {
background-color: @normal-color;
@@ -109,12 +100,11 @@
}
@keyframes antStatusProcessing {
0% {
transform: scale(0.8);
opacity: 0.5;
}
0%,
100% {
transform: scale(2.4);
opacity: 1;
}
50% {
opacity: 0;
}
}
@@ -123,10 +113,15 @@
overflow: hidden;
&-only {
display: inline-block;
transition: all .3s @ease-in-out;
height: @badge-height;
transition: transform .3s @ease-in-out;
}
// for IE8/9 display
&.not-support-css-animation &-only {
> p {
height: @badge-height;
display: none;
&.current {
display: block;
}
}
}
}

Some files were not shown because too many files have changed in this diff Show More