mirror of
https://github.com/ant-design/ant-design.git
synced 2026-02-18 07:12:28 +08:00
Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
b6a617f2e9 | ||
|
|
1a790a5a9f | ||
|
|
2a411130bc | ||
|
|
bf22853f41 |
@@ -1,236 +0,0 @@
|
||||
version: 2
|
||||
|
||||
references:
|
||||
container_config: &container_config
|
||||
docker:
|
||||
- image: circleci/node:8
|
||||
working_directory: ~/ant-design
|
||||
|
||||
attach_workspace: &attach_workspace
|
||||
attach_workspace:
|
||||
at: ~/ant-design
|
||||
|
||||
install_react: &install_react
|
||||
run: REACT=15 ./scripts/install-react.sh
|
||||
|
||||
react_15: &react_15
|
||||
environment:
|
||||
REACT: 15
|
||||
|
||||
react_16: &react_16
|
||||
environment:
|
||||
REACT: 16
|
||||
|
||||
workflow: &workflow
|
||||
jobs:
|
||||
- setup:
|
||||
filters:
|
||||
branches:
|
||||
ignore: gh-pages
|
||||
- dist:
|
||||
requires:
|
||||
- setup
|
||||
- compile:
|
||||
requires:
|
||||
- setup
|
||||
- lint:
|
||||
requires:
|
||||
- setup
|
||||
- test_dist:
|
||||
requires:
|
||||
- dist
|
||||
- test_lib:
|
||||
requires:
|
||||
- compile
|
||||
- test_es:
|
||||
requires:
|
||||
- compile
|
||||
- test_dom:
|
||||
requires:
|
||||
- setup
|
||||
- test_node:
|
||||
requires:
|
||||
- setup
|
||||
- test_dist_15:
|
||||
requires:
|
||||
- dist
|
||||
- test_lib_15:
|
||||
requires:
|
||||
- compile
|
||||
- test_es_15:
|
||||
requires:
|
||||
- compile
|
||||
- test_dom_15:
|
||||
requires:
|
||||
- setup
|
||||
- test_node_15:
|
||||
requires:
|
||||
- setup
|
||||
|
||||
jobs:
|
||||
setup:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- run: node -v
|
||||
- run: npm -v
|
||||
- run: npm install
|
||||
- run:
|
||||
command: |
|
||||
set +eo
|
||||
npm ls
|
||||
true
|
||||
- persist_to_workspace:
|
||||
root: ~/ant-design
|
||||
paths:
|
||||
- node_modules
|
||||
|
||||
dist:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run dist
|
||||
- run: node ./tests/dekko/dist.test.js
|
||||
- persist_to_workspace:
|
||||
root: ~/ant-design
|
||||
paths:
|
||||
- dist
|
||||
|
||||
compile:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run compile
|
||||
- run: node ./tests/dekko/lib.test.js
|
||||
- persist_to_workspace:
|
||||
root: ~/ant-design
|
||||
paths:
|
||||
- lib
|
||||
- es
|
||||
|
||||
lint:
|
||||
<<: *container_config
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run lint
|
||||
|
||||
test_dist:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run:
|
||||
command: npm test -- -w 1
|
||||
environment:
|
||||
LIB_DIR: dist
|
||||
|
||||
test_lib:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run:
|
||||
command: npm test -- -w 1
|
||||
environment:
|
||||
LIB_DIR: lib
|
||||
|
||||
test_es:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run:
|
||||
command: npm test -- -w 1
|
||||
environment:
|
||||
LIB_DIR: es
|
||||
|
||||
test_dom:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm test -- -w 1 --coverage
|
||||
- run: bash <(curl -s https://codecov.io/bash)
|
||||
|
||||
test_node:
|
||||
<<: *container_config
|
||||
<<: *react_16
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- run: npm run test-node -- -w 1
|
||||
|
||||
test_dist_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run:
|
||||
command: npm test -- -w 1 -u
|
||||
environment:
|
||||
LIB_DIR: dist
|
||||
|
||||
test_lib_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run:
|
||||
command: npm test -- -w 1 -u
|
||||
environment:
|
||||
LIB_DIR: lib
|
||||
|
||||
test_es_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run:
|
||||
command: npm test -- -w 1 -u
|
||||
environment:
|
||||
LIB_DIR: es
|
||||
|
||||
test_dom_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run: npm test -- -w 1 -u
|
||||
|
||||
test_node_15:
|
||||
<<: *container_config
|
||||
<<: *react_15
|
||||
steps:
|
||||
- checkout
|
||||
- *attach_workspace
|
||||
- *install_react
|
||||
- run: npm run test-node -- -w 1 -u
|
||||
|
||||
workflows:
|
||||
version: 2
|
||||
build_test:
|
||||
<<: *workflow
|
||||
nightly:
|
||||
<<: *workflow
|
||||
triggers:
|
||||
- schedule:
|
||||
cron: "0 0 * * *"
|
||||
filters:
|
||||
branches:
|
||||
only:
|
||||
- master
|
||||
@@ -1,10 +1,6 @@
|
||||
components/**/*.js
|
||||
components/**/*.jsx
|
||||
components/*/__tests__/type.tsx
|
||||
!.eslintrc.js
|
||||
!components/*/__tests__/**/*.js
|
||||
!components/*/demo/*
|
||||
!.*.js
|
||||
|
||||
# Docs templates
|
||||
site/theme/template/IconDisplay/*.js
|
||||
site/theme/template/IconDisplay/*.jsx
|
||||
|
||||
11
.eslintrc.js
11
.eslintrc.js
@@ -8,6 +8,13 @@ const eslintrc = {
|
||||
es6: true,
|
||||
},
|
||||
parser: 'babel-eslint',
|
||||
parserOptions: {
|
||||
ecmaVersion: 6,
|
||||
ecmaFeatures: {
|
||||
jsx: true,
|
||||
experimentalObjectRestSpread: true,
|
||||
},
|
||||
},
|
||||
plugins: [
|
||||
'markdown',
|
||||
'react',
|
||||
@@ -19,8 +26,6 @@ const eslintrc = {
|
||||
'react/sort-comp': 0,
|
||||
'react/prop-types': 0,
|
||||
'react/jsx-first-prop-new-line': 0,
|
||||
'react/jsx-one-expression-per-line': 0,
|
||||
'react/forbid-prop-types': 0,
|
||||
'react/jsx-filename-extension': [1, { extensions: ['.js', '.jsx', '.md'] }],
|
||||
'import/extensions': 0,
|
||||
'import/no-unresolved': 0,
|
||||
@@ -58,8 +63,6 @@ if (process.env.RUN_ENV === 'DEMO') {
|
||||
'eol-last': 0,
|
||||
'no-script-url': 0,
|
||||
'prefer-rest-params': 0,
|
||||
'react/no-access-state-in-setstate': 0,
|
||||
'react/destructuring-assignment': 0,
|
||||
'react/no-multi-comp': 0,
|
||||
'react/prefer-stateless-function': 0,
|
||||
'jsx-a11y/href-no-hash': 0,
|
||||
|
||||
2
.github/PULL_REQUEST_TEMPLATE.md
vendored
2
.github/PULL_REQUEST_TEMPLATE.md
vendored
@@ -2,7 +2,7 @@ First of all, thank you for your contribution! :-)
|
||||
|
||||
Please makes sure that these checkboxes are checked before submitting your PR, thank you!
|
||||
|
||||
* [ ] Make sure that you propose PR to right branch: bugfix for `master`, feature for branch `feature`.
|
||||
* [ ] 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).
|
||||
* [ ] 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.
|
||||
|
||||
14
.github/lock.yml
vendored
14
.github/lock.yml
vendored
@@ -1,14 +0,0 @@
|
||||
# Configuration for lock-threads - https://github.com/dessant/lock-threads
|
||||
|
||||
# Number of days of inactivity before a closed issue or pull request is locked
|
||||
daysUntilLock: 365
|
||||
# Comment to post before locking. Set to `false` to disable
|
||||
lockComment: >
|
||||
This thread has been automatically locked because it has not had recent
|
||||
activity. Please open a new issue for related bugs and link to relevant
|
||||
comments in this thread.
|
||||
# Issues or pull requests with these labels will not be locked
|
||||
# exemptLabels:
|
||||
# - no-locking
|
||||
# Limit to only `issues` or `pulls`
|
||||
only: issues
|
||||
5
.gitignore
vendored
5
.gitignore
vendored
@@ -38,8 +38,3 @@ components/**/*.jsx
|
||||
!components/**/__tests__/*.js
|
||||
!components/**/__tests__/*.js.snap
|
||||
/.history
|
||||
|
||||
# Docs templates
|
||||
site/theme/template/IconDisplay/*.js
|
||||
site/theme/template/IconDisplay/*.jsx
|
||||
site/theme/template/IconDisplay/fields.js
|
||||
|
||||
6
.jest.js
6
.jest.js
@@ -2,11 +2,10 @@ const libDir = process.env.LIB_DIR;
|
||||
|
||||
const transformIgnorePatterns = [
|
||||
'/dist/',
|
||||
'node_modules/[^/]+?/(?!(es|node_modules)/)', // Ignore modules without es dir
|
||||
'node_modules\/[^/]+?\/(?!(es|node_modules)\/)', // Ignore modules without es dir
|
||||
];
|
||||
|
||||
module.exports = {
|
||||
verbose: true,
|
||||
setupFiles: [
|
||||
'./tests/setup.js',
|
||||
],
|
||||
@@ -47,7 +46,6 @@ module.exports = {
|
||||
globals: {
|
||||
'ts-jest': {
|
||||
tsConfigFile: './tsconfig.test.json',
|
||||
},
|
||||
}
|
||||
},
|
||||
testURL: 'http://localhost',
|
||||
};
|
||||
|
||||
@@ -16,11 +16,11 @@ module.exports = {
|
||||
testRegex: 'demo\\.test\\.js$',
|
||||
testEnvironment: 'node',
|
||||
snapshotSerializers: [
|
||||
'enzyme-to-json/serializer',
|
||||
'enzyme-to-json/serializer'
|
||||
],
|
||||
globals: {
|
||||
'ts-jest': {
|
||||
tsConfigFile: './tsconfig.test.json',
|
||||
},
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
28
.travis.yml
28
.travis.yml
@@ -3,26 +3,22 @@ sudo: false
|
||||
language: node_js
|
||||
|
||||
node_js:
|
||||
- 10
|
||||
|
||||
cache:
|
||||
directories:
|
||||
- $HOME/.npm
|
||||
- 8
|
||||
|
||||
matrix:
|
||||
fast_finish: true
|
||||
include:
|
||||
- env: TEST_TYPE=lint
|
||||
- env: REACT=16 TEST_TYPE=test:dist
|
||||
- env: REACT=16 TEST_TYPE=test:lib
|
||||
- env: REACT=16 TEST_TYPE=test:es
|
||||
- env: REACT=16 TEST_TYPE=test:dom
|
||||
- env: REACT=16 TEST_TYPE=test:node
|
||||
- env: REACT=15 TEST_TYPE=test:dist
|
||||
- env: REACT=15 TEST_TYPE=test:lib
|
||||
- env: REACT=15 TEST_TYPE=test:es
|
||||
- env: REACT=15 TEST_TYPE=test:dom
|
||||
- env: REACT=15 TEST_TYPE=test:node
|
||||
- env: TEST_TYPE=lint
|
||||
- env: REACT=16 TEST_TYPE=test:dist
|
||||
- env: REACT=16 TEST_TYPE=test:lib
|
||||
- env: REACT=16 TEST_TYPE=test:es
|
||||
- env: REACT=16 TEST_TYPE=test:dom
|
||||
- env: REACT=16 TEST_TYPE=test:node
|
||||
- env: REACT=15 TEST_TYPE=test:dist
|
||||
- env: REACT=15 TEST_TYPE=test:lib
|
||||
- env: REACT=15 TEST_TYPE=test:es
|
||||
- env: REACT=15 TEST_TYPE=test:dom
|
||||
- env: REACT=15 TEST_TYPE=test:node
|
||||
|
||||
before_script:
|
||||
- scripts/install-react.sh
|
||||
|
||||
144
AUTHORS.txt
144
AUTHORS.txt
@@ -1,41 +1,29 @@
|
||||
17073025 <17073025@cnsuning.com>
|
||||
778758944 <778758944@qq.com>
|
||||
Aaron Planell López <aaronplanell@gmail.com>
|
||||
Aditya Padhi <aditya.padhi@outlook.com>
|
||||
Adrian Dimitrov <dimitrov.adrian@gmail.com>
|
||||
Albert Zheng <lisong.zheng@gmail.com>
|
||||
Albert 理斯特 <shuaizhexu@gmail.com>
|
||||
Aleck Landgraf <aleck.landgraf@gmail.com>
|
||||
Alexander <labriko@yandex.ru>
|
||||
Alexander Anpleenko <vaeum@yandex.com>
|
||||
Alexander Suevalov <suevalov.work@gmail.com>
|
||||
Alexandre Kirszenberg <a.kirszenberg@gmail.com>
|
||||
Alexey Yakovlev <yallie@yandex.ru>
|
||||
Amorites <751809522@qq.com>
|
||||
Amumu <yoyo837@hotmail.com>
|
||||
Anas Tawfeek <anas.tawfeek@outlook.com>
|
||||
Andre Perunicic <andre@intoli.com>
|
||||
Andrew Murray <radarhere@gmail.com>
|
||||
Andrey G <plandem@gmail.com>
|
||||
Andrzej Dybionka <andrzej@arabel.la>
|
||||
André <mazoni.andre@gmail.com>
|
||||
Arnab Sen <arnabsen@gmail.com>
|
||||
Arthur Denner Oliveira Santos <arthurdenner7@gmail.com>
|
||||
Arvin Xu <arvinx@foxmail.com>
|
||||
Ash Kumar <kumar.ashwin@outlook.com>
|
||||
BK Heleth <bon.hoo@hotmail.com>
|
||||
Babajide Fowotade <jide.b.tade@gmail.com>
|
||||
Bartek <bartek.kozera@gmail.com>
|
||||
Benedikt Franke <benedikt@franke.tech>
|
||||
Benjamin Kniffler <bkniffler@me.com>
|
||||
Benjy Cui <benjytrys@gmail.com>
|
||||
Benoît Latinier <benoit@latinier.fr>
|
||||
Bernie <bernie.wangbj@gmail.com>
|
||||
Bilal Sirazitdinov <bilalsir@yandex.ru>
|
||||
Bill Sheikh <bilawals22@gmail.com>
|
||||
Bo Chen <bochen2014@yahoo.com>
|
||||
Bozhao <yubz86@gmail.com>
|
||||
Bradley Xu <xgheaven@gmail.com>
|
||||
Brett Lamy <bel423@me.com>
|
||||
Brook Shi <iwxiaot@gmail.com>
|
||||
Bruce Mitchener <bruce.mitchener@gmail.com>
|
||||
@@ -44,77 +32,52 @@ Bryan Berger <bb@ga.co>
|
||||
C <4019980@qq.com>
|
||||
Cam Song <neosoyn@gmail.com>
|
||||
Camol <kwwnjujlc@sina.com>
|
||||
Cang Ta <hoksilato176@gmail.com>
|
||||
Canwen Xu <canwenxu@126.com>
|
||||
Catalin Miron <mironcatalin@gmail.com>
|
||||
Cee Cirno <i@cee.moe>
|
||||
Chandler Moisen <chandlermoisen@gmail.com>
|
||||
Chang Wang <cheapsteak@gmail.com>
|
||||
Charles Covey-Brandt <chazcb@gmail.com>
|
||||
Chenjia <ariesjia00@hotmail.com>
|
||||
Chikara Chan <chenhongtu@51xianqu.net>
|
||||
Chris Kelly <cjke.7777@gmail.com>
|
||||
ChrisFan <chris.fan.dev@gmail.com>
|
||||
Christian <chr.vadala@gmail.com>
|
||||
Christian Vadalà <chr.vadala@gmail.com>
|
||||
Christopher Deutsch <cd@cdeutsch.com>
|
||||
Chuang Yu <cyu9960@gmail.com>
|
||||
Claudio Restifo <claudio.restifo@gmail.com>
|
||||
Cody Chan <int64ago@gmail.com>
|
||||
Colton Pierson <colton@coltonpierson.com>
|
||||
Confiks <confiks@scriptbase.org>
|
||||
Cong Zhang <dancerphil1994@gmail.com>
|
||||
Conway Anderson <hello@conwayanderson.com>
|
||||
Cordaro <elvis07@163.com>
|
||||
D & R <jdz321@qq.com>
|
||||
Daewoong Moon <wiziple@gmail.com>
|
||||
Damian Green <damian.green@microlease.com>
|
||||
Dan Minshew <ofenixculpa@gmail.com>
|
||||
Dane David <dndavid102@gmail.com>
|
||||
Daniel Gomez <dgomez@orangeloops.com>
|
||||
Danny Hoower Antonio Viasus Avila <danjavia@gmail.com>
|
||||
Daqi Song <dqaria@gmail.com>
|
||||
Darren Poon <dyhpoon@gmail.com>
|
||||
David Schneider <davschne@gmail.com>
|
||||
DengYun <tdzl2003@gmail.com>
|
||||
Dimitri Mitropoulos <dimitrimitropoulos@gmail.com>
|
||||
Dmitriy Mironov <dima.dev01@gmail.com>
|
||||
Dmitry Bolotin <bolotin.dmitriy@gmail.com>
|
||||
Dmitry Gladkikh <abdurahmanus@gmail.com>
|
||||
Dmitry Guryev <dmitry.gurjev@gmail.com>
|
||||
Dmitry Manannikov <email@slonoed.net>
|
||||
Dmitry Snegirev <rikkitp@gmail.com>
|
||||
Dorian <dorian@doma.io>
|
||||
DosLin <doslino@gmail.com>
|
||||
Douglas Mason <Demasonjr@gmail.com>
|
||||
Eager <1226393396@qq.com>
|
||||
Eager Wei <1226393396@qq.com>
|
||||
EcmaProSrc.P/ka <asoiso@foxmail.com>
|
||||
Ed Moore <ed@90seconds.tv>
|
||||
Edd Hannay <accounts@edd.fm>
|
||||
Eddie Xie <oeddyo@gmail.com>
|
||||
Eden Wang <Eden.Wang@Akmii.com>
|
||||
Eden Wang <yociduo@vip.qq.com>
|
||||
Eduardo Ludi <eduludi@gmail.com>
|
||||
Egor Yurtaev <yurtaev.egor@gmail.com>
|
||||
Eli White <github@eli-white.com>
|
||||
Emerson Laurentino <emersonlaurentino@hotmail.com>
|
||||
Emma <sima.zhang1990@gmail.com>
|
||||
Eric <84263800@qq.com>
|
||||
Eric Celeste <efc@clst.org>
|
||||
Eric Turriff <eric.turriff@gmail.com>
|
||||
Erwann Mest <m+github@kud.io>
|
||||
Evgeny Kuznetsov <jackk@ya.ru>
|
||||
Eward Song <eward.song@gmail.com>
|
||||
Fernando Giarritiello <fgiarritiello@gmail.com>
|
||||
Flynn <li.fulin@foxmail.com>
|
||||
For177 <mengqiang.q@gmail.com>
|
||||
Gao Jiangmiao <tolbkni@gmail.com>
|
||||
Geoff Holden <geoff@brightloudnoise.com>
|
||||
George Gray <george@ummodesign.com>
|
||||
Graeme Yeates <gyeates@clearpath.ai>
|
||||
Graeme Yeates <yeatesgraeme@gmail.com>
|
||||
Grant Klinsing <gklinsing@gmail.com>
|
||||
Gray Choi <gray.choi.1988@gmail.com>
|
||||
Guan Hao <raptium@gmail.com>
|
||||
Guan Yu Pan (Jacky) <jackypan1989@gmail.com>
|
||||
@@ -122,41 +85,27 @@ HJin.me <hjin.me@gmail.com>
|
||||
Hai Phan Nguyen <pnghai@gmail.com>
|
||||
Haibin Yu <haibin.yu@oceanwing.com>
|
||||
Hanai <ihanai1991@gmail.com>
|
||||
Hanz Luo <lhz0516@gmail.com>
|
||||
Haroen Viaene <fingebimus@me.com>
|
||||
Harshit Mehrotra <harshitmehrotra@hotmail.com>
|
||||
Heaven <ne_smalltown@163.com>
|
||||
Henri Normak <henri.normak@gmail.com>
|
||||
HeskeyBaozi <hezhiyu233@foxmail.com>
|
||||
Hubert Argasinski <argasinski.hubert@gmail.com>
|
||||
Hughen <446370503@163.com>
|
||||
Hugo LEHMANN <shogi31@gmail.com>
|
||||
Igor G <i.gaidai4uk@gmail.com>
|
||||
Ilan <hasanovtk@gmail.com>
|
||||
Ilan Hasanov <hasanovtk@gmail.com>
|
||||
ImJoeHs <865439601@qq.com>
|
||||
Inclined.Z <zjq0717@163.com>
|
||||
Infinity <305870677@qq.com>
|
||||
Ivan Kravets <me@ikravets.com>
|
||||
Ivan Trofimov <ivan@trofimov.link>
|
||||
Ivo Stratev <ivo.stratev.tues@gmail.com>
|
||||
Jack Hsieh <jack@egenware.com>
|
||||
Jack Works <zjwpeter@gmail.com>
|
||||
Jackie.Ls <418292038@qq.com>
|
||||
JaePil Jung <jjp5023@gmail.com>
|
||||
Jake Richards <jake.richards@genesys.com>
|
||||
James <james@schoolshape.com>
|
||||
JamesYin <elantion@gmail.com>
|
||||
Jean-Luc Sorak <jlsorak@icloud.com>
|
||||
Jeffrey Carl Faden <jeffreyatw@gmail.com>
|
||||
Jerry Bendy <jerry@icewingcc.com>
|
||||
Jesper We <jesper@journeyman.se>
|
||||
Jiabin Peng <png.inside@gmail.com>
|
||||
Jialei <jialeicui@126.com>
|
||||
Jieraaa <842533841@qq.com>
|
||||
Jin ZHANG <jz.zhangjin@gmail.com>
|
||||
Jing Ma <mjingm87@qq.com>
|
||||
Jinxuan Zhu <zhujinxuan@gmail.com>
|
||||
Joe <qiaolibo@126.com>
|
||||
Joe Hsu <jhsu.x1@gmail.com>
|
||||
John Johnson III <john@johnjohnson.cc>
|
||||
@@ -165,20 +114,16 @@ Jonatas Walker <jonataswalker@gmail.com>
|
||||
Jonny Buchanan <jonathan.buchanan@gmail.com>
|
||||
Jordan Hornblow <jordan@jch254.com>
|
||||
Josué <ujosuegt@outlook.com>
|
||||
JribiBelhassen <belha9inzaghi@gmail.com>
|
||||
Juan Rodrigo Venegas Boesch <jrvboesch@gmail.com>
|
||||
Junyu Zhan <irrigator@yeah.net>
|
||||
Kaien Liao <liaokaien@gmail.com>
|
||||
Kenaniah Cerny <kenaniah@gmail.com>
|
||||
Kenneth Luján Rosas <elgenio.03@gmail.com>
|
||||
Kenneth Truong <kenneth.e.truong@gmail.com>
|
||||
Kevin Ivan <info@kevinivan.com>
|
||||
KgTong <kgtong1992@gmail.com>
|
||||
Khalifa Lame <khalibloo@gmail.com>
|
||||
Kian <kian@vsu.cc>
|
||||
Kiho · Cham <monkindey@163.com>
|
||||
Kimmo Saari <kimmo.saari@revolt.fi>
|
||||
Kirill Alexander Khalitov <voronar@gmail.com>
|
||||
Kirill Stiopin <kirill.stiopin@hotmail.com>
|
||||
Knacktus <knacktus@gmail.com>
|
||||
Kyle Kelley <rgbkrk@gmail.com>
|
||||
@@ -191,15 +136,12 @@ Leon Shi <superRaytin@163.com>
|
||||
Leon Shi <superRaytin@gmail.com>
|
||||
Liu Yang <zation1@gmail.com>
|
||||
LongYinan <lynweklm@gmail.com>
|
||||
Lucien Lee <lkiral7903@gmail.com>
|
||||
Ludwig Bäcklund <ludli839@student.liu.se>
|
||||
Lyndon001 <lld207@126.com>
|
||||
MG12 <wuzhao.mail@gmail.com>
|
||||
Ma Tianxiao <matx2215@outlook.com>
|
||||
Madis Väin <madisvain@gmail.com>
|
||||
Manjit Kumar <manjit1727@gmail.com>
|
||||
Manweill <mic.liangwenwei@foxmail.com>
|
||||
Marcela Bomfim <mbomfim@live.com>
|
||||
Marco Afonso <mafonso333@gmail.com>
|
||||
Marcus Bransbury <marcus.bransbury@gmail.com>
|
||||
Marius Ileana <visvadw@gmail.com>
|
||||
@@ -208,13 +150,11 @@ Marshall Chen <Juniors.fei@gmail.com>
|
||||
Martin Litvaj <kamahl19@gmail.com>
|
||||
Martin Novák <martinnovak@outlook.com>
|
||||
Mathew <khayaanimations@gmail.com>
|
||||
Matt Lein <matt.lein@code42.com>
|
||||
Maximilian Meyer <Maximilian.Meyer@br.de>
|
||||
Meck <yesmeck@gmail.com>
|
||||
MeiLin <postget.me@gmail.com>
|
||||
Meow-z <372086270@qq.com>
|
||||
Miaow <i@zfeng.net>
|
||||
Michael Wang <ylzcylx@gmail.com>
|
||||
Michalis Macheras <diodosier@gmail.com>
|
||||
Min <dicklwm@163.com>
|
||||
MinJeong Kim <min7859@gmail.com>
|
||||
@@ -233,15 +173,11 @@ Nekron <nekron.hyt@gmail.com>
|
||||
Neverland <chenjiahan@buaa.edu.cn>
|
||||
Nico <nicolas@freddelacompta.com>
|
||||
Nidhi Agarwal <nidhi.agarwal@zomato.com>
|
||||
Nikolay <veseliy07@gmail.com>
|
||||
Nimo <nimo.jser@gmail.com>
|
||||
Nishant Arora <na.nishantarora@gmail.com>
|
||||
Nokecy <Nokecy@163.com>
|
||||
OAwan <georgio.wan@gmail.com>
|
||||
Oleg Kuzava <olegkuzava@gmail.com>
|
||||
Oleksandr Kovalchuk <me.olexandr.kovalchuk@gmail.com>
|
||||
Ooi Yee Wei <ywooi@yahoo.com>
|
||||
Open Next <opennext@126.com>
|
||||
OuYancey <ou.yancey@gmail.com>
|
||||
Panjie Setiawan Wicaksono <panjie@panjiesw.com>
|
||||
Patrick Gidich <patrick.gidich@simnova.com>
|
||||
@@ -257,40 +193,30 @@ Pyroboomka <qwaarty@mail.ru>
|
||||
Qiaosen Huang <joesonw@gmail.com>
|
||||
Qingrong Ke <keqingrong1992@gmail.com>
|
||||
Rafael Cosman <rafaelcosman@alumni.stanford.edu>
|
||||
Rallets <rallet@rallets.com>
|
||||
Ramsés Moreno <ramses@cuatromedios.com>
|
||||
Randy <randypriv@gmail.com>
|
||||
RaoHai <surgesoft@gmail.com>
|
||||
Raphael Chauveau <raph.chauveau@gmail.com>
|
||||
Reed Sun <superreedsun@gmail.com>
|
||||
Rex <zhangzilong.zzl@163.com>
|
||||
Ricardo Raphael Joson <rrjoson08@gmail.com>
|
||||
Richard D. Worth <rdworth@gmail.com>
|
||||
Rick Zhou <rinick@gmail.com>
|
||||
Robert Wilkinson <wilkinson.robert.a@gmail.com>
|
||||
Rohan Malhotra <rohan.root@gmail.com>
|
||||
Rongjian Zhang <pd4d10@gmail.com>
|
||||
Rrrandom <emanonhere@gmail.com>
|
||||
SHEN Lin <shenlin192@gmail.com>
|
||||
Sakol Assawasagool <koobitor@gmail.com>
|
||||
Sam Chen <chenxsan@gmail.com>
|
||||
Sam Maxwell <sam@paybase.io>
|
||||
Samuel Gaus <sam@gaus.co.uk>
|
||||
Sangle <whb97@163.com>
|
||||
Sanjay Kumar <kris.gooner@gmail.com>
|
||||
Sanjay Kumar <sk@tectusdreamlab.com>
|
||||
Scott Sturgeon <scott@tugboatlogic.com>
|
||||
Sean Lin <sean@ejoy.com>
|
||||
Sean Sun <pinggodstudio@gmail.com>
|
||||
Sebastian Blade <blade254353074@hotmail.com>
|
||||
Sebastian Busch <mail@sebastian-bus.ch>
|
||||
Sebastian Busch <s.busch@qbus-enet.de>
|
||||
Sergio Crisostomo <sergiosbox@gmail.com>
|
||||
Shawn Sit <xueqingxiao@gmail.com>
|
||||
ShiTengFei <shitengfei@goyoo.com>
|
||||
Shubham Kanodia <shubhamsizzles@gmail.com>
|
||||
Shun <polytechnics.shun@gmail.com>
|
||||
Shuvalov Anton <anton@shuvalov.info>
|
||||
SimaQ <sima.zhang1990@gmail.com>
|
||||
Spencer <spjy@hawaii.edu>
|
||||
Stephen Esser <Stephen.Esser@gmail.com>
|
||||
@@ -300,13 +226,8 @@ Taylor Sabell <taylorsabell@gmail.com>
|
||||
Tengjiao Cai <caitengjiao1987@gmail.com>
|
||||
Terence <trence320@163.com>
|
||||
The Rock <zhoguoxin@126.com>
|
||||
Thibault Derousseaux <tde@activeviam.com>
|
||||
Thiebaud Thomas <thiebaud.tom@gmail.com>
|
||||
Tino D <ginodeis@gmail.com>
|
||||
Tom Gao <tom@zoomsoft.cc>
|
||||
Tom Xu <tom.xu@antcosa.com>
|
||||
Tomás Francisco <mail@tomasfrancisco.com>
|
||||
Tomáš Szabo <tomas.szabo@deftomat.com>
|
||||
Trotyl Yu <trotyl@qq.com>
|
||||
Troy Thompson <troynt@gmail.com>
|
||||
Tyler <chaotyler@gmail.com>
|
||||
@@ -316,12 +237,9 @@ Valentin Vichnal <valentin@vichnal.com>
|
||||
Vemund Santi <vemund@santi.no>
|
||||
Vic <709147950@qq.com>
|
||||
Vincent Zhang <vxzhong@qq.com>
|
||||
Vitaliy Mazurenko <vitaliymazurenko@gmail.com>
|
||||
ViviaRui <zr1450995198@163.com>
|
||||
Walter Barbagallo <brb.walter@gmail.com>
|
||||
Walter Barbagallo <turbometalskater@gmail.com>
|
||||
Wang Jun <amos.callmexyz@gmail.com>
|
||||
Wang Riwu <riwu0730@gmail.com>
|
||||
Warren Seymour <warren@fountainhead.tech>
|
||||
Wei Zhu <yesmeck@gmail.com>
|
||||
Wenchao Hu <zjuhwc@gmail.com>
|
||||
@@ -329,13 +247,10 @@ Will Chen <willchen90@gmail.com>
|
||||
WingGao <wing.gao@live.com>
|
||||
Wu Haotian <whtsky@gmail.com>
|
||||
XBTop1! <xbtop1@gmail.com>
|
||||
Xiaoming <yokiming1994@gmail.com>
|
||||
Xie Guanglei <xieguanglei@hotmail.com>
|
||||
Xiping.wang <527409987@qq.com>
|
||||
XuMM_12 <owiatsq@sina.cn>
|
||||
Yang Bin <yangkghjh@gmail.com>
|
||||
Yasin Uslu <nepjua@gmail.com>
|
||||
Yevhen Hryhorevskyi <evgeniygrigorevskiy@gmail.com>
|
||||
Yiming <ymjrcc@qq.com>
|
||||
Yogesh <yogeshkumar180592@gmail.com>
|
||||
YuChao Liang <l.yuch@foxmail.com>
|
||||
@@ -343,30 +258,22 @@ Yunus EŞ <yunus@yunuses.com>
|
||||
Yury Kozyrev <urakozz@me.com>
|
||||
Yusuke Ito <novi.mad@gmail.com>
|
||||
Yuwei Ba <i@xiaoba.me>
|
||||
Yuxuan Huo <yuxuan.huo2011@gmail.com>
|
||||
YuyingWu <wuyuying1128@gmail.com>
|
||||
Zack Craig <zack@zack6849.com>
|
||||
Zap <a124116186@qq.com>
|
||||
Zhang Zhi <fytriht@gmail.com>
|
||||
Zheeeng <hi@zheeeng.me>
|
||||
Zhiqiang Gong <elory0513@hotmail.com>
|
||||
Ziluo <gyfzzu@gmail.com>
|
||||
Zohaib Ijaz <mzohaib.qc@gmail.com>
|
||||
afc163 <afc163@gmail.com>
|
||||
agent-z <1607291079@qq.com>
|
||||
ahalimkara <ahalimkara@gmail.com>
|
||||
ascoders <576625322@qq.com>
|
||||
ashishg-qburst <ashishg@qburst.com>
|
||||
bLue <tbdblue@gmail.com>
|
||||
bang <sqibang@gmail.com>
|
||||
bang88 <sqibang@gmail.com>
|
||||
baozefeng <727751065@qq.com>
|
||||
blankzust <450811238@qq.com>
|
||||
byuanama <byuan@ama.com.au>
|
||||
byzyk <bohdan.kh@gmail.com>
|
||||
bzone <yarnbcoder@gmail.com>
|
||||
caoyi <caoyi0905@mail.hfut.edu.cn>
|
||||
carrie-tanminyi <12mytan@gmail.com>
|
||||
cathayandy <wzm_andy@126.com>
|
||||
chaofeis <408067385@qq.com>
|
||||
chchen <cc272309126@gmail.com>
|
||||
@@ -375,15 +282,11 @@ chencheng <sorrycc@gmail.com>
|
||||
cjahv <cjahv@qq.com>
|
||||
clinyong <clinyong@gmail.com>
|
||||
corneyl <cornieljoosse@gmail.com>
|
||||
david.lv <code4funlnyx@gmail.com>
|
||||
davidhatten <david.r.hatten@gmail.com>
|
||||
ddcat1115 <ddcat1115@gmail.com>
|
||||
delesseps <andrewlessels@gmail.com>
|
||||
denzw <denzw@21cn.com>
|
||||
dependabot[bot] <support@dependabot.com>
|
||||
detailyang <detailyang@gmail.com>
|
||||
devqin <devqin@gmail.com>
|
||||
digz6666 <digz6666@gmail.com>
|
||||
djorkaeff <djorkae55@gmail.com>
|
||||
duzliang <duzliang@gmail.com>
|
||||
ecofe <150641329@qq.com>
|
||||
@@ -396,19 +299,13 @@ fengmk2 <m@fengmk2.com>
|
||||
flashback313 <windmark2012@gmail.com>
|
||||
genie <genie88@163.com>
|
||||
gregahren <grega.hren@gmail.com>
|
||||
guifu <picodoth@gmail.com>
|
||||
handycode <lihandi@gmail.com>
|
||||
hank <stonehank310@gmail.com>
|
||||
hanpei <75189218@qq.com>
|
||||
hansnow <hansnow2012@gmail.com>
|
||||
haoxin <coderhaoxin@outlook.com>
|
||||
hardfist <yangjianzju@gmail.com>
|
||||
hauwa123 <hauwa.aminu@outlook.com>
|
||||
hehe <xpc_kacl@163.com>
|
||||
henryv0 <henryvo94@gmail.com>
|
||||
hi-caicai <hi@cai-cai.me>
|
||||
hongxuWei <hongxu.wei@outlook.com>
|
||||
huangyan.py <huangyan.py@bytedance.com>
|
||||
huzzbuzz <huzzbuzz@outlook.com>
|
||||
iamcastelli <sowed@cyberdude.com>
|
||||
imosapatryk <imosa.patryk@gmail.com>
|
||||
@@ -420,7 +317,6 @@ jasonxia23 <xia.jason23@gmail.com>
|
||||
jiang <155259966@qq.com>
|
||||
jim <wasd2144@hotmail.com>
|
||||
jinouwuque <ee2win@gmail.com>
|
||||
jojoLockLock <miffyschou@sina.com>
|
||||
junjing.zhang <zhangjunjing@gmail.com>
|
||||
kacjay <45483388@qq.com>
|
||||
kagawagao <kingsongao1221@gmail.com>
|
||||
@@ -438,14 +334,12 @@ kuang <p2227@hotmail.com>
|
||||
kun sam <kunsam624@icloud.com>
|
||||
leadream <857098475@qq.com>
|
||||
lehug <zcszuo5811@126.com>
|
||||
leijingdao <leijingdao@163.com>
|
||||
leon.shi <superRaytin@163.com>
|
||||
lgmcolin <gengmin.lgm@gmail.com>
|
||||
lgmcolin <lgmcolin@gmail.com>
|
||||
liangfei <njliangfei@gmail.com>
|
||||
liekkas <zjq0717@163.com>
|
||||
lihqi <455711093@qq.com>
|
||||
littleLane <857183384@qq.com>
|
||||
lixiaochou077 <qi.liqi07@gmail.com>
|
||||
lixiaoyang <lixiaoyang2345@gmail.com>
|
||||
lixiaoyang1992 <lixiaoyang2345@gmail.com>
|
||||
@@ -459,36 +353,24 @@ memoryza <jincai.wang@foxmail.com>
|
||||
mgrdevport <mgrdevport@gmail.com>
|
||||
mitchell.demler <mitchell.demler@harcourts.net>
|
||||
mkermani144 <mkermani144@gmail.com>
|
||||
mmmveggies <jakeselig@gmail.com>
|
||||
mofelee <mofe@me.com>
|
||||
monkindey <monkindey@163.com>
|
||||
mushan0x0 <mushan0x0@gmail.com>
|
||||
muzea <mr.muzea@gmail.com>
|
||||
muzuiget <muzuiget@gmail.com>
|
||||
natergj <nater_nater@me.com>
|
||||
neekey <ni184775761@gmail.com>
|
||||
niko <644506165@qq.com>
|
||||
nikogu <644506165@qq.com>
|
||||
nuintun <nuintun@qq.com>
|
||||
ohhoney1 <1269075501@qq.com>
|
||||
paranoidjk <hust2012jiangkai@gmail.com>
|
||||
parlop <parlop@gmail.com>
|
||||
pbrink231 <pbrink231@gmail.com>
|
||||
pd4d10 <pd4d10@gmail.com>
|
||||
peiming <hyrijk@gmail.com>
|
||||
picodoth <picodoth@gmail.com>
|
||||
picodoth <pikaleize@gmail.com>
|
||||
pinggod <pinggodstudio@gmail.com>
|
||||
pizn <pizner@gmail.com>
|
||||
plandem <plandem@gmail.com>
|
||||
popomore <sakura9515@gmail.com>
|
||||
qixian.cs@outlook.com <wasd2144@hotmail.com>
|
||||
qliu <1403927509@qq.com>
|
||||
qubaoming <qubaoming@didichuxing.com>
|
||||
ravirambles <ravirambles@gmail.com>
|
||||
ryangun <ryangun@foxmail.com>
|
||||
ryanhoho <hswacoal@gmail.com>
|
||||
ryannz <c5e1856@gmail.com>
|
||||
sadmark <zhoubin@laidian360.com>
|
||||
sallen450 <jqh101@sina.com>
|
||||
shelwin <wxfans@gmail.com>
|
||||
@@ -497,15 +379,11 @@ shlice <licesh@gmail.com>
|
||||
shouyong <enlangs@163.com>
|
||||
simaQ <sima.zhang1990@gmail.com>
|
||||
slientcloud <rjmuqiang@gmail.com>
|
||||
sliwey <qlw1009@gmail.com>
|
||||
snadn <snadn@snadn.cn>
|
||||
sojournerc <cmeyer@zvelo.com>
|
||||
sorrycc <sorrycc@gmail.com>
|
||||
sosohime <theziming@126.com>
|
||||
swindme <swindme@163.com>
|
||||
syssam <s.y.s.sam.sys@gmail.com>
|
||||
tangjinzhou <415800467@qq.com>
|
||||
tangjinzhou <tangjinzhou@yidian-inc.com>
|
||||
thegatheringstorm <tgs@tgs.blue>
|
||||
tianli.zhao <275287902@qq.com>
|
||||
tom <caolvchong@gmail.com>
|
||||
@@ -514,27 +392,21 @@ u3u <qwq@qwq.cat>
|
||||
ustccjw <317713370@qq.com>
|
||||
valleykid <valleykiddy@gmail.com>
|
||||
vgeyi <vgeyiz@126.com>
|
||||
wangshantao <605682551@qq.com>
|
||||
wangtao0101 <yuecjn@gmail.com>
|
||||
wangxiaolei <fatelei@gmail.com>
|
||||
wangxueliang <wangxueliang@yidian-inc.com>
|
||||
warmhug <hualei5280@gmail.com>
|
||||
whtang906 <whtang906@gmail.com>
|
||||
wizawu <wizawu@gmail.com>
|
||||
wonyun <wy393767068@163.com>
|
||||
xiaofan2406 <xiaofan2406@gmail.com>
|
||||
y-take <y.takey@gmail.com>
|
||||
yangwukang <yangwukang@boco.com.cn>
|
||||
yeliex <yeliex@yeliex.com>
|
||||
yiminanci <yiminanci@gmail.com>
|
||||
yiminghe <yiminghe@gmail.com>
|
||||
yociduo <yociduo@vip.qq.com>
|
||||
yoyo837 <yoyo837@hotmail.com>
|
||||
yubozhao <yubz86@gmail.com>
|
||||
yuche <i@yuche.me>
|
||||
z <haig8@msn.com>
|
||||
zack <zxyah@126.com>
|
||||
zelongc <nickcong123@gmail.com>
|
||||
zerob4wl <zerob4wl@gmail.com>
|
||||
zhangpc <zhangpc@tenxcloud.com>
|
||||
zhaocai <lzc09008@gmail.com>
|
||||
@@ -543,45 +415,31 @@ zhuyue <fuping.dfp@antfin.com>
|
||||
zilong <jzlxiaohei@163.com>
|
||||
zinkey <yaya@uloveit.com.cn>
|
||||
zollero <corona7@163.com>
|
||||
zombieJ <smith3816@gmail.com>
|
||||
zombiej <smith3816@gmail.com>
|
||||
zongzi531 <zongzi.xy@gmail.com>
|
||||
ztplz <mysticzt@gmail.com>
|
||||
zuiidea <zuiiidea@gmail.com>
|
||||
邦 <sqibang@gmail.com>
|
||||
爱but的苍蝇 <354788473@qq.com>
|
||||
拷钉 <41830859@qq.com>
|
||||
苏秦 <646382806@qq.com>
|
||||
竹尔 <Juelchiang@gmail.com>
|
||||
偏右 <afc163@gmail.com>
|
||||
英布 <chaoren1641@gmail.com>
|
||||
朮厃 <cn.ah.liu@gmail.com>
|
||||
张聪 <dancerphil1994@gmail.com>
|
||||
诸岳 <dengfuping_develop@163.com>
|
||||
逸达 <dqaria@gmail.com>
|
||||
诸岳 <fuping.dfp@antfin.com>
|
||||
刘红 <liuhong1.happy@163.com>
|
||||
宝码 <noyobo@gmail.com>
|
||||
陈帅 <qixian.cs@outlook.com>
|
||||
蔡伦 <sliuqin@gmail.com>
|
||||
陆离 <surgesoft@gmail.com>
|
||||
愚道 <tingzhao.ytz@antfin.com>
|
||||
陈帅 <wasd2144@hotmail.com>
|
||||
松子 <window.pibarr@gmail.com>
|
||||
付引 <xxxquotes@gmail.com>
|
||||
可乐 <zaxlct@foxmail.com>
|
||||
山客 <zeakhold@gmail.com>
|
||||
曾凯 <zengkai2009@foxmail.com>
|
||||
低位 <zhujun87654321@gmail.com>
|
||||
广彬-梁 <326741518@qq.com>
|
||||
何志勇 <15988134176@163.com>
|
||||
徐坤龙 <272992168@qq.com>
|
||||
黄子毅 <576625322@qq.com>
|
||||
翁润雨 <593110501@qq.com>
|
||||
崔宏森 <948346354@qq.com>
|
||||
董天成 <dongtiangche@outlook.com>
|
||||
方剑成 <fjc0kb@gmail.com>
|
||||
包子熊 <hezhiyu233@foxmail.com>
|
||||
闲耘™ <hotoo.cn@gmail.com>
|
||||
一喵呜 <hyb628@gmail.com>
|
||||
吕立青 <jimmy.jinglv@gmail.com>
|
||||
@@ -592,9 +450,7 @@ zuiidea <zuiiidea@gmail.com>
|
||||
柚子男 <yozman@sina.com>
|
||||
愚指导 <yutingzhao1991@sina.com>
|
||||
愚指导-TZ <yutingzhao1991@sina.com>
|
||||
杨小事er <Uiryzd@163.com>
|
||||
超能刚哥 <margox@foxmail.com>
|
||||
马金花儿 <o.o@mug.dog>
|
||||
रोहन मल्होत्रा <rohan.malhotra@adwyze.com>
|
||||
白羊座小葛 <abeyuhang@gmail.com>
|
||||
薛定谔的猫 <hh_2013@foxmail.com>
|
||||
|
||||
@@ -15,626 +15,6 @@ timeline: true
|
||||
|
||||
---
|
||||
|
||||
## 3.10.5
|
||||
|
||||
`2018-11-09`
|
||||
|
||||
- 🎉 [Landing Templates](https://landing.ant.design) released!
|
||||
- 📖 Published the new [sketch resource](https://github.com/ant-design/ant-design/releases/download/resource/Ant.Design.Components.Beta.3.10.5.sketch) of Ant Design.
|
||||
- Button
|
||||
- 🐞 Fix the style of vertical align in small `Button.Group`. [#12972](https://github.com/ant-design/ant-design/issues/12972)
|
||||
- 🐞 Fix the style of vertical align with `href` prop. [#12978](https://github.com/ant-design/ant-design/issues/12978)
|
||||
- 🐞 Fix the imcompatibility for `Cascader[filedNames]` after `3.7.0` version. [#12970](https://github.com/ant-design/ant-design/issues/12970)
|
||||
- 🐞 Fix that the show date in pop-up layer should be reset when date value is not modified successfully for `DatePicker`. [#12929](https://github.com/ant-design/ant-design/issues/12929)
|
||||
- 🐞 Fix the lose of type `cross` for Icon. [#12970](https://github.com/ant-design/ant-design/issues/12970)
|
||||
- 🐞 Fix the incorrect `mode` for collapsed Menu. [#2782](https://github.com/ant-design/ant-design-pro/issues/2782) [#2783](https://github.com/ant-design/ant-design-pro/issues/2783) [#2786](https://github.com/ant-design/ant-design-pro/issues/2786)
|
||||
- 🐞 Fix the unnecessary `reflow` to avoid weird wave animation for Popover and Tooltip. [#12942](https://github.com/ant-design/ant-design/issues/12942)
|
||||
- Table
|
||||
- 🐞 Fix the style of overflow when nested in other components. [#13025](https://github.com/ant-design/ant-design/issues/13025)
|
||||
- 🐞 Fix the style of overlap between the overlong head content and sort icon. [#12552](https://github.com/ant-design/ant-design/issues/12552) [#12650](https://github.com/ant-design/ant-design/issues/12650)
|
||||
- 🐞 Fix the disapperance when nested in Popover and Popconfirm for Tooltip whose children is `disabled`. [#13001](https://github.com/ant-design/ant-design/issues/13001)
|
||||
- 🐞 Fix the stuck problem when upload non-image file for Upload. [#12948](https://github.com/ant-design/ant-design/issues/12948)
|
||||
- 🐞 Fix that `DOM Object` doesn't support property or method `removeAttribute` in `IE` and `Edge`. [#2423](https://github.com/ant-design/ant-design-pro/issues/2423)
|
||||
- 🐞 Remove the unnecessary wave animation for hidden elements. [#12967](https://github.com/ant-design/ant-design/issues/12967)
|
||||
|
||||
## 3.10.4
|
||||
|
||||
`2018-11-03`
|
||||
|
||||
- 🌟 Support custom modal header style through less variable `@modal-header-bg`. [#12914](https://github.com/ant-design/ant-design/issues/12914)
|
||||
- 🐞 Fixed mask style not working for Modal.method. [#12688](https://github.com/ant-design/ant-design/issues/12688)
|
||||
- 🐞 Fixed Checkbox missing check mark inside table in IE 11. [#12597](https://github.com/ant-design/ant-design/issues/12597)
|
||||
- 🐞 Fixed FormItem having different height with help info. [#12803](https://github.com/ant-design/ant-design/issues/12803)
|
||||
- 🐞 Fixed Divider expands Popover card width under Chrome. [#10914](https://github.com/ant-design/ant-design/issues/10914)
|
||||
- 🐞 Fixed Avatar content not aligned in Popover. [#10917](https://github.com/ant-design/ant-design/issues/#10917)
|
||||
- Button
|
||||
- 🐞 Fixed unable to find node on unmounted components error. [#12843](https://github.com/ant-design/ant-design/issues/12843)
|
||||
- 🐞 Fixed icon margin style. [546c59a](https://github.com/ant-design/ant-design/commit/546c59a4c1a6b482afecbcb4a3cb1e385c0bbdb6)
|
||||
- Table
|
||||
- 🐞 Fixed sorter issue when render function is present in column. [#12870](https://github.com/ant-design/ant-design/issues/12870) [#12737](https://github.com/ant-design/ant-design/issues/12737)
|
||||
- 🐞 Fixed fixed-columns border issue. [#9687](https://github.com/ant-design/ant-design/issues/9687)
|
||||
- TypeScript
|
||||
- 🐞 Fixed Select `onPopupScroll` props definition. [#12913](https://github.com/ant-design/ant-design/pull/12913)
|
||||
- 🐞 Fixed `onFocus` and `onBlur` missing in AutoComplete props. [@muzea](https://github.com/muzea) [#12793](https://github.com/ant-design/ant-design/issues/12793);
|
||||
|
||||
## 3.10.3
|
||||
|
||||
`2018-10-27`
|
||||
|
||||
- 🌟 Improve util function `getScroll` TypeScript definition. [#12784](https://github.com/ant-design/ant-design/pull/12784) [@ztplz](https://github.com/ztplz)
|
||||
- 🐞 Fixed that Checkbox inside CheckboxGroup do not trigger `onChange`. [#12642](https://github.com/ant-design/ant-design/issues/12642)
|
||||
- 🐞 Fixed Calendar month picker not correct when set with `validRange`. [#12675](https://github.com/ant-design/ant-design/issues/12675)
|
||||
- 🐞 Fixed multiple Select drop-down bug when set `dropdownMatchSelectWidth`. [#12816](https://github.com/ant-design/ant-design/pull/12816) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 Fixed Card title overflow bug. [#12680](https://github.com/ant-design/ant-design/issues/12680)
|
||||
- 🐞 Fixed Form[inline] help and extra overlapped. [#12725](https://github.com/ant-design/ant-design/issues/12725)
|
||||
- Table
|
||||
- 🌟 Support custom Table filter backgrounds. [#12775](https://github.com/ant-design/ant-design/pull/12775) [@ivankravets](https://github.com/ivankravets)
|
||||
- 🐞 Adjust small table placeholder style. [#12682](https://github.com/ant-design/ant-design/issues/12682)
|
||||
- 🐞 Fixed small size table header border missing in Firefox. [#12840](https://github.com/ant-design/ant-design/issues/12840)
|
||||
- 🐞 Fixed checkbox align of small/middle size table. [#12723](https://github.com/ant-design/ant-design/issues/12723)
|
||||
|
||||
## 3.10.2
|
||||
|
||||
`2018-10-23`
|
||||
|
||||
- 📝 Translated documentation [patterns overview](https://ant.design/docs/spec/overview) to English. [#12637](https://github.com/ant-design/ant-design/pull/12637) [@ilanus](https://github.com/ilanus)
|
||||
- 🛠 Improve support vi_VN locale for DatePicker component. [#12656](https://github.com/ant-design/ant-design/pull/12656) [@hieuhlc](https://github.com/hieuhlc)
|
||||
- 🐞 Fixed TimePicker style issue in IE11. [#12707](https://github.com/ant-design/ant-design/pull/12707) [jinyaqiao1102](https://github.com/jinyaqiao1102)
|
||||
- 🐞 Fixed Popconfirm defaultVisible. [#12733](https://github.com/ant-design/ant-design/issues/12733)
|
||||
- 🐞 Fixed Table the border missing in Firefox. [#12628](https://github.com/ant-design/ant-design/issues/12628)
|
||||
- 🐞 Add `touch-action: none` css on Slider to fix chrome warning. [#12595](https://github.com/ant-design/ant-design/issues/12595)
|
||||
- 🐞 Fixed Tabs ink-bar vertical css. [#12276](https://github.com/ant-design/ant-design/issues/12276)
|
||||
- 🐞 Fixed vertical align issue of empty Button. [#12681](https://github.com/ant-design/ant-design/issues/12681)
|
||||
- 🐞 Fixed Calendar `locale` prop should have priority. [#12706](https://github.com/ant-design/ant-design/issues/12706)
|
||||
- 🐞 Fixed Checkbox[checked] indeterminate style. [#12724](https://github.com/ant-design/ant-design/issues/12724)
|
||||
- 🐞 Fixed `prefixCls` not passed to Popconfirm's button. [#12677](https://github.com/ant-design/ant-design/pull/12677) [@concefly](https://github.com/concefly)
|
||||
- 🐞 Fixed Edge ignoring `pointer-events:none` on Button's span. [#12712](https://github.com/ant-design/ant-design/pull/12712) [@dazbo](https://github.com/dazbo)
|
||||
- Progress
|
||||
- 🐞 Fixed Progress `strokeColor` props not work. [#12587](https://github.com/ant-design/ant-design/pull/12587) [@lyhper](https://github.com/lyhper)
|
||||
- 🐞 Fixed Progress[type="circle"] should wrap text. [#12718](https://github.com/ant-design/ant-design/issues/12718)
|
||||
- TypeScript
|
||||
- 🐞 Fixed `trexpandedKeys` and `onTreeExpand` definition missing in TreeSelect. [#12648](https://github.com/ant-design/ant-design/pull/12648) [@decadef20](https://github.com/decadef20)
|
||||
- 🐞 Fixed missed property `key` in TabPaneProps. [682af0d](https://github.com/ant-design/ant-design/commit/682af0d44bf38a7d3e487aa909c46409db163030) [@ztplz](https://github.com/ztplz)
|
||||
- 🐞 Fixed some definition of Icon. [3dbc357](https://github.com/ant-design/ant-design/commit/3dbc357ff2837debbb9b36a25b14be4757297cad)
|
||||
|
||||
## 3.10.1
|
||||
|
||||
`2018-10-12`
|
||||
|
||||
- 🎉 [Ant Design Mobile of Angular](http://ng.mobile.ant.design/)(NG-ZORRO-Mobile) released!
|
||||
- 📝 Upgrade document `Real project with dva` to [Real project with umi](https://ant.design/docs/react/practical-projects).
|
||||
- Table
|
||||
- 🐞 Fixed clicking all columns will trigger sort behavior even without `sorter` props. [#12515](https://github.com/ant-design/ant-design/issues/12515)
|
||||
- 🐞 Fixed extra "Sort" title hint of column. [#12613](https://github.com/ant-design/ant-design/issues/12613)
|
||||
- 🐞 Fixed broken style of sort and right-aligned column. [#12552](https://github.com/ant-design/ant-design/issues/12552)
|
||||
- 🐞 Fixed sort not working as expected when `columns` defined in `render`. [#12571](https://github.com/ant-design/ant-design/issues/12571)
|
||||
- 🐞 Fixed sorted column background color of small size Table.
|
||||
- 🐞 Fixed overlap style of Table row selection Checkbox in chrome. [5bef1aa](https://github.com/ant-design/ant-design/commit/5bef1aa6c2e792180ef8d53a1f1489376b8e35db)
|
||||
- 🐞 Fixed broken style of Table inside Form.Item. [#12554](https://github.com/ant-design/ant-design/issues/12554)
|
||||
- DatePicker
|
||||
- 🐞 Tweak Italian locale. [#12413](https://github.com/ant-design/ant-design/issues/12413) [@yp](https://github.com/yp)
|
||||
- 🐞 Fixed that picker does not get focused state after select date. [#12475](https://github.com/ant-design/ant-design/issues/12475)
|
||||
- 🐞 Fixed calendar icon missing when use it in Input.Group. [#12536](https://github.com/ant-design/ant-design/issues/12536)
|
||||
- 🐞 Fixed Anchor text edge cut problem. [#12520](https://github.com/ant-design/ant-design/issues/12520)
|
||||
- 🐞 Fixed that Drawer still cover page even set `mask={false}`. [#12401](https://github.com/ant-design/ant-design/issues/12401)
|
||||
- 🐞 Fixed disabled style missing of Input.TextArea when used as custom input in AutoComplete. [#12594](https://github.com/ant-design/ant-design/issues/12594)
|
||||
- 🐞 Fixed Modal.confirm `prefixCls` prop not passing to mask element, and changed it's default value to `ant-model-confirm`. [#12546](https://github.com/ant-design/ant-design/issues/12546)
|
||||
- 🐞 Fixed an align issue of Input.Group in safari. [#12493](https://github.com/ant-design/ant-design/issues/12493)
|
||||
- 🐞 Fixed an align issue of standalone `<Badge />`. [#12419](https://github.com/ant-design/ant-design/issues/12419)
|
||||
- 🐞 Fixed inconsistent arguments of `onExpand` when click Tree.DirectoryTree switch icon and tree node. [#12567](https://github.com/ant-design/ant-design/issues/12567)
|
||||
- 🐞 Fixed hasFeedback icon unexpected focused state in IE11. [#12524](https://github.com/ant-design/ant-design/pull/12524) [@siyu77](https://github.com/siyu77)
|
||||
- 🐞 Fixed multiple Select will trigger `onFocus` and `onBlur` repeatedly when click it multiple times. [#12281](https://github.com/ant-design/ant-design/issues/12281) [@Frezc ](https://github.com/Frezc)
|
||||
- 🐞 Fixed long text overflow issue of circle type Progress.
|
||||
- TypeScript
|
||||
- 🐞 Fixed Steps `labelPlacement` definition. [#12575](https://github.com/ant-design/ant-design/pull/12575) [@yueyes](https://github.com/yueyes)
|
||||
- 🐞 Fixed Select.Option `style` definition. [#12609](https://github.com/ant-design/ant-design/pull/12609) [@dimitropoulos](https://github.com/dimitropoulos)
|
||||
- 🐞 Fixed `form.validateFields` overload order problem. [#12538](https://github.com/ant-design/ant-design/pull/12538) [@TomIsion](https://github.com/TomIsion)
|
||||
- 🐞 Fixed AutoComponent `onFocus` `onBlur` definitions. [#12498](https://github.com/ant-design/ant-design/issues/12498)
|
||||
|
||||
## 3.10.0
|
||||
|
||||
`2018-09-30`
|
||||
|
||||
- 🌟 Upload adds `openFileDialogOnClick` prop to allow setting whether to open the upload dialog when the component is clicked. [#12347](https://github.com/ant-design/ant-design/pull/12347) [@hengkx](https://github.com/hengkx)
|
||||
- 🌟 InputNumber adds `decimalSeparator` prop to allow setting a custom decimal. [#12329](https://github.com/ant-design/ant-design/pull/12329) [@amedora](https://github.com/amedora)
|
||||
- 🌟 TreeSelect adds the `treeExpandedKeys` and `onTreeExpand` props to control the expansion of the tree. [#12145](https://github.com/ant-design/ant-design/issues/12145)
|
||||
- Transfer
|
||||
- 🌟 Adds `disabled` prop. [#12066](https://github.com/ant-design/ant-design/issues/12066)
|
||||
- Modal
|
||||
- 🌟 Adds `autoFocusButton` prop to allow specifying a button that automatically gets focus when Modal opens. [#11756](https://github.com/ant-design/ant-design/pull/11756) [@erwin-k](https://github.com/erwin-k)
|
||||
- 🌟 `confirm` added `okButtonProps` and `cancelButtonProps` prop to allow setting custom props on buttons. [#12425](https://github.com/ant-design/ant-design/pull/12425) [@Whoaa512](https://github.com/Whoaa512)
|
||||
- Table
|
||||
- 🌟 `column.title` accepts function now. [#11246](https://github.com/ant-design/ant-design/issues/11246)
|
||||
- 🌟 `onChange` adds a new parameter `extra` to allow you getting filtered data. [#12369](https://github.com/ant-design/ant-design/pull/12369)
|
||||
- 🌟 Improve the sort and filter UX, You can now sort by clicking on the entire header. [#12264](https://github.com/ant-design/ant-design/pull/12264)
|
||||
- 🌟 Alert adds `icon` prop to allow setting a custom icon. [Demo](https://ant.design/components/alert/#components-alert-demo-custom-icon)
|
||||
- 🌟 The following components add a `suffixIcon` prop, which is used to set the icon behind the input box. For details, please refer to the documentation.
|
||||
- Cascader
|
||||
- DatePicker
|
||||
- Select
|
||||
- TreeSelect
|
||||
- TimePicker
|
||||
- 🌟 Add some new less variables. [f237eff](https://github.com/ant-design/ant-design/commit/f237effc2a35eb249273f6f2826092a2f9b9db45)
|
||||
- 🐞 Fix Icon.createFromIconfontCN prepending `https` to the `scriptUrl`. [#12316](https://github.com/ant-design/ant-design/issues/12316)
|
||||
- 🐞 Fix the issue with the `gutter` props of Row that doesn't work when using nested Col. [#12320](https://github.com/ant-design/ant-design/pull/12320)
|
||||
- 🐞 Fix the issue where the Tree.DirectoryTree component could not properly expand the node when the 'expandedKeys` prop had initial values. [#12396](https://github.com/ant-design/ant-design/issues/12396)
|
||||
- 🐞 Fix the issue when the `render` prop of the Transfer component returns a ReactNode, the `title` property of the list item shows an unexpected value. [#12399](https://github.com/ant-design/ant-design/issues/12399)
|
||||
- 🐞 Fix Tooltip not working with CheckboxGroup. [#12427](https://github.com/ant-design/ant-design/issues/12427)
|
||||
- 🐞 Fix the issue that Button can still be clicked in IE9 under loading state. [#12466](https://github.com/ant-design/ant-design/pull/12466) [@snail](https://github.com/120216220)
|
||||
- 🐞 Fix the issue with mouse hover when using non-Input components in Input.Group. [#12407](https://github.com/ant-design/ant-design/pull/12407) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 Fix some TypeScript type definitions. [#12374](https://github.com/ant-design/ant-design/pull/12374) [#12370](https://github.com/ant-design/ant-design/pull/12370) [#12354](https://github.com/ant-design/ant-design/pull/12354/files) [#12473](https://github.com/ant-design/ant-design/pull/12473)
|
||||
|
||||
|
||||
## 3.9.3
|
||||
|
||||
`2018-09-22`
|
||||
|
||||
- 🐞 Fix `Select` render lag of long text in Chrome. [#11456](https://github.com/ant-design/ant-design/issues/11456) [#11843](https://github.com/ant-design/ant-design/issues/11843)
|
||||
- 🐞 Fix `onOpenChange` handler not being called in `RangePicker` for preset ranges. [#12142](https://github.com/ant-design/ant-design/pull/12142)[@leijingdao](https://github.com/leijingdao)
|
||||
- 🐞 Fix parameter `dontAnimate` to `goTo` of `Carousel`, the parameter be used to closing animation transitions. [#12205](https://github.com/ant-design/ant-design/pull/12205)
|
||||
- 🐞 Fix duplicated className for tabBar in `Tabs`. [589ba](https://github.com/ant-design/ant-design/commit/589bafd5db92a817c078ead6decdb81e64b2b5a8) [#12051](https://github.com/ant-design/ant-design/issues/12051)
|
||||
- 🐞 Fix the vertical alignment for the title of `Card`. [#11036](https://github.com/ant-design/ant-design/pull/11036) [#10576](https://github.com/ant-design/ant-design/issues/10576)
|
||||
- 🐞 Fix Item key unexpected change on `List` component. [#12299](https://github.com/ant-design/ant-design/pull/12299)[@douglasjunior](https://github.com/douglasjunior)
|
||||
- 🐞 Fix `confirmFilter` in `Table` does not refresh immediately. [954c7](https://github.com/ant-design/ant-design/commit/954c7ecd8ed384a3c67ec8dfb0e0deaa14bbf83b) [#12284](https://github.com/ant-design/ant-design/issues/12284)
|
||||
- Menu
|
||||
- 🐞 Fix extra scrollbar when popup `Menu` in `horizontal` mode. [#12152](https://github.com/ant-design/ant-design/issues/12152)
|
||||
- 🐞 Fix `openKeys` have higher priority in `Menu`. [#12361](https://github.com/ant-design/ant-design/pull/12361) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- Upload
|
||||
- 🐞 Fix `linkProps` in `Upload` fileList to support json string format and can override rel, target, title and etc. [efb23c](https://github.com/ant-design/ant-design/commit/efb23c1525858114460bfe3bd5fcb18c9f236bdc)
|
||||
- 🐞 Fix deduplication of the same key when uploading multiple files in `Upload`. [273fd](https://github.com/ant-design/ant-design/commit/273fd2ea1bca395d61509cc98c3ebbf1c620bf43)、[#10953](https://github.com/ant-design/ant-design/issues/10953)
|
||||
- Icon related
|
||||
- 🐞 Fix `Upload` close icon style error. [#12330](https://github.com/ant-design/ant-design/pull/12330) [#12304](https://github.com/ant-design/ant-design/issues/12304)
|
||||
- 🐞 Fix `Select` add select clear icon. [#12196](https://github.com/ant-design/ant-design/pull/12196) [#12181](https://github.com/ant-design/ant-design/issues/12181)
|
||||
- 🐞 Fix `Icon` svg align. [0698c](https://github.com/ant-design/ant-design/commit/0698c8217327224611d4be5fcfd149a355f1c08d)
|
||||
- 🐞 Fix `React.Children.only` error when `Icon` contain children. [c21ff](https://github.com/ant-design/ant-design/commit/c21ff5251d1ff0f00d7f283dd377a7b13eec21ee)
|
||||
- 🐞 Fix `Notification` icon align when no description. [e6579](https://github.com/ant-design/ant-design/commit/e657985cc35359fb813a2bd68be8c3afbe75c95a)
|
||||
- 🐞 Fix sorter icon align of `Table`. [c935d](https://github.com/ant-design/ant-design/commit/c935d53b713afb3ec314133d749ca4e29e0c1ee5)
|
||||
- TypeScript
|
||||
- 🐞 Fix `Message` miss return type of MessageApi. [e82d7](https://github.com/ant-design/ant-design/commit/e82d7a9c095317d62b054fcf7c2d6666ba54660d) [#12137](https://github.com/ant-design/ant-design/issues/12137)
|
||||
- 🐞 Fix `Tree` onDrop type. [e5827](https://github.com/ant-design/ant-design/commit/e58273dccf59d58862e8bab0da36c7065e1c1044) [#12269](https://github.com/ant-design/ant-design/issues/12269)
|
||||
- 🐞 Add `TreeSelect` missing argument `extra` in onChange event. [#12243](https://github.com/ant-design/ant-design/pull/12243)[@jardicc](https://github.com/jardicc)
|
||||
|
||||
## 3.9.2
|
||||
|
||||
`2018-09-08`
|
||||
|
||||
- 🐞 Title of children `Card` under `Card` using `tab-card` has wrong padding. [#12083](https://github.com/ant-design/ant-design/issues/12083)
|
||||
- 🐞 Fix `AutoComplete` using `TextArea` as input, height adjust by manual has time delay. [#12117](https://github.com/ant-design/ant-design/issues/12117)
|
||||
- 🐞 Fix `maskStyle` under `Drawer` not working. [#12125](https://github.com/ant-design/ant-design/pull/12125)[@ryerh](https://github.com/ryerh)
|
||||
- 🌟 `Popconfirm` can detect whether `onVisibleChange` is triggered by Ok or Cancel buttons. [#8614](https://github.com/ant-design/ant-design/issues/8614)
|
||||
- 🐞 Fix something table header in `Table` using fixed header and columns display unnecessary scrollbar. [#6515](https://github.com/ant-design/ant-design/issues/6515)
|
||||
- 🐞 Fix `Spin` using `delay` still render at first time. [#12131](https://github.com/ant-design/ant-design/issues/12131)
|
||||
- Icon related:
|
||||
- 🐞 Fix `Icon` in `popconfirm` has wrong position. [#12080](https://github.com/ant-design/ant-design/issues/12080)
|
||||
- 🐞 Add `Icon` missing icons. [#121218](https://github.com/ant-design/ant-design/issues/121218)
|
||||
- 🐞 Fix `Select` don't have checked icon. [#12054](https://github.com/ant-design/ant-design/issues/12054)
|
||||
- 🐞 Fix `TreeSelect` clear icon not same as previous versions. [#12124](https://github.com/ant-design/ant-design/issues/12124)
|
||||
|
||||
## 3.9.1
|
||||
|
||||
`2018-09-03`
|
||||
|
||||
- 🐞 Fixed the bug that `Tooltip` can not be triggered by `Icon`. [#12005](https://github.com/ant-design/ant-design/issues/12005)
|
||||
- 🐞 Fixed the bug that `InputNumber` shows wrong UP icon. [#12035](https://github.com/ant-design/ant-design/issues/12035)
|
||||
- 🐞 Fixed the bug that `Modal` shows no icon in error confirm. [#12026](https://github.com/ant-design/ant-design/issues/12026)
|
||||
- 🐞 Fixed the bug that the icon is misaligned in `Popconfirm`. [#12026](https://github.com/ant-design/ant-design/issues/12026)
|
||||
- 🐞 Fixed the but that the icons are misaligned in `Card`'s `Actions` panel. [#12016](https://github.com/ant-design/ant-design/pull/12016)
|
||||
- 🐞 Fixed that the icons in `Form`, `Alert`, `TimePicker` have wrong theme. [#12016](https://github.com/ant-design/ant-design/pull/12016)
|
||||
- 🐞 Fixed that the icons are set to have 90deg rotation in the `header` property in `Collapse`. [#12016](https://github.com/ant-design/ant-design/pull/12016)
|
||||
- 🐞 Fixed the issue that there are still old icons in some production environments. [#12016](https://github.com/ant-design/ant-design/pull/12016) [8b82f14](https://github.com/ant-design/ant-design/pull/12016/commits/8b82f143b6bd612e8ec7f1202dfd5f41127b025e)
|
||||
- 🐞 Fixed the bug that the new static method `Icon.createFromIconFontCN({...})` doesn't work and gives a warning. [#12013](https://github.com/ant-design/ant-design/pull/12013)
|
||||
|
||||
## 3.9.0
|
||||
|
||||
`2018-09-02`
|
||||
|
||||
In September we brought an update for `3.9.0`. There are many new features in `3.9.0`, Ant Design is getting stronger and solider.
|
||||
|
||||
- 🔥🔥🔥 In the `3.9.0` version, we redraw all the icons, adding two new categories, more than 90 new icons. And the bit adds a variety of styles to each icon. To this end, we have rewritten the Icon component, replaced the `fontface` icon with `SVG`, adding a number of features that allow us to quickly use new icons and styles.
|
||||
|
||||
- 💄 Replace the `css` font icon with the `SVG` icon, [see more discussion about it](https://github.com/ant-design/ant-design/issues/10353).
|
||||
- 💄 You can now render a two-color icon.
|
||||
- 💄 We provide three theme of icons: outlined, filled, twoTone, default theme is outlined.
|
||||
- 🌟 Two new categories, **Edit Icons** and **Data Icons**, have been added.
|
||||
- 🌟 Add the `theme` attribute to set the theme style of the icon. [#11971](https://github.com/ant-design/ant-design/pull/11971)
|
||||
- 🌟 Added `component` attribute, you can externally pass a component to customize the control rendering result. [#11322](https://github.com/ant-design/ant-design/pull/11322)
|
||||
- 🌟 The `twoToneColor` property is added to control the theme color of the two-color icon. [#11971](https://github.com/ant-design/ant-design/pull/11971)
|
||||
- 🌟 Added static methods `Icon.getTowToneColor()` and `Icon.setTwoToneColor(...)` to globally get and set the theme color of all two-color icons. [#11971](https://github.com/ant-design/ant-design/pull/11971)
|
||||
- 🌟 The new static method `Icon.createFromIconfontCN({...})` is added to make it easier to use icons hosted on [`iconfont.cn`](http://iconfont.cn/). For more usage, please refer to [Ant Design Pro - Introduction to Business Icons](https://pro.ant.design/docs/biz-icon). [#11322](https://github.com/ant-design/ant-design/pull/11322)
|
||||
- 🔥 Added a new component [Skeleton](https://ant.design/components/skeleton/).
|
||||
- 🔥 Menu will automatically close up to fit width in `horizontal` mode.
|
||||
- 🔥 The `placement` of the drawer supports `top` and `bottom` to accommodate more scenes.
|
||||
|
||||
In addition, our **Ant Design Pro 2.0.0** version has also been released simultaneously, please see [here](https://medium.com/ant-design/beautiful-and-powerful-ant-design-pro-2-0-release-51358da5af95) for details.
|
||||
|
||||
### Bugfix/Feature：
|
||||
|
||||
- 🌟 Added Modal.open for optional icon dialog. [#11982](https://github.com/ant-design/ant-design/pull/11982) [@hsiehjack](https://github.com/hsiehjack)
|
||||
- 🌟 Modal.info adds the configuration of `getContainer`. [#11377](https://github.com/ant-design/ant-design/issues/11377)
|
||||
- 🌟 Improve RangePicker footer UI by merging them.
|
||||
- 🌟 The Anchor component adds `onClick` property. [#11898](https://github.com/ant-design/ant-design/pull/11898)
|
||||
- 🌟 The Tab component adds the `renderTabBar` property. [#11856](https://github.com/ant-design/ant-design/pull/11856)
|
||||
- 🌟 The Input component adds the `select` method. [#11906](https://github.com/ant-design/ant-design/pull/11906)
|
||||
- 🌟 Steps adds the `initial` attribute. [#11180](https://github.com/ant-design/ant-design/issues/11180)
|
||||
- 🐞 Fixed Steps dot style broken.
|
||||
- 🐞 Fixed an issue where setting fontSize in the `headStyle` of the Card does not work. [#11995](https://github.com/ant-design/ant-design/issues/11995)
|
||||
- 🐞 Fixed an issue where the Button component wave animation was mix up. [#11985](https://github.com/ant-design/ant-design/issues/11985)
|
||||
- 🐞 Fixed an issue where the Modal.confirm setting `centered` attribute didn't work. [#11969](https://github.com/ant-design/ant-design/issues/11969)
|
||||
- 🐞 Fixed an issue where setting the `suffix` and `prefix` of the second Input in the `compact` mode of Input.Group would cause the right border to disappear. [#11965](https://github.com/ant-design/ant-design/pull/11965)
|
||||
- 🐞 Fixed an issue where Upload components might cause misplaced images when uploading many images. [#11183](https://github.com/ant-design/ant-design/issues/11183)
|
||||
- 🐞 Fixed MonthPicker `renderExtraFooter` not working. [#8184](https://github.com/ant-design/ant-design/issues/8184)
|
||||
|
||||
## 3.8.4
|
||||
|
||||
`2018-08-27`
|
||||
|
||||
- 🐞 Fixed an issue where the Tag component would cause a line break after deleting the tag.
|
||||
- 🐞 Fixed `Failed to execute 'removeChild' on 'Node'` error when click Switch.
|
||||
|
||||
## 3.8.3
|
||||
|
||||
`2018-08-26`
|
||||
|
||||
- 📖 Rewrite the documentation of [Customize Theme](https://ant.design/docs/react/customize-theme) and provider instruction for major `Less` variables. [6fd5e9](https://github.com/ant-design/ant-design/commit/6fd5e95cec2f1c936dcf857a72446ec956a5c7ad) [53dd82](https://github.com/ant-design/ant-design/commit/53dd82e4e3dd39d7ccc4f752901cb182b5b90555)
|
||||
- 🐞 Fix the zoom animation style for Badge. [#11870](https://github.com/ant-design/ant-design/issues/11870)
|
||||
- 🐞 Fix the abnormal width in IE and Edge for Cascader. [#11857](https://github.com/ant-design/ant-design/issues/11857)
|
||||
- 🐞 Fix the blurry style in Windows Chrome for Checkbox. [#11797](https://github.com/ant-design/ant-design/issues/11797)
|
||||
- 🐞 Fix that `style` prop is not effective for DatePicker.WeekPicker. [#11738](https://github.com/ant-design/ant-design/issues/11738)
|
||||
- 🐞 Fix the flash style for Drawer. [#11813](https://github.com/ant-design/ant-design/issues/11813)
|
||||
- 🐞 Fix the border style for compact Input.Group with `prefix` or `suffix`. [#11863](https://github.com/ant-design/ant-design/issues/11863)
|
||||
- Menu
|
||||
- 🐞 Fix the gap style between SubMenu and that Menu disappears when hovering over the tap. [#11725](https://github.com/ant-design/ant-design/issues/11725)
|
||||
- 🐞 Fix the displayed error when ItemGroup wraps the first SubMenu and the Menu is collapsed. [a52370](https://github.com/ant-design/ant-design/commit/a523706625bd695f44401579d980089292089dda) [@ohhoney1](https://github.com/ohhoney1)
|
||||
- 🐞 Fix that overlong `description` is cut off for Steps. [#11864](https://github.com/ant-design/ant-design/issues/11864)
|
||||
- 🐞 Fix that the word maybe break in overlong `title` for Tooltip. [#11722](https://github.com/ant-design/ant-design/issues/11722)
|
||||
- 🐞 Fix that `custom prop` of TreeNode cannot be accepted for Tree. [#11423](https://github.com/ant-design/ant-design/issues/11423)
|
||||
- 🐞 Fix the effective area for Upload.Dragger. [#11869](https://github.com/ant-design/ant-design/issues/11869)
|
||||
|
||||
## 3.8.2
|
||||
|
||||
`2018-8-18`
|
||||
|
||||
- 🐞 Fixed Tag still visible when initially setting `visible` prop to false. [#11757](https://github.com/ant-design/ant-design/issues/11757)
|
||||
- 🐞 Fixed Modal text got selected when opened by double click. [#11777](https://github.com/ant-design/ant-design/issues/11777)
|
||||
- 🐞 Fixed style of Rate component while getting clicked. [#11736](https://github.com/ant-design/ant-design/issues/11736)
|
||||
- 🐞 Fixed style of Badge component when its children is `display:block`. [#84119d8](https://github.com/ant-design/ant-design/commit/84119d8959d55edf535a9cac5ff532e61b6ee698)
|
||||
- Drawer
|
||||
- 🐞 Fixed Drawer not compatible with IE10 and IE9. [#11583](https://github.com/ant-design/ant-design/issues/11583)
|
||||
- 🐞 Fixed Drawer not being able to be scrolled vertically on mobile device. [#11443](https://github.com/ant-design/ant-design/issues/11443)
|
||||
- TypeScript
|
||||
- 🐞 Fixed `selectable` prop is missing in TreeNode props. [#11604](https://github.com/ant-design/ant-design/issues/11604) [@apieceofbart](https://github.com/apieceofbart)
|
||||
- 🐞 Fixed `autosize` prop is missing in Input props. [#11697](https://github.com/ant-design/ant-design/issues/11697)
|
||||
|
||||
|
||||
## 3.8.1
|
||||
|
||||
`2018-08-12`
|
||||
|
||||
- 🐞 Fixed TimePicker unexpected long width. [80f8267](https://github.com/ant-design/ant-design/commit/80f82674fb63b068d047651ccba772999139f1b7)
|
||||
- 🐞 Fixed Tabs that focusable element in inactive panel cause tabs disappear. [#11261](https://github.com/ant-design/ant-design/issues/11261)
|
||||
- 🐞 Fixed Badge `offset` x y axis order error. [#11648](https://github.com/ant-design/ant-design/pull/11648) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- Upload
|
||||
- 🐞 Fixed delete button missing in Upload. [#10454](https://github.com/ant-design/ant-design/issues/10454)
|
||||
- 🐞 Fixed Upload thumbnail which url has no extension. [#11684](https://github.com/ant-design/ant-design/pull/11684) [@elantion](https://github.com/elantion)
|
||||
- 🐞 Fixed Anchor with `affix=true` doesn't work inside inner scrollable. [#11688](https://github.com/ant-design/ant-design/pull/11688) [@vitaliymaz](https://github.com/vitaliymaz)
|
||||
- 🐞 Fixed card width in List.Grid. [!11712](https://github.com/ant-design/ant-design/issues/11712)
|
||||
- 🐞 Fixed Radio align problem in safari. [754a22c](https://github.com/ant-design/ant-design/commit/754a22ca24dee685666554778f53a5fe700959ff)
|
||||
- 💄 Apply wave click animation to components Switch, Radio.Button and Tag. [9cf6ae6](https://github.com/ant-design/ant-design/commit/9cf6ae601010acbf665d575d34c0cc0918e604e7)
|
||||
- TypeScript
|
||||
- 🐞 Fixed missing prop signature `destroyInactivePanel` of Collapse. [#11646](https://github.com/ant-design/ant-design/pull/11646) [@zheeeng](https://github.com/zheeeng)
|
||||
- 🐞 Fixed missing prop `getPopupContainer` signature of AutoComplete. [#11690](https://github.com/ant-design/ant-design/pull/11690) [@Huanghuiying0624](https://github.com/Huanghuiying0624)
|
||||
- 🐞 Fixed Upload `lastModifiedDate` signature. [#11709](https://github.com/ant-design/ant-design/pull/11709) [@andycall](https://github.com/andycall)
|
||||
- 💄 Migrate to new lifecycle methods, include components TimePicker, Upload, CheckboxGroup, Layout.Sider, Tooltip, Popconfirm. [#11666](https://github.com/ant-design/ant-design/pull/11666) [@dancerphil](https://github.com/dancerphil) [#11682](https://github.com/ant-design/ant-design/pull/11682) [@dancerphil](https://github.com/dancerphil)
|
||||
|
||||
## 3.8.0
|
||||
|
||||
`2018-08-05`
|
||||
|
||||
Thanks to 24 contributors who send pull request to 3.8.0!
|
||||
|
||||
- 💄 Support TypeScript 3 and improve lots of definitions.
|
||||
- 💄 Use [tabular-nums font variant](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric) instead of monospaced numeric font family Tahoma. [#11567](https://github.com/ant-design/ant-design/pull/11567) [@tibdex](https://github.com/tibdex)
|
||||
- 🌟 Timeline support `mode="left|right|alternate"` now. [#11490](https://github.com/ant-design/ant-design/pull/11490) [@jrvboesch](https://github.com/jrvboesch)
|
||||
- 🌟 Button added `block` prop which allow to fit parent container. [#11500](https://github.com/ant-design/ant-design/pull/11500) [@ilanus](https://github.com/ilanus)
|
||||
- Tree
|
||||
- 💄 Better accessibility support.
|
||||
- 🐞 Fixed that some tree nodes disappear after dragged. [#11492](https://github.com/ant-design/ant-design/issues/11492)
|
||||
- 🐞 Fixed a vertical align style issue of draggable tree. [#11458](https://github.com/ant-design/ant-design/issues/11458)
|
||||
- Table
|
||||
- 🌟 Added `rowSelection.columnTitle` to customize selection column title. [#11042](https://github.com/ant-design/ant-design/issues/11042) [@littleLane](https://github.com/littleLane)
|
||||
- 💄 Added demo of [resizable columns](/components/table/#components-table-demo-resizable-column)。
|
||||
- 💄 Support to select multiple rows when pressing `shift`. [#11404](https://github.com/ant-design/ant-design/issues/11404) [@RaphaelChauveau](https://github.com/RaphaelChauveau)
|
||||
- Avatar
|
||||
- 🌟 Added `onError` prop that is callback when image loading fail. [#11285](https://github.com/ant-design/ant-design/pull/11285/) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- 🌟 Added `size` prop for customize size of Avatar. [#11256](https://github.com/ant-design/ant-design/issues/11256) [@emersonlaurentino](https://github.com/emersonlaurentino)
|
||||
- 🌟 Card added `headStyle` prop. [#11407](https://github.com/ant-design/ant-design/pull/11407) [@emersonlaurentino](https://github.com/emersonlaurentino)
|
||||
- 🐞 Fixed that Tooltip not working with DatePicker. [#11451](https://github.com/ant-design/ant-design/issues/11451) [@yociduo](https://github.com/yociduo)
|
||||
- 🐞 Fixed that Tooltip not working with Input.Group. [#11532](https://github.com/ant-design/ant-design/issues/11532) [@yociduo](https://github.com/yociduo)
|
||||
- 🐞 Fixed that DatePicker time panel text jumping when hovering. [#11460](https://github.com/ant-design/ant-design/issues/11460)
|
||||
- 🐞 Fixed Tabs display issue when switch focus elements between panels. [#11261](https://github.com/ant-design/ant-design/issues/11261)
|
||||
- Select
|
||||
- 💄 Support `data-*` attributes.
|
||||
- 🐞 Fixed that selected item don't display correct position in dropdown menu items. [#11268](https://github.com/ant-design/ant-design/issues/11268)
|
||||
- 🌟 Calendar added `onChange` prop. [#11476](https://github.com/ant-design/ant-design/pull/11476) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- 🌟 Popconfirm added `icon` prop. [#11191](https://github.com/ant-design/ant-design/pull/11191) [@nuintun](https://github.com/nuintun)
|
||||
- Modal
|
||||
- 🌟 Added `centered` prop to set vertical center position of modal. [#11537](https://github.com/ant-design/ant-design/pull/11537) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 Fixed that closing all modals when pressing `ESC` once, now they will be closed one by one. [#11394](https://github.com/ant-design/ant-design/issues/11394) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 Fixed issue resulting title of Modal.confirm shows scrollbar again. [#11568](https://github.com/ant-design/ant-design/pull/11568) [@cheshireoctopus](https://github.com/cheshireoctopus)
|
||||
- 🌟 Progress added `strokeLinecap` to customize shape of edge. [#11547](https://github.com/ant-design/ant-design/pull/11547) [@blatinier](https://github.com/blatinier)
|
||||
- 🌟 Drawer added `className` and deprecated `wrapClassName`. [#11609](https://github.com/ant-design/ant-design/pull/11609) [@fergiar](https://github.com/fergiar)
|
||||
|
||||
## 3.7.3
|
||||
|
||||
`2018-07-28`
|
||||
|
||||
- 🐞 Fix issue resulting in title not vertical align with icon when setting `labelPlacement` to `vertical` in Steps. [#11426](https://github.com/ant-design/ant-design/pull/11426) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 Fix issue resulting in the children field specified in `fieldName` could not be read correctly in Cascader. [#11311](https://github.com/ant-design/ant-design/pull/11311) [@405go](https://github.com/405go)
|
||||
- TypeScript
|
||||
- 🐞 Fix type definition of Pagination. [#11474](https://github.com/ant-design/ant-design/pull/11474) [@kagd](https://github.com/kagd)
|
||||
- 🐞 Fix type definition of Select. [#11189](https://github.com/ant-design/ant-design/pull/11189<Paste>) [@thisJJ](https://github.com/thisJJ)
|
||||
|
||||
## 3.7.2
|
||||
|
||||
`2018-07-25`
|
||||
|
||||
- DatePicker
|
||||
- 🐞 **Fix issue resulting in year and month can not be changed in control mode.** [b9992f4](https://github.com/ant-design/ant-design/commit/b9992f4a08574efb47b6e6cd80eb1e888b9a1ede)
|
||||
- 🐞 Fix warning of `getDerivedStateFromProp`. [#11398](https://github.com/ant-design/ant-design/pull/11398) [@yoyo837](https://github.com/yoyo837)
|
||||
- Drawer
|
||||
- 🐞 Fix close animation when setting `destroyOnClose`. [#11307](https://github.com/ant-design/ant-design/issues/11307)
|
||||
- 🐞 Fix display issue when using a `vw` value as `width`. [#11326](https://github.com/ant-design/ant-design/issues/11326)
|
||||
- 🐞 Fix `wrapClassName` now working.
|
||||
- 🐞 Fix text overflow of Tooltip. [#11402](https://github.com/ant-design/ant-design/pull/11402) [@weidapao](https://github.com/weidapao)
|
||||
- 🐞 Fix style issue of dark theme Menu in Layout.Header. [#11400](https://github.com/ant-design/ant-design/pull/11400) [@hongxuWei](https://github.com/hongxuWei)
|
||||
- 🐞 Fix the arrow buttons of InputNumber showing wrong position in a fixed table. [#11408](https://github.com/ant-design/ant-design/issues/11408)
|
||||
- 🐞 Fix issue resulting in Select.Option shows wrong border radius in Select.OptGroup. [6cb6f5c](https://github.com/ant-design/ant-design/commit/6cb6f5c83ed634e67d5b5d0816d11aa0788a74d8)
|
||||
- 🐞 Fix issue resulting in `onChange` was trigged twice when click the filter icon of Table. [#11164](https://github.com/ant-design/ant-design/issues/11164) [@adybionka](https://github.com/adybionka)
|
||||
- 🐞 Fix issue resulting title of Modal.confirm shows scrollbar on Firefox. [#11432](https://github.com/ant-design/ant-design/issues/11432)
|
||||
- TypeScript
|
||||
- 🐞 Fix type definition of Radio.Group. [#11409](https://github.com/ant-design/ant-design/pull/11409) [@eddiemoore](https://github.com/eddiemoore)
|
||||
- 🐞 Fix type definition of TreeSelect. [#11442](https://github.com/ant-design/ant-design/pull/11442) [@JribiBelhassen](https://github.com/JribiBelhassen)
|
||||
- 🐞 Fix type definition of Badge. [#11421](https://github.com/ant-design/ant-design/pull/11421) [@zongzi531](https://github.com/zongzi531)
|
||||
|
||||
## 3.7.1
|
||||
|
||||
`2018-07-21`
|
||||
|
||||
- 🐞 Fix popup content can't display in Drawer component.[#11304](https://github.com/ant-design/ant-design/issues/11304)
|
||||
- 🐞 Card using `tabList` support `disabled` prop.[#11212](https://github.com/ant-design/ant-design/issues/11212)
|
||||
- 🐞 Fix Link of Anchor not sync when `href` update.[#11287](https://github.com/ant-design/ant-design/pull/11287/files) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- 🐞 Fix Menu component style.[#11299](https://github.com/ant-design/ant-design/issues/11299)
|
||||
- 🐞 Fix Drawer component don't have animation when `destroyOnClose` is set.[#11307](https://github.com/ant-design/ant-design/issues/11307)
|
||||
- 🐞 Fix DirectoryTree can't expand when `expandedKeys` is in control.[#11366](https://github.com/ant-design/ant-design/issues/11366)
|
||||
- 🐞 Fix Button with Tooltip under ButtonGroup style issue when Button is `disabled`.[11321](https://github.com/ant-design/ant-design/pull/11321) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
|
||||
## 3.7.0
|
||||
|
||||
3.7.0 is a heavy update that brings a lot of exciting changes and new features.
|
||||
Here are some highlights ✨:
|
||||
|
||||
- 🌟 Add drawer component : [Drawer](https://ant.design/components/drawer-cn/). [#10791](https://github.com/ant-design/ant-design/pull/10791)
|
||||
- 🌟 Add `Tree.DirectoryTree` component as the built-in directory tree. [#7749](https://github.com/ant-design/ant-design/issues/7749)
|
||||
|
||||
Component Fixes / Enhancements:
|
||||
|
||||
- Upgrade `rc-tree-select` to `2.0.5` for TreeSelect, refactored to fix the logic of the check.
|
||||
- 🌟 Add `autoClearSearchValue` prop to clear the value of search input when multiple select is selected or deselected. [10996](https://github.com/ant-design/ant-design/issues/10996)
|
||||
- 🌟 Add `searchValue` prop to set the value of search input. [6ff7dd8](https://github.com/ant-design/ant-design/commit/6ff7dd8fb953f079ee51ee638aaf4d832d0e10bf#diff-1e8e47abbdbe6e12d009aa61619ab22f)
|
||||
- 🌟 Add `maxTagCount` prop to set the max count of visible tags. [fb96c9d](https://github.com/ant-design/ant-design/commit/fb96c9db351e44a202f64f780470c6319a8a9626)
|
||||
- 🌟 Add `maxTagPlaceholder` prop to set the content when the tag is hidden. [fb96c9d](https://github.com/ant-design/ant-design/commit/fb96c9db351e44a202f64f780470c6319a8a9626)
|
||||
- 🌟 Search input now supports case sensitive search. [#10990](https://github.com/ant-design/ant-design/issues/10990)
|
||||
- 🗑 Remove `label` prop and use `title` prop instead in the `treeData`.
|
||||
- Upgrade `rc-upload` to `2.5.0` for Upload.
|
||||
- 🌟 Add `directory` prop to support folder uploading. [#7315](https://github.com/ant-design/ant-design/issues/7315)
|
||||
- 🌟 `action` prop supports to be the a function which returns a Promise object. [fd96967](https://github.com/ant-design/ant-design/commit/fd96967c872600b79bb608e9ddf9f8c38814a704)
|
||||
- Dropdown
|
||||
- 🌟 Provide default margin for icon in the menu item. [8e60a59](https://github.com/ant-design/ant-design/commit/8e60a591fd24f644de4f67d69c2210e9270be9cc)
|
||||
- 🌟 Be able to adjust the menu position for the trigger mode of `contextMenu` automatically. [16e4260](https://github.com/ant-design/ant-design/commit/16e42601d6772fc0830ee237a1e751a38a118676)
|
||||
- Upgrade `rc-table` to `6.2.2` for Table. [f2fddff](https://github.com/ant-design/ant-design/commit/f2fddff3fd0d6b36e8e6d8ee06bfcbcc85ead4f0)
|
||||
- 🌟 Add `expanded` as the fourth param of `expandedRowRender` prop to get the expanded state of current row. [#10379](https://github.com/ant-design/ant-design/issues/10379)
|
||||
- 🌟 Add the ability to override the filter menu without the fully controlled component. [59cc3a8](https://github.com/ant-design/ant-design/commit/59cc3a8b6c643f7206feedf2dc2c7154296ba3e3) [@chrvadala](https://github.com/chrvadala)
|
||||
- 🌟 `filterIcon` prop supports to be a render function which returns ReactNode. [1af4392](https://github.com/ant-design/ant-design/commit/1af4392ae9fbdaa6fcfbf2f0de5413100ef4a84a)
|
||||
- 🐞 Fix the row dislocation problem when the column is fixed. [#10392](https://github.com/ant-design/ant-design/issues/10392)
|
||||
- 🌟 Allow to pass `data-*`, `aria-*` and `role-*` props to the inner for Alert. [f0b684d](https://github.com/ant-design/ant-design/commit/f0b684de6a7c422f0de56e1ef72aeb35ab25a858)
|
||||
- 🌟 Add `alt` prop for Avatar to set the text when the image is unable to display. [#10798](https://github.com/ant-design/ant-design/pull/10798)
|
||||
- 🌟 Allow to pass `data-*`, `aria-*` and `role-*` props to the inner Input for DatePicker. [e63f9d4](https://github.com/ant-design/ant-design/commit/e63f9d4beb440de92c0b0ce8e6e83f7e24fef792)
|
||||
- 🌟 Add `event` object as the second param of `onSearch` prop for Input.Search. [#11015](https://github.com/ant-design/ant-design/issues/11015)
|
||||
- 🌟 Add `onBreakPoint` prop for Layout.Sider to be the callback function when breakpoint is triggered. [#10750](https://github.com/ant-design/ant-design/pull/10750) [@nuintun](https://github.com/nuintun)
|
||||
- 🌟 Add `okButtonProps` prop to set the props of ok button and add `cancelButtonProps` prop to set the props of cancel button for Modal. [#10955](https://github.com/ant-design/ant-design/pull/10955) [@djyde](https://github.com/djyde)
|
||||
- 🌟 Add `strokeColor` prop to set the color of progress bar for Progress. [#10725](https://github.com/ant-design/ant-design/issues/10725)
|
||||
- 🌟 Add `buttonStyle` prop whose optional value is `outline` or `solid` to set the Radio.Group style. [60e3cfa](https://github.com/ant-design/ant-design/commit/60e3cfa37ac0dae3a895e74c1fe5351c54536a07#diff-c2ee8b5a368a121e9d2cc2661212045d)
|
||||
- 🌟 Add `setDefaultIndicator` static function to set global indicator for Spin. [#10787](https://github.com/ant-design/ant-design/issues/10787)
|
||||
- 🌟 Add `visible` prop to set the visibility for `Tag`. [4ac0277](https://github.com/ant-design/ant-design/commit/4ac027781372dda08a5458bc73836fbc14dfe51f)
|
||||
- Upgrade `rc-tree` to `1.12.0` for Tree
|
||||
- 🌟 Add `loadedKeys` prop to set the loaded nodes, which usually works with loadData prop. [#10666](https://github.com/ant-design/ant-design/issues/10666)
|
||||
- 🌟 Add `onLoad` prop to be the callback function when all the nodes are loaded. [c488aca](https://github.com/ant-design/ant-design/commit/c488aca05e11d942d77c1b6bff45d12bbb1a2bd6)
|
||||
- 🗑 Deprecate `combobox` value for `Select[mode]` and please replace it with `AutoComplete`. [53046a4](https://github.com/ant-design/ant-design/commit/53046a454ad83ca03dc313e63f56474ed1173002)
|
||||
- 🐞 Cascader adds `fieldNames` and discards the misspelled `filedNames`. [#10896](https://github.com/ant-design/ant-design/issues/10896)
|
||||
- 🐞 Fix Timeline dot not working with Tooltip. [0e3b67e](https://github.com/ant-design/ant-design/commit/0e3b67e9999d867cc304f3be61a8a042a2ab92ee)
|
||||
- 🐞 Fix border radius when avatar has custom size. [e1e6523](https://github.com/ant-design/ant-design/commit/e1e6523452286ba56f20b73abad762a58ea7d7bc)
|
||||
- 🌟 Add `okButtonDisabled` and `cancelButtonDisabled` props to disable ok button and cancel button. [#10955](https://github.com/ant-design/ant-design/pull/10955)
|
||||
|
||||
|
||||
## 3.6.6
|
||||
|
||||
`2018-07-07`
|
||||
|
||||
- 🐞 Fix the style of the selected day for `DatePicker`. [#6146](https://github.com/ant-design/ant-design/issues/6146) [#9529](https://github.com/ant-design/ant-design/issues/9529)
|
||||
- 🐞 Fix the style of the selected day for `DatePicker.RangePicker`. [004561b](https://github.com/ant-design/ant-design/commit/004561ba1f3b894dc164225e9e27b0a90679d15c)
|
||||
- 🐞 Fix the alignment style wrapped by `Form.Item` for `Cascader`. [#9827](https://github.com/ant-design/ant-design/issues/9827) [#11133](https://github.com/ant-design/ant-design/issues/11133)
|
||||
- 🐞 Fix the background style of the `handler` for `InputNumber`. [4aabc53](https://github.com/ant-design/ant-design/commit/4aabc5374497359e13a958ef81ae4569db6164a7)
|
||||
- 🐞 Fix the header overflow in `FireFox` when the data is empty for `Table`. [#11135](https://github.com/ant-design/ant-design/issues/11135)
|
||||
|
||||
## 3.6.5
|
||||
|
||||
`2018-07-02`
|
||||
|
||||
- 🐞 Fixed wired `Transfer` repaint problem in IE or Edge. [#9697](https://github.com/ant-design/ant-design/issues/9697)
|
||||
- 🐞 Fixed `Card` background overflow when zoom in chrome. [#9085](https://github.com/ant-design/ant-design/issues/9085)
|
||||
- TypeScript
|
||||
- 🐞 Fixed `Table` incompatible type `size`. [bf5b6ae1](https://github.com/ant-design/ant-design/commit/bf5b6ae1f3b5da4629a7d10a2d1764eaa3fbbb04)
|
||||
- 🐞 Fixed `Select` missing showArrow option in types. [cde2a6b6](https://github.com/ant-design/ant-design/commit/cde2a6b6f011a5b3a367b3f58731def547bc98d8)
|
||||
- 🐞 Add custom local support in `Pagination`. [babbbdd4](https://github.com/ant-design/ant-design/commit/babbbdd4e5c33ca050f8ee08969185c8d3269b4c)
|
||||
- 🐞 Move max-width to ant-tooltip, so that it can be override by overlayStyle.maxWidth. [e2b359e9](https://github.com/ant-design/ant-design/commit/e2b359e9c3dae067eeba37a886f7896474c87e31)
|
||||
- 🐞 Adjust `Select` mirror style to avoid to long string. [#11035](https://github.com/ant-design/ant-design/issues/11035)
|
||||
|
||||
## 3.6.4
|
||||
|
||||
`2018-06-23`
|
||||
|
||||
- 🐞 Fixed `Steps` theme `@process-icon-color`. [#10973](https://github.com/ant-design/ant-design/issues/10973)
|
||||
- 🐞 Fixed style of RangePicker with preset ranges. [#10986](https://github.com/ant-design/ant-design/issues/10986)
|
||||
- 🐞 Fixed `Dropdown` non-boolean attribute warning. [#7798](https://github.com/ant-design/ant-design/issues/7798)
|
||||
- TypeScript
|
||||
- 🌟 Add `Tree` prop `className` definition. [#10950](https://github.com/ant-design/ant-design/issues/10950)
|
||||
- 🌟 Add `Tree` prop `selectable` definition. [3fb478e](https://github.com/ant-design/ant-design/commit/3fb478e743f3bad23dc300f501df11e5423468ba)
|
||||
|
||||
## 3.6.3
|
||||
|
||||
`2018-06-17`
|
||||
|
||||
- 🐞 Fixed that capitalized extension of Upload image url couldn't be recognized. [#10928](https://github.com/ant-design/ant-design/pull/10928) [@sliwey](https://github.com/sliwey)
|
||||
- 🐞 Fixed missing border of InputNumber when browser is zoomed in. [#10562](https://github.com/ant-design/ant-design/issues/10562)
|
||||
- 🐞 Fixed that fixed element inside Spin cannot be fixed. [#10196](https://github.com/ant-design/ant-design/issues/10196)
|
||||
- 🐞 Fixed broken border style of small table. [#9754](https://github.com/ant-design/ant-design/issues/9754)
|
||||
- 🐞 Fixed missing `className` prop of Table's `filterIcon`. [#10937](https://github.com/ant-design/ant-design/issues/10937)
|
||||
- 🐞 Fixed that Affix `offsetTop` and `offsetBottom` cannot be updated. [#10874](https://github.com/ant-design/ant-design/issues/10874)
|
||||
- TypeScript
|
||||
- 🐞 Fixed TreeSelect `TS2339` error. [#10868](https://github.com/ant-design/ant-design/issues/10868)
|
||||
- 🌟 Added Form arguments definitions of `validateMessages` and `onFieldsChange`.
|
||||
- 🌟 Improved Button prop definitions. [#10877](https://github.com/ant-design/ant-design/pull/10877) [@zheeeng](https://github.com/zheeeng)
|
||||
- 🌟 Added `backfill` prop for AutoComplete. [#10909](https://github.com/ant-design/ant-design/pull/10909) [@zhanba](https://github.com/zhanba)
|
||||
|
||||
## 3.6.2
|
||||
|
||||
`2018-06-09`
|
||||
|
||||
- 🐞 Fix the wrong status of check all checkbox in Table when data change. [#10629](https://github.com/ant-design/ant-design/issues/10629)
|
||||
- 🐞 Fix border style of Button.Group.
|
||||
- 🐞 Fix file list being reversed when `beforeUpload` returns `false` in Upload component. [#10681](https://github.com/ant-design/ant-design/issues/10681)
|
||||
- 🐞 Fix overflow of cell content in Calendar. [#10808](https://github.com/ant-design/ant-design/pull/10808) [@Yangzhedi](https://github.com/ant-design/Yangzhedi)
|
||||
- 🐞 Fix the processing color of Badge not follows the `primary-color`.
|
||||
- Spin
|
||||
- 🐞 Fix custom icon does not follow the value of `size`. [#10786](https://github.com/ant-design/ant-design/issues/10786)
|
||||
- 🐞 Fix no `delay` issue when sets `spinning` to `true` as default.[#10727](https://github.com/ant-design/ant-design/pull/10727) [@dreamerblue](https://github.com/dreamerblue)
|
||||
- TypeScript
|
||||
- 🐞 Fix Menu type definition. [#10773](https://github.com/ant-design/ant-design/issues/10773)
|
||||
- 🐞 Fix AutoComplete type definition. [#10745](https://github.com/ant-design/ant-design/issues/10745) [#10619](https://github.com/ant-design/ant-design/issues/10619)
|
||||
- 🐞 Fix Tree type definition. [#10841](https://github.com/ant-design/ant-design/pull/10841) [@Voronar](https://github.com/Voronar)
|
||||
- 🐞 Fix Checkbox.Group definition. [#10677](https://github.com/ant-design/ant-design/pull/10677)
|
||||
|
||||
## 3.6.0
|
||||
|
||||
`2018-06-02`
|
||||
|
||||
* 🌟 `Form`'s error message now can be customized with ReactNode. [#10136](https://github.com/ant-design/ant-design/issues/10136) [@lovekonakona](https://github.com/lovekonakona)
|
||||
* 🌟 `List` support customized configuration for position of pagination. [#10581](https://github.com/ant-design/ant-design/pull/10581) [@zheeeng](https://github.com/zheeeng)
|
||||
* 🌟 `Layout.Sider` now can be configured with `light` or `dark` theme. [#10142](https://github.com/ant-design/ant-design/issues/10142) [@pd4d10](https://github.com/pd4d10)
|
||||
* 🌟 Ant Design official site now supports offline mode. [#10625](https://github.com/ant-design/ant-design/issues/10625)
|
||||
* 🌟 `Transfer` adding `style` and `operationStyle` props for further customization. [@eduludi](https://github.com/eduludi)
|
||||
* 🌟 `Message` adds a promisfied interface to handle callback. [#10421](https://github.com/ant-design/ant-design/issues/10421) [@zhujinxuan](https://github.com/zhujinxuan)
|
||||
* 🐞 Fix compilation issue with typescript@v2.9.1 . [#10729](https://github.com/ant-design/ant-design/issues/10729) [@karol-majewski](https://github.com/karol-majewski)
|
||||
* 🐞 Fix a bug in `Menu` where outer menu item not highlighting while inner item is selected. [#8666](https://github.com/ant-design/ant-design/issues/8666) [@stonehank](https://github.com/stonehank)
|
||||
* 🐞 Affix `offsetBottom` not working. [#10674](https://github.com/ant-design/ant-design/issues/10674)
|
||||
|
||||
## 3.5.4
|
||||
|
||||
`2018-05-26`
|
||||
|
||||
- 🐞 Fix `showSearch` on `Cascader` not working.[968488a2](https://github.com/ant-design/ant-design/commit/968488a2fac9bcb16bee9f0c248f49bca00dbec6)
|
||||
- 🐞 `Badge[status]` support `Tooltip`.[#10626](https://github.com/ant-design/ant-design/issues/10626)
|
||||
- 🐞 Fix `text-align` on parent element affects `Spin`.[#10643](https://github.com/ant-design/ant-design/pull/10643) [@wmzhong](https://github.com/wmzhong)
|
||||
- 💄 `Table` break line style change from `break-all` to `break-word`.[#10655](https://github.com/ant-design/ant-design/pull/10655) [@clinyong](https://github.com/clinyong)
|
||||
- 🌟 When `Search` not define `enterButton`, click search icon will trigger `onSearch`. [36ffe7e1](https://github.com/ant-design/ant-design/commit/36ffe7e1dc9d9473c8c68168ab79b7a03a604702)
|
||||
|
||||
## 3.5.3
|
||||
|
||||
`2018-05-20`
|
||||
|
||||
- 🐞 Fix `Affix` with offsetTop === 0, value becomes `undefined` problem [#10566](https://github.com/ant-design/ant-design/pull/10566)
|
||||
- 🐞 Fixed issue with shaded `Input.Group` component shadows[#10230](https://github.com/ant-design/ant-design/issues/10230)
|
||||
- 🐞 Fixed issue where the `Transfer` component checkbox event fired twice [#10480](https://github.com/ant-design/ant-design/issues/10480)
|
||||
- 💄 Unifying the name of the variable [12d3046](https://github.com/ant-design/ant-design/commit/12d3046687a0dcdb51fece08dd2bea64f185cc40)
|
||||
- 💄 Fine-tuned the style of `Dropdown` [8e2f72f](https://github.com/ant-design/ant-design/commit/8e2f72ffe0eb300f5997296726b02246bf990c8f)
|
||||
- 💄 The components of the Chinese document will now be demonstrated using Chinese language packages. [9b17a94](https://github.com/ant-design/ant-design/commit/9b17a943f5d57d40d65041b7b0c247add09d2851)
|
||||
- 💄 The main theme switch was changed to `antd-theme-generato`, thanks to the work of [@mzohaibqc](https://github.com/mzohaibqc).
|
||||
- TypeScript
|
||||
- 🐞 Fixed an issue with the type of gutter attribute in `Row` [b7d508e](https://github.com/ant-design/ant-design/commit/b7d508e1662bf20a0cacbe6440a2ce31a65a8a59)
|
||||
- 💄 Improved the `Form` component type [#10564](https://github.com/ant-design/ant-design/pull/10564)
|
||||
- 💄 Improved the `Button` and `Tag` types[1ed9fed](https://github.com/ant-design/ant-design/commit/1ed9fed2cf1c99b947359fafb101b2e58213cb48)
|
||||
|
||||
## 3.5.2
|
||||
|
||||
`2018-05-13`
|
||||
|
||||
- 🐞 Fixed `Table` filter doesn't work when click checkbox. [#10452](https://github.com/ant-design/ant-design/issues/10452)
|
||||
- 🐞 Fixed `Cascader` displayRender z-index issue. [#10433](https://github.com/ant-design/ant-design/issues/10433)
|
||||
- 🐞 Fixed `Button` Types of property 'ref' are incompatible. [#10405](https://github.com/ant-design/ant-design/issues/10405)
|
||||
- 🐞 Fixed the height of `Form` item when checks position is dithered. [#10445](https://github.com/ant-design/ant-design/issues/10445)
|
||||
- 🌟 Allow to use any CSS units for `Layout` width. [#10479](https://github.com/ant-design/ant-design/pull/10479)
|
||||
|
||||
## 3.5.1
|
||||
|
||||
`2018-05-09`
|
||||
|
||||
- 🐞 Fixed broken style of Input.Group under Form. [#10371](https://github.com/ant-design/ant-design/issues/10371)
|
||||
- 🐞 Fixed overlay style of Select. [#10383](https://github.com/ant-design/ant-design/issues/10383)
|
||||
- 🐞 Remove focused style of Collapse.
|
||||
- 🐞 Remove unnecessary `z-index` of Input.Group and Checkbox. [#9840](https://github.com/ant-design/ant-design/issues/9840) [#10385](https://github.com/ant-design/ant-design/issues/10385)
|
||||
- 🐞 Fixed that monospaced font family can't be bold.
|
||||
- Table
|
||||
- 💄 Rewrote the editable table demo. [#10119](https://github.com/ant-design/ant-design/pull/10119)
|
||||
- 🐞 Fixed that table column overlay each other. [#9822](https://github.com/ant-design/ant-design/issues/9822)
|
||||
- TypeScript
|
||||
- 🐞 Fixed Breadcrumb.Item type. [#10372](https://github.com/ant-design/ant-design/pull/10372) [@karol-majewski](https://github.com/karol-majewski)
|
||||
- 🐞 Fixed Table `rowSelection` type。[#10374](https://github.com/ant-design/ant-design/issues/10374)
|
||||
|
||||
## 3.5.0
|
||||
|
||||
`2018-05-04`
|
||||
|
||||
- 🌟 Add `title` prop to `Badge` that shows when hovering it. [74d81c2](https://github.com/ant-design/ant-design/commit/74d81c2d078a3c84b3e44cbfbdd99b8f479ea71d) [@ludwigbacklund](https://github.com/ludwigbacklund)
|
||||
- 🌟 Add `successPercent` as `Progress[format]` argument. [#10096](https://github.com/ant-design/ant-design/issues/10096)
|
||||
- 🌟 Update `rc-notification` to 3.1.0 so that `Notification` support set `maxCount`. [#10161](https://github.com/ant-design/ant-design/pull/10161) [@jzhangs](https://github.com/jzhangs)
|
||||
- 🌟 Update `rc-cascader` to 1.13.0 so that `Cascader` support set `filedNames`. [react-component/cascader#23](https://github.com/react-component/cascader/pull/23) [@405go](https://github.com/405go)
|
||||
- 🌟 Add ability to update `Notification` props by key. [react-component/notification#40](https://github.com/react-component/notification/pull/40) [@yevhen-hryhorevskyi](https://github.com/yevhen-hryhorevskyi)
|
||||
- 🌟 `List` support pagination by default. [#10135](https://github.com/ant-design/ant-design/pull/10135)
|
||||
- Table
|
||||
- 🌟 Column `sorter` function is passed `sortOrder` as param. [#10306](https://github.com/ant-design/ant-design/pull/10306) [@kumarashwin](https://github.com/kumarashwin)
|
||||
- 🐞 Fix merged header cell border. [#10359](https://github.com/ant-design/ant-design/issues/10359)
|
||||
- 🐞 Fix lost of user selection on data updates. [#10332](https://github.com/ant-design/ant-design/pull/10332) [@chrvadala](https://github.com/chrvadala)
|
||||
- Menu upgrade `rc-menu` to `7.x` [#10305](https://github.com/ant-design/ant-design/pull/10305)
|
||||
- 🌟 Better aria-* attributes support. [react-component/menu#137](https://github.com/react-component/menu/pull/137)
|
||||
- 🌟 Improve Menu performance by avoiding unnecessary updates. [react-component/menu#133](https://github.com/react-component/menu/pull/133)
|
||||
- 🌟 Support passing props through to MenuItem list item. [react-component/menu#135](https://github.com/react-component/menu/pull/135)
|
||||
- 🐞 Minor key shortcut bug fixes. [react-component/menu#132](https://github.com/react-component/menu/pull/132)
|
||||
- Collapse
|
||||
- 🌟 Support custom `Collapse` styles with less. [#9943](https://github.com/ant-design/ant-design/pull/9943) [@davidhatten](https://github.com/davidhatten)
|
||||
- 🌟 Update `rc-collapse` to 1.9.0 to add `Collapse` keyboard support. [react-component/collapse#84](https://github.com/react-component/collapse/pull/84/) [@kossel](https://github.com/kossel)
|
||||
- Select
|
||||
- 🐞 Fix type for `placeholder`. [#10282](https://github.com/ant-design/ant-design/pull/10282) [@thomasthiebaud](https://github.com/thomasthiebaud)
|
||||
- 🐞 Fix extra space taken up when arrow disabled. [#10296](https://github.com/ant-design/ant-design/pull/10296)
|
||||
- 🐞 Fix property `value` typescript type. [#10336](https://github.com/ant-design/ant-design/pull/10336) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- Input
|
||||
- 🐞 Fix `Input.Search` not disable enter button when disabled prop is true. [#10040](https://github.com/ant-design/ant-design/issues/10040)
|
||||
- 🐞 Fix `Input.Group` align issue in Form. [#10281](https://github.com/ant-design/ant-design/issues/10281)
|
||||
- Form
|
||||
- 🐞 Fix typing for `Form.onValuesChange`. [#10231](https://github.com/ant-design/ant-design/pull/10231) [@whtsky](https://github.com/whtsky)
|
||||
- 🐞 Fix typescript interface `ComponentDecorator`. [#10324](https://github.com/ant-design/ant-design/pull/10324) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- 🐞 Fix dashed `Divider`. [#10216](https://github.com/ant-design/ant-design/issues/10216)
|
||||
- 🐞 Fix `Spin` container interaction. [#10227](https://github.com/ant-design/ant-design/issues/10227)
|
||||
- 🐞 Fix `Notification` icon hover color. [#10272](https://github.com/ant-design/ant-design/issues/10272)
|
||||
- 🐞 Fix `Upload` property `lastModifiedDate` name. [#10315](https://github.com/ant-design/ant-design/pull/10315) [@danielg2002](https://github.com/danielg2002)
|
||||
- 🐞 Fix `Button` props type, use `React.HTMLProps`. [#10229](https://github.com/ant-design/ant-design/pull/10229) [@whtsky](https://github.com/whtsky)
|
||||
- 🐞 Fix less var naming convention. [#10275](https://github.com/ant-design/ant-design/issues/10275)
|
||||
|
||||
## 3.4.5
|
||||
|
||||
`2018-05-03`
|
||||
|
||||
- 🐞 Fix file object is empty and file name not showing in Upload. [#10319](https://github.com/ant-design/ant-design/issues/10319)
|
||||
|
||||
## 3.4.4
|
||||
|
||||
`2018-04-28`
|
||||
@@ -680,7 +60,7 @@ Component Fixes / Enhancements:
|
||||
- 🐞 Fix style issue of Form in advanced-search mode. [#9907](https://github.com/ant-design/ant-design/issues/9907)
|
||||
- 🐞 Add `onHeaderRow` TypeScript type definitions for Table. [#9902](https://github.com/ant-design/ant-design/pull/9902) [@Nokecy](https://github.com/Nokecy)
|
||||
- 💄 Improve the customized-icon demo of Tree. [#9893](https://github.com/ant-design/ant-design/pull/9893)
|
||||
- 🐞 Fix image url display with non-image extension in Upload. [#9936](https://github.com/ant-design/ant-design/pull/9936)
|
||||
- 🐞 Fix image url display with non-image extention in Upload. [#9936](https://github.com/ant-design/ant-design/pull/9936)
|
||||
|
||||
## 3.4.0
|
||||
|
||||
@@ -739,7 +119,7 @@ Component Fixes / Enhancements:
|
||||
- `DatePicker`
|
||||
- 🌟 Add `dropdownClassName` prop to set the className of popup calendar. [#7211](https://github.com/ant-design/ant-design/issues/7211)
|
||||
- 🐞 Fix the error of resolving `moment` object. [#9539](https://github.com/ant-design/ant-design/pull/9539)
|
||||
- 🐞 Fix incorrect import of `turkish(tr_TR)` locale file. [#9373](https://github.com/ant-design/ant-design/issues/9373)
|
||||
- 🐞 Fix uncorrect import of `turkish(tr_TR)` locale file. [#9373](https://github.com/ant-design/ant-design/issues/9373)
|
||||
- 🌟 Add `orientation` prop for `Divider` to set the alignment of text in divider. [#9275](https://github.com/ant-design/ant-design/pull/9275) [@jrvboesch](https://github.com/jrvboesch)
|
||||
- 🌟 Add `keyboard` prop for `Modal` to set whether Modal could be closed by `Esc` key. [#8818](https://github.com/ant-design/ant-design/issues/8818)
|
||||
- 🌟 Improve the TypeScript definition of `event` param in `onChange` prop for `Radio` and `Checkbox`. [#9574](https://github.com/ant-design/ant-design/issues/9574)
|
||||
@@ -798,8 +178,8 @@ Component Fixes / Enhancements:
|
||||
- 🐞 Fix arrow position in IE11.
|
||||
- 🐞 Fix issue that file item showing `uploading` when Upload `beforeUpload` return false. [#8020](https://github.com/ant-design/ant-design/issues/8020)
|
||||
- 🐞 Fix misplace of feedback icon of `vertical` layout Form. [#9153](https://github.com/ant-design/ant-design/issues/9153)
|
||||
- 🐞 Fix loading style missing of empty children Card. [#9258](https://github.com/ant-design/ant-design/issues/9258)
|
||||
- 🐞 Fix background color of Avatar when image source is not existed. [#9278](https://github.com/ant-design/ant-design/pull/9278) [@andriijas](https://github.com/andriijas)
|
||||
- 🐞 Fix loading style missing of empty childen Card. [#9258](https://github.com/ant-design/ant-design/issues/9258)
|
||||
- 🐞 Fix background color of Avatar when image source is not existe. [#9278](https://github.com/ant-design/ant-design/pull/9278) [@andriijas](https://github.com/andriijas)
|
||||
- 🐞 Fix RangePicker `Cannot read property 'locale' of undefined` error when select end date. [#9267](https://github.com/ant-design/ant-design/issues/9267)
|
||||
- 🐞 Fix style problem when using disabled button with Tooltip inside ButtonGroup. [#9296](https://github.com/ant-design/ant-design/issues/9296) [#9296](https://github.com/ant-design/ant-design/issues/9296)
|
||||
- 🐞 Fix z-index of Dropdown's submenu. [#9218](https://github.com/ant-design/ant-design/issues/9218)
|
||||
@@ -811,7 +191,7 @@ Component Fixes / Enhancements:
|
||||
- 🌟 Add new `tabBarGutter` prop to Tab to allow setting gutter between tabs. [#8644](https://github.com/ant-design/ant-design/pull/8644) [@lixiaoyang1992](https://github.com/lixiaoyang1992)
|
||||
- 🌟 Add new `hasSider` prop to Layout to avoid render error when server rendering. [#8937](https://github.com/ant-design/ant-design/issues/8937)
|
||||
- 🌟 Add new `successPercent` to Progress to allow showing two phases. [Demo](https://ant.design/components/progress/#components-progress-demo-segment)
|
||||
- 🌟 Add new `iconType` prop to Alert to allow setting icon type. [#8811](https://github.com/ant-design/ant-design/pull/8811) [@minwe](https://github.com/ant-design/ant-design/pull/8811)
|
||||
- 🌟 Add new `iconType` prop to Alert to allow settting icon type. [#8811](https://github.com/ant-design/ant-design/pull/8811) [@minwe](https://github.com/ant-design/ant-design/pull/8811)
|
||||
- 🌟 Add `id` prop to DatePicker. [#8598](https://github.com/ant-design/ant-design/pull/8598) [@mgrdevport](https://github.com/mgrdevport)
|
||||
- 🌟 Add new `forceRender` prop to Collapse to allow rendering hide panel. [#9192](https://github.com/ant-design/ant-design/pull/9192) [#Pyroboomka](https://github.com/ant-design/ant-design/pull/9192) [@paulcmason](https://github.com/react-component/collapse/pull/82)
|
||||
- RangePicker
|
||||
@@ -820,12 +200,12 @@ Component Fixes / Enhancements:
|
||||
- 🐞 Fix issue resulting date panel being closed without animation when click on the preset range. [#6364](https://github.com/ant-design/ant-design/issues/6364)
|
||||
- 🐞 Fix issue resulting `onOk` is not being trigged, when click on the preset range. [#7747](https://github.com/ant-design/ant-design/issues/7747)
|
||||
- Select
|
||||
- 🌟 Improve `onChange`, `onDeselect`, they will receive selected `Option` as second parameter.
|
||||
- 🌟 Improve `onChange`, `onDeselect`, they will receive selected `Option` as second paramteter.
|
||||
- 🐞 Fix issue resulting in `onSelect` is not trigged when using automatic tokenization. [#9094](https://github.com/ant-design/ant-design/issues/9094)
|
||||
- 🐞 Fix the missing scrollbar in Chrome.
|
||||
- 🌟 Improve Table's `rowSelection[getCheckboxProps]` prop, now the all the properties returned by `getCheckboxProps` will be passed to checkbox. [#9054](https://github.com/ant-design/ant-design/pull/9054) [@mgrdevport](https://github.com/ant-design/ant-design/pull/9054)
|
||||
- 🐞 Fix issue resulting in Calendar's `mode` not being allowed to be changed from outside. [#9243](https://github.com/ant-design/ant-design/pull/9243) [@mgrdevport](https://github.com/ant-design/ant-design/pull/9243)
|
||||
- 🐞 Fix issue resulting AutoComplete showing wrong border when showing validation message.[9f2b490](https://github.com/ant-design/ant-design/commit/9f2b4905f09fca503da7a8bb5f2b8347bea663b7)
|
||||
- 🐞 Fix issue resulting AutoComplete showing wrong border when showing validattion message.[9f2b490](https://github.com/ant-design/ant-design/commit/9f2b4905f09fca503da7a8bb5f2b8347bea663b7)
|
||||
- 🐞 Fix issue resulting in DatePicker showing wrong time in the control mode. [#8885](https://github.com/ant-design/ant-design/issues/8885)
|
||||
- 🐞 Fix issue resulting in TextArea showing wrong height in Edge. [#9108](https://github.com/ant-design/ant-design/pull/9108) [@cuyl](https://github.com/cuyl)
|
||||
- 🐞 Fix issue resulting in Tabs showing wrong tab style when using `type="card"` combine with `tabPosition="bottom"`. [#9165](https://github.com/ant-design/ant-design/pull/9165) [@ryanhoho](https://github.com/ryanhoho)
|
||||
@@ -904,7 +284,7 @@ Component Fixes / Enhancements:
|
||||
- 📖 Updated the guideline of real project with dva to [roadhog 2.0](https://github.com/sorrycc/blog/issues/55). [5dcf1c0](https://github.com/ant-design/ant-design/commit/5dcf1c015fc2674adb09434bf766549d6f3f0022)
|
||||
- 📖 Published the new sketch resource of Ant Design 3.0. [22dfe88](https://github.com/ant-design/ant-design/commit/22dfe88ab043c1e116382fc96b7d78cabf125054)
|
||||
- 🐞 Fix contextMenu event for trigger prop in the TypeScript definition of Dropdown. [#8646](https://github.com/ant-design/ant-design/issues/8646) [@cjahv](https://github.com/cjahv)
|
||||
- 🐞 Fix HOC in Button not inserted space between Chinese words.
|
||||
- 🐞 Fix HOC in Button not inserted space between chinese words.
|
||||
- 🐞 Fix the style compatibility in IE 11 for List Component. [#8784](https://github.com/ant-design/ant-design/issues/8784)
|
||||
- 🐞 Fix notFoundContent prop not working for Select Component. [#8809](https://github.com/ant-design/ant-design/issues/8809)
|
||||
- 🐞 Fix the warning for BackTop Component in React 16. [#8848](https://github.com/ant-design/ant-design/issues/8848)
|
||||
@@ -927,7 +307,7 @@ Happy 2018 !~ 2018 2018 2018 coming!~~~
|
||||
- 🌟 Add `showArrow` for disabling arrow icon in collapse panel. [#8536](https://github.com/ant-design/ant-design/pull/8536) [@apieceofbart](https://github.com/apieceofbart)
|
||||
- 🌟 Rate add `allowClear` for reset when click again. [#8627](https://github.com/ant-design/ant-design/issues/8627)
|
||||
- 🌟 Add responsive for BackTop. [#8719](https://github.com/ant-design/ant-design/issues/8719) [@JetRunner](https://github.com/JetRunner)
|
||||
- 🌟 Add `destroyOnClose` to Modal component to support unmount child components on onClose. [#8769](https://github.com/ant-design/ant-design/pull/8769) [@Rohanhacker](https://github.com/Rohanhacker)
|
||||
- 🌟 Add `destroyOnClose` to Modal component to support unmount child compenents on onClose. [#8769](https://github.com/ant-design/ant-design/pull/8769) [@Rohanhacker](https://github.com/Rohanhacker)
|
||||
- 🌟 Pagination add `hideOnSinglePage` for support hide it when only one page. [#8615](https://github.com/ant-design/ant-design/pull/8615) [@camsong](https://github.com/camsong)
|
||||
- 🌟 Support customize spin for List component.
|
||||
- 👻 Support open official demo in CodeSandbox.
|
||||
@@ -952,7 +332,7 @@ Happy 2018 !~ 2018 2018 2018 coming!~~~
|
||||
- 🐞 Upgrade to `react-slick@0.16.0` for peerDependencies warning. [#8455](https://github.com/ant-design/ant-design/issues/8455)
|
||||
- 🐞 Fix not working `size` property in fixed-header Table. [#8577](https://github.com/ant-design/ant-design/issues/8577)
|
||||
- 🐞 Fix not working `locale` property of DatePicker/RangePicker. [#8635](https://github.com/ant-design/ant-design/issues/8635)
|
||||
- 🐞 Fix Popover arrow position and size cannot be overridden by less variable. [#8548](https://github.com/ant-design/ant-design/issues/8548) [#8549](https://github.com/ant-design/ant-design/issues/8549)
|
||||
- 🐞 Fix Popover arrow position and size cannot be overrided by less variable. [#8548](https://github.com/ant-design/ant-design/issues/8548) [#8549](https://github.com/ant-design/ant-design/issues/8549)
|
||||
- 🐞 Fix not working `notFoundContent` of AutoComponent. [#8553](https://github.com/ant-design/ant-design/issues/8553)
|
||||
- 🐞 Tweak RangePicker vertical align position.
|
||||
- 🐞 Layout.Sider breakpoints is same as Grid's now. [#8620](https://github.com/ant-design/ant-design/issues/8620)
|
||||
@@ -968,11 +348,11 @@ Happy 2018 !~ 2018 2018 2018 coming!~~~
|
||||
|
||||
* Remove useless DOM wrapper of Card, so that Card's DOM structure will be the same as Card of 2.x.
|
||||
* Fix that missing `antd/lib/style/v2-compatible-reset.css`. [28d13e2](https://github.com/ant-design/ant-design/commit/28d13e2539817f87b8a2029ea22d9c30b377167f)
|
||||
* Fix that Affix will be overlap when it is higher than viewport. [31a0654](https://github.com/ant-design/ant-design/commit/31a0654ef990eb7bae2b18095fa0d5230b9be1da)
|
||||
* Fix that Affix will be overlap when it is heigher than viewport. [31a0654](https://github.com/ant-design/ant-design/commit/31a0654ef990eb7bae2b18095fa0d5230b9be1da)
|
||||
* Fix the open animation of Collapse. [edd592c](https://github.com/ant-design/ant-design/commit/edd592cb9dd79d534853e7a0c1b648382e3f1a12)
|
||||
* Fix the alignment of large size Input and Button in Form. [#8459](https://github.com/ant-design/ant-design/issues/8459)
|
||||
* Fix the aligment of large size Input and Button in Form. [#8459](https://github.com/ant-design/ant-design/issues/8459)
|
||||
* Menu
|
||||
* Fix the popup will disappear unexpectedly in Safari. [#8453](https://github.com/ant-design/ant-design/issues/8453)
|
||||
* Fix the popup will disappear unexpectly in Safari. [#8453](https://github.com/ant-design/ant-design/issues/8453)
|
||||
* Fix the open animation. [edd592c](https://github.com/ant-design/ant-design/commit/edd592cb9dd79d534853e7a0c1b648382e3f1a12)
|
||||
* Fix compile error of style of Notification. [#8437](https://github.com/ant-design/ant-design/issues/8437)
|
||||
* Fix the background color of mini Pagination. [e13c6d8](https://github.com/ant-design/ant-design/commit/e13c6d87fa6bf7d5cf4b2d5154a85b4793997de5)
|
||||
@@ -990,7 +370,7 @@ Happy 2018 !~ 2018 2018 2018 coming!~~~
|
||||
|
||||
`2017-12-04`
|
||||
|
||||
Learn more in the [Ant Design 3.0 announcement post](https://medium.com/ant-design/announcing-ant-design-3-0-70e3e65eca0c).
|
||||
Learn more in the [Ant Design 3.0 announcement post](https://medium.com/ant-design/announcing-ant-design-3-0-70e3e65eca0c)!
|
||||
|
||||
### Major Changes
|
||||
|
||||
@@ -1006,15 +386,11 @@ Learn more in the [Ant Design 3.0 announcement post](https://medium.com/ant-desi
|
||||
|
||||
### Breaking Changes
|
||||
|
||||
> We suggest you upgrade to latest 3.x version directly.
|
||||
|
||||
> Some APIs may be deprecated in other 3.x versions which don't described below, please pay attention to warning in browser console and upgrade them.
|
||||
|
||||
We provide a [migration tool](https://github.com/ant-design/antd-migration-helper) to help you find deprecated usages in your codebase.
|
||||
|
||||
- Card's `noHovering` has been renamed to `hoverable`, and its default value now is `true`.
|
||||
- Card's `noHovering` has been renamed to `hoverable`，and its default value now is `true`.
|
||||
- Added new Grid breakpoints. [#7230](https://github.com/ant-design/ant-design/pull/7230)
|
||||
- Form `getFieldDecorator`'s `exclusive` option has been removed.
|
||||
- Form `getFieldDecorator`'s `exclusive` option has been removeed.
|
||||
- Added `Form.createFormField`, and you must use it to wrap field data returned in `option.mapPropsToFields`:
|
||||
|
||||
```diff
|
||||
@@ -1072,7 +448,7 @@ We provide a [migration tool](https://github.com/ant-design/antd-migration-helpe
|
||||
- 🌟 Input.Search added new `enterButton` prop to allow setting custom search button.[#7596](https://github.com/ant-design/ant-design/issues/7596)
|
||||
- 🌟 Mention added new `placement` prop to allow setting the popup direction.
|
||||
- 🌟 Carousel added new `next()`, `prev()`, `goTo(slideNumber)` methods to allow controlling slides programmatically.
|
||||
- 🌟 Button added link support, Button with `href` prop will render to `<a>`. [#8343](https://github.com/ant-design/ant-design/pull/8343)
|
||||
- 🌟 Button added link support，Button with `href` prop will render to `<a>`. [#8343](https://github.com/ant-design/ant-design/pull/8343)
|
||||
- 🌟 Steps was refactored, first rendering won't flash. [#6010](https://github.com/ant-design/ant-design/issues/6010)
|
||||
- 🌟 Switch added new `loading` prop to show a loading status.
|
||||
- Menu
|
||||
@@ -1086,16 +462,16 @@ We provide a [migration tool](https://github.com/ant-design/antd-migration-helpe
|
||||
- 🌟 Allow `duration` optional. [#7857](https://github.com/ant-design/ant-design/issues/7857) [@monkindey](https://github.com/monkindey)
|
||||
- Badge
|
||||
- 🌟 Added new `offset` prop to allow setting the offset of status point.
|
||||
- 🌟 `status` can use with `children` now. [#8164](https://github.com/ant-design/ant-design/issues/8164)
|
||||
- 🌟 `status` can use whith `children` now. [#8164](https://github.com/ant-design/ant-design/issues/8164)
|
||||
- Card
|
||||
- 🌟 Added new `inner` type. [Demo](https://ant.design/components/card/#components-card-demo-inner)。
|
||||
- 🌟 Added `cover`, `actions` and a new `Meta` component. [Demo](https://ant.design/components/card/#components-card-demo-meta)。
|
||||
- DatePicker
|
||||
- 🌟 Added `mode` and `onPanelChange`, to allow controlling the panel mode. [Demo](https://ant.design/components/date-picker/#components-date-picker-demo-mode)。
|
||||
- 🌟 Added `mode` and `onPanelChange`，to allow controlling the panel mode. [Demo](https://ant.design/components/date-picker/#components-date-picker-demo-mode)。
|
||||
- 🌟 Added `WeekPicker` component. [Demo](https://ant.design/components/date-picker/#components-date-picker-demo-basic)
|
||||
- 🌟 Added new `dateRender` prop to allow customizing date cell.
|
||||
- TimePicker
|
||||
- 🌟 Added new `hourStep`, `minuteStep`, `secondStep` props to allow customizing time steps. [Demo](https://ant.design/components/time-picker/#components-time-picker-demo-interval-options)
|
||||
- 🌟 Added new `hourStep`, `minuteStep`, `secondStep` props to allow customizing time setps. [Demo](https://ant.design/components/time-picker/#components-time-picker-demo-interval-options)
|
||||
- 🌟 Added new `focusOnOpen` prop to focus input after panel is open.
|
||||
- Table
|
||||
- 🌟 Added new `components` prop to allow overriding default table elements.
|
||||
@@ -1125,7 +501,7 @@ We provide a [migration tool](https://github.com/ant-design/antd-migration-helpe
|
||||
- 🌟 Added `column[defaultSortOrder]` to allow setting default sort order. [#8111](https://github.com/ant-design/ant-design/pull/8111) [@megawac](https://github.com/megawac)
|
||||
- 🌟 Added `rowSelection[fixed]` to allow fixing the selection column.。
|
||||
- 🙅 Deprecated `getBodyWrapper`, please use `components` instead.
|
||||
- 🙅 Deprecated `onRowClick`, `onRowDoubleClick`, `onRowContextMenu`, `onRowMouseEnter`, `onRowMouseLeave`, please use `onRow` instead.
|
||||
- 🙅 Deprecated `onRowClick`，`onRowDoubleClick`, `onRowContextMenu`, `onRowMouseEnter`, `onRowMouseLeave`, please use `onRow` instead.
|
||||
```javascript
|
||||
<Table onRow={(record) => ({
|
||||
onClick: () => {},
|
||||
|
||||
@@ -15,629 +15,6 @@ timeline: true
|
||||
|
||||
---
|
||||
|
||||
## 3.10.5
|
||||
|
||||
`2018-11-09`
|
||||
|
||||
- 🎉 发布 [Landing 模板集](https://landing.ant.design)！
|
||||
- 📖 发布 Ant Design [新版 Sketch 模版文件](https://github.com/ant-design/ant-design/releases/download/resource/Ant.Design.Components.Beta.3.10.5.sketch)。
|
||||
- Button
|
||||
- 🐞 修复在小尺寸的 `Button.Group` 中没有垂直对齐的问题。[#12972](https://github.com/ant-design/ant-design/issues/12972)
|
||||
- 🐞 修复设置了 `href` 属性没有垂直对齐的问题。[#12978](https://github.com/ant-design/ant-design/issues/12978)
|
||||
- 🐞 修复 Cascader 组件的 `filedNames` 属性在 `3.7.0` 版本后的兼容性问题。[#12970](https://github.com/ant-design/ant-design/issues/12970)
|
||||
- 🐞 修复 DatePicker 组件的日期值没有被成功修改，浮层中显示的日期应该被重置的问题。[#12929](https://github.com/ant-design/ant-design/issues/12929)
|
||||
- 🐞 修复 Icon 组件丢失 `cross` 类型图标的问题。[#12970](https://github.com/ant-design/ant-design/issues/12970)
|
||||
- 🐞 修复 Menu 组件处于折叠状态时菜单类型不正确的问题。[#2782](https://github.com/ant-design/ant-design-pro/issues/2782) [#2783](https://github.com/ant-design/ant-design-pro/issues/2783) [#2786](https://github.com/ant-design/ant-design-pro/issues/2786)
|
||||
- 🐞 修复 Popover 和 Tooltip 组件中出现不必要的回流问题，避免出现奇怪的动画。[#12942](https://github.com/ant-design/ant-design/issues/12942)
|
||||
- Table
|
||||
- 🐞 修复嵌套在其他组件中时样式溢出的问题。[#13025](https://github.com/ant-design/ant-design/issues/13025)
|
||||
- 🐞 修复表头内容过长会与排序图表重合的问题。[#12552](https://github.com/ant-design/ant-design/issues/12552) [#12650](https://github.com/ant-design/ant-design/issues/12650)
|
||||
- 🐞 修复 Tooltip 组件嵌套在 `Popover/Popconfirm` 下，并且子元素为 `disabled` 状态时不消失的问题。[#13001](https://github.com/ant-design/ant-design/issues/13001)
|
||||
- 🐞 修复 Upload 组件在上传非图片类型文件时会将文件读取至内存，造成浏览器卡顿的问题。[#12948](https://github.com/ant-design/ant-design/issues/12948)
|
||||
- 🐞 修复在 `IE` 和 `Edge` 浏览器下 `DOM 对象` 不支持 `removeAttribute` 属性的问题。[#2423](https://github.com/ant-design/ant-design-pro/issues/2423)
|
||||
- 🐞 对于隐藏元素去掉不必要的波浪动画。[#12967](https://github.com/ant-design/ant-design/issues/12967)
|
||||
|
||||
## 3.10.4
|
||||
|
||||
`2018-11-03`
|
||||
|
||||
- Modal
|
||||
- 🌟 增加 less 变量 `@modal-header-bg` 定制 Modal 头部颜色。[#12914](https://github.com/ant-design/ant-design/issues/12914)
|
||||
- 🐞 修复 maskStyle 在 Modal.method 中无效的问题。[#12688](https://github.com/ant-design/ant-design/issues/12688)
|
||||
- 🐞 修复 Checkbox 在 IE 11 中丢失勾号的问题。[#12597](https://github.com/ant-design/ant-design/issues/12597)
|
||||
- 🐞 修复 FormItem 在有帮助信息时高度不一致的问题。[#12803](https://github.com/ant-design/ant-design/issues/12803)
|
||||
- 🐞 修复 Chrome 下 Divider 在 Popover 中会撑宽 Popover card 的问题。[#10914](https://github.com/ant-design/ant-design/issues/10914)
|
||||
- 🐞 修复 Avatar 内容在 Popover 中没有对齐的问题。[#10917](https://github.com/ant-design/ant-design/issues/#10917)
|
||||
- Button
|
||||
- 🐞 修复 unable to find node on unmounted components 报错问题。[#12843](https://github.com/ant-design/ant-design/issues/12843)
|
||||
- 🐞 修复 icon margin 样式。[546c59a](https://github.com/ant-design/ant-design/commit/546c59a4c1a6b482afecbcb4a3cb1e385c0bbdb6)
|
||||
- Table
|
||||
- 🐞 修复在 Column 中使用 render function 时的排序问题。[#12870](https://github.com/ant-design/ant-design/issues/12870) [#12737](https://github.com/ant-design/ant-design/issues/12737)
|
||||
- 🐞 修复固定列 border 样式问题。[#9687](https://github.com/ant-design/ant-design/issues/9687)
|
||||
- TypeScript
|
||||
- 🐞 修复 Select `onPopupScroll` 属性定义 [#12913](https://github.com/ant-design/ant-design/pull/12913)。
|
||||
- 🐞 修复 AutoComplete 缺失 `onFocus` 以及 `onBlur` 属性定义。[@muzea](https://github.com/muzea) [#12793](https://github.com/ant-design/ant-design/issues/12793);
|
||||
|
||||
## 3.10.3
|
||||
|
||||
`2018-10-27`
|
||||
|
||||
- 🌟 完善工具方法 `getScroll` 的 TypeScript 定义。[#12784](https://github.com/ant-design/ant-design/pull/12784) [@ztplz](https://github.com/ztplz)
|
||||
- 🐞 修复 CheckboxGroup 内 Checkbox 没有触发 `onChange` 的问题。[#12642](https://github.com/ant-design/ant-design/issues/12642)
|
||||
- 🐞 修复 Calendar 组件设置 `validRange` 后选择月份时的问题。[#12675](https://github.com/ant-design/ant-design/issues/12675)
|
||||
- 🐞 修复 Select 组件设置了 `dropdownMatchSelectWidth` 后多选下拉框的问题。[#12816](https://github.com/ant-design/ant-design/pull/12816) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 修复 Card 标题可能会被覆盖的问题。[#12680](https://github.com/ant-design/ant-design/issues/12680)
|
||||
- 🐞 修复 Form[inline] 提示信息和错误文案被覆盖的问题。[#12725](https://github.com/ant-design/ant-design/issues/12725)
|
||||
- Table
|
||||
- 🌟 支持自定义 Table 组件的筛选按钮的背景色。[#12775](https://github.com/ant-design/ant-design/pull/12775) [@ivankravets](https://github.com/ivankravets)
|
||||
- 🐞 调整 Table 组件的样式细节。[#12682](https://github.com/ant-design/ant-design/issues/12682)
|
||||
- 🐞 修复在火狐下，当 size="small" 未排序时下边框不显示。[#12840](https://github.com/ant-design/ant-design/issues/12840)
|
||||
- 🐞 修复大小为 small/middle 时复选框不能对齐的问题。[#12723](https://github.com/ant-design/ant-design/issues/12723)
|
||||
|
||||
## 3.10.2
|
||||
|
||||
`2018-10-23`
|
||||
|
||||
- 📝 翻译[模式-概览](https://ant.design/docs/spec/overview)文档到英文。[#12637](https://github.com/ant-design/ant-design/pull/12637) [@ilanus](https://github.com/ilanus)
|
||||
- 🛠 DatePicker 组件完善对越南语（vi_VN）的支持。[#12656](https://github.com/ant-design/ant-design/pull/12656) [@hieuhlc](https://github.com/hieuhlc)
|
||||
- 🐞 修复 TimePicker 组件在 IE11 下的样式问题。[#12707](https://github.com/ant-design/ant-design/pull/12707) [jinyaqiao1102](https://github.com/jinyaqiao1102)
|
||||
- 🐞 修复 Popconfirm 组件的 `defaultVisible` 属性的问题。[#12733](https://github.com/ant-design/ant-design/issues/12733)
|
||||
- 🐞 修复在 Firefox 下 Table 组件头部边框不显示的问题。[#12628](https://github.com/ant-design/ant-design/issues/12628)
|
||||
- 🐞 组件 Slider 添加 `touch-action: none` 样式修复 Chrome 上可能出现的报错。[#12595](https://github.com/ant-design/ant-design/issues/12595)
|
||||
- 🐞 修复 Tabs 组件垂直模式下边框条的问题。[#12276](https://github.com/ant-design/ant-design/issues/12276)
|
||||
- 🐞 修复 Button 组件无内容时垂直不对齐的问题。[#12681](https://github.com/ant-design/ant-design/issues/12681)
|
||||
- 🐞 修复 Calendar 组件 `locale` 属性不生效的问题。[#12706](https://github.com/ant-design/ant-design/issues/12706)
|
||||
- 🐞 修复 Checkbox 组件在设置 `indeterminate` 的情况下的样式问题。[#12724](https://github.com/ant-design/ant-design/issues/12724)
|
||||
- 🐞 修复 `prefixCls` 没有应用到 Popconfirm 组件按钮上的问题。[#12677](https://github.com/ant-design/ant-design/pull/12677) [@concefly](https://github.com/concefly)
|
||||
- 🐞 修复 Edge 下 Button 组件 `pointer-events:none` 对于 span 不生效的问题。[#12712](https://github.com/ant-design/ant-design/pull/12712) [@dazbo](https://github.com/dazbo)
|
||||
- Progress
|
||||
- 🐞 修复 Progress 组件的 `strokeColor` 属性无效的问题。[#12587](https://github.com/ant-design/ant-design/pull/12587) [@lyhper](https://github.com/lyhper)
|
||||
- 🐞 修复 Progress[type="circle"] 中文本溢出的问题。[#12718](https://github.com/ant-design/ant-design/issues/12718)
|
||||
- TypeScript
|
||||
- 🐞 修复 TreeSelect 组件缺少 `treeExpandedKeys` 和 `onTreeExpand` 的定义的问题。[#12648](https://github.com/ant-design/ant-design/pull/12648) [@decadef20](https://github.com/decadef20)
|
||||
- 🐞 修复 TabPaneProps 组件缺少 `key` 属性定义的问题。[682af0d](https://github.com/ant-design/ant-design/commit/682af0d44bf38a7d3e487aa909c46409db163030) [@ztplz](https://github.com/ztplz)
|
||||
- 🐞 修复 Icon 组件的部分定义问题。[3dbc357](https://github.com/ant-design/ant-design/commit/3dbc357ff2837debbb9b36a25b14be4757297cad)
|
||||
|
||||
## 3.10.1
|
||||
|
||||
`2018-10-12`
|
||||
|
||||
- 🎉 [Ant Design Mobile of Angular](http://ng.mobile.ant.design/)（NG-ZORRO-Mobile）发布！
|
||||
- 📝 更新 [项目实战](https://ant.design/docs/react/practical-projects-cn) 文档为最新的 umi 技术栈。
|
||||
- Table
|
||||
- 🐞 修复未指定排序的列头点击时也会触发排序的问题。[#12515](https://github.com/ant-design/ant-design/issues/12515)
|
||||
- 🐞 修复列头多余的排序 title 提示。[#12613](https://github.com/ant-design/ant-design/issues/12613)
|
||||
- 🐞 修复排序和右对齐的列样式错位的问题。[#12552](https://github.com/ant-design/ant-design/issues/12552)
|
||||
- 🐞 修复一个 columns 定义在 render 内时排序失效的问题。[#12571](https://github.com/ant-design/ant-design/issues/12571)
|
||||
- 🐞 修复小号表格下排序列的列头背景色。
|
||||
- 🐞 修复 Table 的选择器在 chrome 下选中样式的重影问题。[5bef1aa](https://github.com/ant-design/ant-design/commit/5bef1aa6c2e792180ef8d53a1f1489376b8e35db)
|
||||
- 🐞 修复 Form.Item 内的 Table 分页样式。[#12554](https://github.com/ant-design/ant-design/issues/12554)
|
||||
- DatePicker
|
||||
- 🐞 调整意大利国际化文案。[#12413](https://github.com/ant-design/ant-design/issues/12413) [@yp](https://github.com/yp)
|
||||
- 🐞 修复选择完成后选择框没有获取焦点的问题。[#12475](https://github.com/ant-design/ant-design/issues/12475)
|
||||
- 🐞 修复在 Input.Group 内使用时日期图标消失的问题。[#12536](https://github.com/ant-design/ant-design/issues/12536)
|
||||
- 🐞 修复 Anchor 中文字边缘被切割的问题。[#12520](https://github.com/ant-design/ant-design/issues/12520)
|
||||
- 🐞 修复 Drawer 设置无遮罩时依然挡住了页面元素的问题。[#12401](https://github.com/ant-design/ant-design/issues/12401)
|
||||
- 🐞 修复 AutoComplete 下使用自定义 Input.TextArea 下失效样式丢失的问题。[#12594](https://github.com/ant-design/ant-design/issues/12594)
|
||||
- 🐞 修复 Modal.confirm 的 `prefixCls` 属性没有透传给 mask 的问题，并调整了默认的 prefixCls 的值为 `ant-model-confirm`。[#12546](https://github.com/ant-design/ant-design/issues/12546)
|
||||
- 🐞 修复 Input.Group 在 safari 下的一个对齐问题。[#12493](https://github.com/ant-design/ant-design/issues/12493)
|
||||
- 🐞 修复独自使用 `<Badge />` 时的垂直对齐。[#12419](https://github.com/ant-design/ant-design/issues/12419)
|
||||
- 🐞 修复 Tree.DirectoryTree 点击切换图标和点击文本时 `onExpand` 参数不一致的问题。[#12567](https://github.com/ant-design/ant-design/issues/12567)
|
||||
- 🐞 修复在 IE11 下错误聚焦到表单状态图标的问题。[#12524](https://github.com/ant-design/ant-design/pull/12524) [@siyu77](https://github.com/siyu77)
|
||||
- 🐞 修复多选 Select 多次点击输入框时会反复触发 `onFocus` 和 `onBlur` 的问题。[#12281](https://github.com/ant-design/ant-design/issues/12281) [@Frezc ](https://github.com/Frezc)
|
||||
- 🐞 修复环形 Progress 内文本超长溢出的问题。
|
||||
- TypeScript
|
||||
- 🐞 补充 Steps 的 `labelPlacement` 属性定义。[#12575](https://github.com/ant-design/ant-design/pull/12575) [@yueyes](https://github.com/yueyes)
|
||||
- 🐞 补充 Select.Option 的 `style` 属性定义。[#12609](https://github.com/ant-design/ant-design/pull/12609) [@dimitropoulos](https://github.com/dimitropoulos)
|
||||
- 🐞 修复 `form.validateFields` 的定义重载问题。[#12538](https://github.com/ant-design/ant-design/pull/12538) [@TomIsion](https://github.com/TomIsion)
|
||||
- 🐞 补充 AutoComponent 的 `onFocus` `onBlur` 定义。[#12498](https://github.com/ant-design/ant-design/issues/12498)
|
||||
|
||||
## 3.10.0
|
||||
|
||||
`2018-09-30`
|
||||
|
||||
🎉 国庆节快乐
|
||||
|
||||
- 📝 更新了[图标](https://ant.design/docs/spec/icon-cn)和[动效](https://ant.design/docs/spec/motion-cn)两篇设计指引。
|
||||
- 🌟 Upload 组件新增 `openFileDialogOnClick` 属性，用于设置点击组件时是否打开上传对话框。[#12347](https://github.com/ant-design/ant-design/pull/12347) [@hengkx](https://github.com/hengkx)
|
||||
- 🌟 InputNumber 组件新增 `decimalSeparator` 属性，用于设置自定义的小数点。[#12329](https://github.com/ant-design/ant-design/pull/12329) [@amedora](https://github.com/amedora)
|
||||
- 🌟 TreeSelect 组件新增 `treeExpandedKeys` 和 `onTreeExpand` 属性，用于控制树的展开收起。[#12145](https://github.com/ant-design/ant-design/issues/12145)
|
||||
- Transfer
|
||||
- 🌟 新增 `disabled` 属性。[#12066](https://github.com/ant-design/ant-design/issues/12066)
|
||||
- Modal
|
||||
- 🌟 新增 `autoFocusButton` 属性，用于指定 Modal 打开时自动获取焦点的按钮。[#11756](https://github.com/ant-design/ant-design/pull/11756) [@erwin-k](https://github.com/erwin-k)
|
||||
- 🌟 `confirm` 方法的参数新增 `okButtonProps` 和 `cancelButtonProps`，用户设置对应按钮的属性。[#12425](https://github.com/ant-design/ant-design/pull/12425) [@Whoaa512](https://github.com/Whoaa512)
|
||||
- Table
|
||||
- 🌟 现在可以把 `column.title` 设置为一个方法了。[#11246](https://github.com/ant-design/ant-design/issues/11246)
|
||||
- 🌟 `onChange` 属性新增第四个参数 `extra`，用于获取当前显示的筛选后的数据。[#12369](https://github.com/ant-design/ant-design/pull/12369)
|
||||
- 🌟 优化了排序和筛选交互，现在整个列表头都可以点击排序了。[#12264](https://github.com/ant-design/ant-design/pull/12264)
|
||||
- 🌟 Alert 新增 `icon` 属性，用户设置自定义图标。例子：[自定义图标](https://ant.design/components/alert-cn/#components-alert-demo-custom-icon)
|
||||
- 🌟 以下组件均新增了 `suffixIcon` 属性，用于设置输入框后面的图标，具体用法可以参考文档。
|
||||
- Cascader
|
||||
- DatePicker
|
||||
- Select
|
||||
- TreeSelect
|
||||
- TimePicker
|
||||
- 🌟 新增 less 变量 [f237eff](https://github.com/ant-design/ant-design/commit/f237effc2a35eb249273f6f2826092a2f9b9db45)
|
||||
- 🐞 修复 Icon.createFromIconfontCN 方法会自动给 `scriptUrl` 加 `https` 的问题。[#12316](https://github.com/ant-design/ant-design/issues/12316)
|
||||
- 🐞 修复 Row 的 `gutter` 属性，在使用嵌套的 Col 时不生效的问题。[#12320](https://github.com/ant-design/ant-design/pull/12320)
|
||||
- 🐞 修复 Tree.DirectoryTree 组件在设置的 `expandedKeys` 有初始值时不能正确展开节点的问题。[#12396](https://github.com/ant-design/ant-design/issues/12396)
|
||||
- 🐞 修复 Transfer 组件使用 `render` 属性返回 ReactNode 时，列表项的 `title` 属性显示错误的问题。[#12399](https://github.com/ant-design/ant-design/issues/12399)
|
||||
- 🐞 修复 Tooltip 在 CheckboxGroup 上不工作的问题。[#12427](https://github.com/ant-design/ant-design/issues/12427)
|
||||
- 🐞 修复 Button 组件 loading 状态下在 IE9 里依然可以被点击的问题。[#12466](https://github.com/ant-design/ant-design/pull/12466) [@snail](https://github.com/120216220)
|
||||
- 🐞 修复 Input.Group 中使用非 Input 组件时，鼠标 hover 时会产生抖动的问题。[#12407](https://github.com/ant-design/ant-design/pull/12407) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 修复 TypeScript 类型定义 [#12374](https://github.com/ant-design/ant-design/pull/12374) [#12370](https://github.com/ant-design/ant-design/pull/12370) [#12354](https://github.com/ant-design/ant-design/pull/12354/files) [#12473](https://github.com/ant-design/ant-design/pull/12473)
|
||||
|
||||
## 3.9.3
|
||||
|
||||
`2018-09-22`
|
||||
|
||||
- 🐞 修复 `Select` 组件在 Chrome 下超长文本的渲染延迟。[#11456](https://github.com/ant-design/ant-design/issues/11456) [#11843](https://github.com/ant-design/ant-design/issues/11843)
|
||||
- 🐞 修复 `RangePicker` 组件中的 `onOpenChange` 非正常数值报错问题。[#12142](https://github.com/ant-design/ant-design/pull/12142)[@leijingdao](https://github.com/leijingdao)
|
||||
- 🐞 修复 `Carousel` 组件的 `goTo` 方法缺少 `dontAnimate` 参数问题，参数用于关闭转场过渡动画。[#12205](https://github.com/ant-design/ant-design/pull/12205)
|
||||
- 🐞 修复 `Tabs` 中 `tabBar` 的重复类名。[589ba](https://github.com/ant-design/ant-design/commit/589bafd5db92a817c078ead6decdb81e64b2b5a8)[#12051](https://github.com/ant-design/ant-design/issues/12051)
|
||||
- 🐞 修复 `Card` 组件标题的垂直对齐方式。[#11036](https://github.com/ant-design/ant-design/pull/11036)[#10576](https://github.com/ant-design/ant-design/issues/10576)
|
||||
- 🐞 修复 `List` 组件刷新后 key 值非预期变化。[#12299](https://github.com/ant-design/ant-design/pull/12299)[@douglasjunior](https://github.com/douglasjunior)
|
||||
- 🐞 修复 `Table` 组件 `confirmFilter` 方法不能及时更新数据。[954c7](https://github.com/ant-design/ant-design/commit/954c7ecd8ed384a3c67ec8dfb0e0deaa14bbf83b)[#12284](https://github.com/ant-design/ant-design/issues/12284)
|
||||
- `Menu` 组件相关
|
||||
- 🐞 修复 `Menu` 在 `horizontal` 模式下时出现额外的滚动条。[#12152](https://github.com/ant-design/ant-design/issues/12152)
|
||||
- 🐞 修复 `Menu` 组件 `openKeys` 有更高的优先级。[#12361](https://github.com/ant-design/ant-design/pull/12361) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- `Upload` 组件相关
|
||||
- 🐞 修复 `Upload` 上传文件列表中的 `linkProps` ，支持 JSON 格式链接且可传入 `rel` 、`target` `title` 等属性。[efb23](https://github.com/ant-design/ant-design/commit/efb23c1525858114460bfe3bd5fcb18c9f236bdc)
|
||||
- 🐞 修复 `Upload` 组件多文件类型同时上传时，key 重复引用冲突的报错问题。[273fd](https://github.com/ant-design/ant-design/commit/273fd2ea1bca395d61509cc98c3ebbf1c620bf43)，[#10953](https://github.com/ant-design/ant-design/issues/10953)
|
||||
- 图标相关内容
|
||||
- 🐞 修复 `Upload` 组件关闭图标样式。[#12330](https://github.com/ant-design/ant-design/pull/12330) [#12304](https://github.com/ant-design/ant-design/issues/12304)
|
||||
- 🐞 修复 `Select` 组件清除图标。[#12196](https://github.com/ant-design/ant-design/pull/12196) [#12181](https://github.com/ant-design/ant-design/issues/12181)
|
||||
- 🐞 修复 `Icon` svg 对齐问题。[0698c](https://github.com/ant-design/ant-design/commit/0698c8217327224611d4be5fcfd149a355f1c08d)
|
||||
- 🐞 修复当 `Icon` 组件包含子组件时，`React.Children.only` 报错。[c21ff](https://github.com/ant-design/ant-design/commit/c21ff5251d1ff0f00d7f283dd377a7b13eec21ee)
|
||||
- 🐞 修复 `Notification` 组件没有描述时图标对齐问题。[e6579](https://github.com/ant-design/ant-design/commit/e657985cc35359fb813a2bd68be8c3afbe75c95a)
|
||||
- 🐞 修复 `Table` 组件的排序图标对齐问题。[c935d](https://github.com/ant-design/ant-design/commit/c935d53b713afb3ec314133d749ca4e29e0c1ee5)
|
||||
- TypeScript
|
||||
- 🐞 修复 `Message` 组件中 `MessageApi` 类型定义。[e82d7](https://github.com/ant-design/ant-design/commit/e82d7a9c095317d62b054fcf7c2d6666ba54660d)[#12137](https://github.com/ant-design/ant-design/issues/12137)
|
||||
- 🐞 修复 `Tree` onDrop 类型定义。[e5827](https://github.com/ant-design/ant-design/commit/e58273dccf59d58862e8bab0da36c7065e1c1044)[#12269](https://github.com/ant-design/ant-design/issues/12269)
|
||||
- 🐞 `TreeSelect` 组件中 `onChange` 方法中添加 `extra` 类型定义。[#12243](https://github.com/ant-design/ant-design/pull/12243)[@jardicc](https://github.com/jardicc)
|
||||
|
||||
## 3.9.2
|
||||
|
||||
`2018-09-08`
|
||||
|
||||
- 🐞 修复 `Card` 组件 `tab-card` 下嵌套 `Card` 导致标题边距偏窄的样式问题。[#12083](https://github.com/ant-design/ant-design/issues/12083)
|
||||
- 🐞 修复 `AutoComplete` 组件设置自定输入组件为 `TextArea` 时，手工调整高度的延迟问题。[#12117](https://github.com/ant-design/ant-design/issues/12117)
|
||||
- 🐞 修复 `Drawer` 组件 `maskStyle` 属性无效的问题。[#12125](https://github.com/ant-design/ant-design/pull/12125)[@ryerh](https://github.com/ryerh)
|
||||
- 🌟 `Popconfirm` 可以在 `onVisibleChange` 里判断是否触发自确定取消按钮。[#8614](https://github.com/ant-design/ant-design/issues/8614)
|
||||
- 🐞 修复 `Table` 组件固定头和列时，表头会出现滚动条的问题。[#6515](https://github.com/ant-design/ant-design/issues/6515)
|
||||
- 🐞 修复 `Spin` 组件设置 `delay` 时初始化仍会渲染的问题。[#12131](https://github.com/ant-design/ant-design/issues/12131)
|
||||
- 图标相关内容:
|
||||
- 🐞 修复 `Icon` 组件在 `popconfirm` 中位置不正确的问题。[#12080](https://github.com/ant-design/ant-design/issues/12080)
|
||||
- 🐞 添加 `Icon` 组件缺失的图标。[#121218](https://github.com/ant-design/ant-design/issues/121218)
|
||||
- 🐞 修复 `Select` 组件勾选缺失的图标问题。[#12054](https://github.com/ant-design/ant-design/issues/12054)
|
||||
- 🐞 修复 `TreeSelect` 组件删除图标与之前版本不同的问题。[#12124](https://github.com/ant-design/ant-design/issues/12124)
|
||||
|
||||
## 3.9.1
|
||||
|
||||
`2018-09-03`
|
||||
|
||||
- 🐞 修复 `Icon` 组件在被 `Tooltip` 组件包裹时，无法显示 `Tooltip` 内容的问题。[#12005](https://github.com/ant-design/ant-design/issues/12005)
|
||||
- 🐞 修复 `InputNumber` 组件的向上图标显示不正常的问题。[#12035](https://github.com/ant-design/ant-design/issues/12035)
|
||||
- 🐞 修复 `Modal` 组件的错误确认框不显示图标的问题。[#12026](https://github.com/ant-design/ant-design/issues/12026)
|
||||
- 🐞 修复 `Popconfirm` 组件中的图标显示位置不正确的问题。[#12026](https://github.com/ant-design/ant-design/issues/12026)
|
||||
- 🐞 修复 `Card` 组件中的 `Actions` 图标显示位置不正确的问题。[#12016](https://github.com/ant-design/ant-design/pull/12016)
|
||||
- 🐞 修复 `Form`、`Alert`、`TimePicker` 等组件图标主题风格不正确的问题。[#12016](https://github.com/ant-design/ant-design/pull/12016)
|
||||
- 🐞 修复 `Collapse` 组件中的 `header` 中的图标会顺时针旋转90度的问题。[#12016](https://github.com/ant-design/ant-design/pull/12016)
|
||||
- 🐞 修复在特定部署环境中，新旧图标会同时出现的问题。[#12016](https://github.com/ant-design/ant-design/pull/12016) [8b82f14](https://github.com/ant-design/ant-design/pull/12016/commits/8b82f143b6bd612e8ec7f1202dfd5f41127b025e)
|
||||
- 🐞 修复使用 `Icon.createFromIconFontCN({...})` 方法失效并报错的问题。[#12013](https://github.com/ant-design/ant-design/pull/12013)
|
||||
|
||||
## 3.9.0
|
||||
|
||||
`2018-09-02`
|
||||
|
||||
在开学之际我们带来了久违的 `3.9.0` 的更新。多个重量级的新特性和大量修复，使 Ant Design 的能力显著提升。
|
||||
|
||||
- 🔥🔥🔥 在 `3.9.0` 版本中，我们重绘了所有的图标，新增了两大类，超过 90 个新图标，并且为每个图标增加了多种风格。为此我们重写了 Icon 组件，使用 `SVG` 替换了 `fontface` 图标，增加了多个特性，可以快速的使用新的图标和风格。
|
||||
|
||||
- 💄 使用 `SVG` 图标替换了 `css` 字体图标，[可以看这里的讨论了解 svg 的优势](https://github.com/ant-design/ant-design/issues/10353)。
|
||||
- 💄 提供了三套图标风格线性、实色和双色图标，默认为线性风格。
|
||||
- 🌟 新增了 **编辑类** 和 **数据类** 两个新类别。
|
||||
- 🌟 新增 `theme` 属性，可以设置图标的主题风格。[#11971](https://github.com/ant-design/ant-design/pull/11971)
|
||||
- 🌟 新增 `component` 属性，可以外部传入一个组件来自定义控制渲染结果。[#11322](https://github.com/ant-design/ant-design/pull/11322)
|
||||
- 🌟 新增 `twoToneColor` 属性，可以控制双色图标的主题色。[#11971](https://github.com/ant-design/ant-design/pull/11971)
|
||||
- 🌟 新增静态方法 `Icon.getTowToneColor()` 和 `Icon.setTwoToneColor(...)`，可以全局性的获取和设置所有双色图标的主题色。[#11971](https://github.com/ant-design/ant-design/pull/11971)
|
||||
- 🌟 新增静态方法 `Icon.createFromIconfontCN({...})`，可以更加方便地使用 [`iconfont.cn`](http://iconfont.cn/) 上托管的图标。更多用法请参阅 [Ant Design Pro - 业务图标](https://pro.ant.design/docs/biz-icon-cn) 的介绍。[#11322](https://github.com/ant-design/ant-design/pull/11322)
|
||||
- 🔥 增加了一个新组件 [Skeleton](https://ant.design/components/skeleton-cn/)。
|
||||
- 🔥 Menu 在 `horizontal` 模式下会自动收起来适应宽度。
|
||||
- 🔥 Drawer 的 `placement` 支持 `top` 和 `bottom`，可以适应更多场景。
|
||||
|
||||
另外我们的 **Ant Design Pro 2.0.0** 也已同步发布，详细内容请看 [这里](https://www.yuque.com/ant-design/ant-design-pro/ant_design_pro_2.0_is_out)。
|
||||
|
||||
### 组件修复/功能增强：
|
||||
|
||||
- 🌟 新增 Modal.open 方法，用于可自定义图标的快捷对话框。[#11982](https://github.com/ant-design/ant-design/pull/11982) [@hsiehjack](https://github.com/hsiehjack)
|
||||
- 🌟 Modal.info 增加 `getContainer` 的配置。[#11377](https://github.com/ant-design/ant-design/issues/11377)
|
||||
- 🌟 合并优化了 RangePicker 的日历页脚 UI。
|
||||
- 🌟 Anchor 组件增加 `onClick` 属性。[#11898](https://github.com/ant-design/ant-design/pull/11898)
|
||||
- 🌟 Tab 组件增加 `renderTabBar` 属性。[#11856](https://github.com/ant-design/ant-design/pull/11856)
|
||||
- 🌟 Input 组件增加 `select` 方法。[#11906](https://github.com/ant-design/ant-design/pull/11906)
|
||||
- 🌟 Steps 增加 `initial` 属性。[#11180](https://github.com/ant-design/ant-design/issues/11180)
|
||||
- 🐞 修复 Steps 点状步骤条样式错位的问题。[7d59075](https://github.com/ant-design/ant-design/commit/7d5907500f5b1db59d30a17ef466271af3655fa2)
|
||||
- 🐞 修复在 Card 的 `headStyle` 中设置 fontSize 不生效的问题。[#11995](https://github.com/ant-design/ant-design/issues/11995)
|
||||
- 🐞 修复了 Button 组件波浪动画混淆的问题。[#11985](https://github.com/ant-design/ant-design/issues/11985)
|
||||
- 🐞 修复了 Modal.confirm 设置 `centered` 属性无效的问题。[#11969](https://github.com/ant-design/ant-design/issues/11969)
|
||||
- 🐞 修复了在 Input.Group 的 `compact` 模式下设置第二个 Input 的前后缀会造成右边框消失的问题。 [#11965](https://github.com/ant-design/ant-design/pull/11965)
|
||||
- 🐞 修复 Upload 组件上传图片较多时可能会造成图片错位的问题。[#11183](https://github.com/ant-design/ant-design/issues/11183)
|
||||
- 🐞 修复 MonthPicker `renderExtraFooter` 失效的问题。[#8184](https://github.com/ant-design/ant-design/issues/8184)
|
||||
|
||||
## 3.8.4
|
||||
|
||||
`2018-08-27`
|
||||
|
||||
- 🐞 修复 Tag 组件删除 tag 后会造成换行的问题。
|
||||
- 🐞 修复 Switch 单击时会产生 `Failed to execute 'removeChild' on 'Node'` 错误的问题。
|
||||
|
||||
## 3.8.3
|
||||
|
||||
`2018-08-26`
|
||||
|
||||
- 📖 重新编写了 [定制主题](https://ant.design/docs/react/customize-theme-cn) 文档，并提供了主要的 `Less` 变量说明。
|
||||
- 🐞 修复 Badge 组件动画出现位置不正确的问题。[#11870](https://github.com/ant-design/ant-design/issues/11870)
|
||||
- 🐞 修复 Cascader 组件在 IE 和 Edge 浏览器中浮层与数据列宽度不一致的问题。[#11857](https://github.com/ant-design/ant-design/issues/11857)
|
||||
- 🐞 修复 Checkbox 组件在 Windows Chrome 下样式模糊的问题。[#11797](https://github.com/ant-design/ant-design/issues/11797)
|
||||
- 🐞 修复 DatePicker.WeekPicker 组件的 `style` 属性无法生效的问题。[#11738](https://github.com/ant-design/ant-design/issues/11738)
|
||||
- 🐞 修复 Drawer 组件在多层状态下切换出现的背景闪烁的问题。[#11813](https://github.com/ant-design/ant-design/issues/11813)
|
||||
- 🐞 修复带有前缀或后缀的 Input.Group 组件在紧凑模式下右边框宽度过宽的问题。[#11863](https://github.com/ant-design/ant-design/issues/11863)
|
||||
- Menu
|
||||
- 🐞 修复子菜单之间存在间隙导致鼠标 hover 时菜单消失的问题。[#11725](https://github.com/ant-design/ant-design/issues/11725)
|
||||
- 🐞 修复当分组菜单包含了第一个菜单项，并且在菜单收起时出现错误的问题。[a52370](https://github.com/ant-design/ant-design/commit/a523706625bd695f44401579d980089292089dda) [@ohhoney1](https://github.com/ohhoney1)
|
||||
- 🐞 修复 Steps 组件中过长的 `description` 会被截断，无法完整展示的问题。[#11864](https://github.com/ant-design/ant-design/issues/11864)
|
||||
- 🐞 修复 Tooltip 组件在 `title` 过长时会将单词拆分到两行的问题。[#11722](https://github.com/ant-design/ant-design/issues/11722)
|
||||
- 🐞 修复 Tree 组件中的树节点无法接收自定义属性的问题。[#11423](https://github.com/ant-design/ant-design/issues/11423)
|
||||
- 🐞 修复 Upload.Dragger 组件的有效拖拽区域不匹配的问题。[#11869](https://github.com/ant-design/ant-design/issues/11869)
|
||||
|
||||
## 3.8.2
|
||||
|
||||
`2018-8-18`
|
||||
- 🐞 修复 Tag 组件 `visible` 属性初始值为 false 时仍然可见的问题。[#11757](https://github.com/ant-design/ant-design/issues/11757)
|
||||
- 🐞 修复 Modal 文本在双击打开的时候会被选中的问题。[#11777](https://github.com/ant-design/ant-design/issues/11777)
|
||||
- 🐞 修复 Rate 组件点击时的样式问题。[#11736](https://github.com/ant-design/ant-design/issues/11736)
|
||||
- 🐞 修复 Badge 组件在子元素为 `display:block` 时的样式问题。[#84119d8](https://github.com/ant-design/ant-design/commit/84119d8959d55edf535a9cac5ff532e61b6ee698)
|
||||
- Drawer
|
||||
- 🐞 修复 Drawer 组件不兼容 IE10 和 IE9 的问题。[#11583](https://github.com/ant-design/ant-design/issues/11583)
|
||||
- 🐞 修复 Drawer 组件在移动设备上无法垂直滚动的问题。 [#11443](https://github.com/ant-design/ant-design/issues/11443)
|
||||
- TypeScript
|
||||
- 🐞 修复 TreeNode 组件缺少的 `selectable` 属性定义。[#11604](https://github.com/ant-design/ant-design/issues/11604) [@apieceofbart](https://github.com/apieceofbart)
|
||||
- 🐞 修复 Input 组件缺失 `autosize` 属性的类型错误。[#11697](https://github.com/ant-design/ant-design/issues/11697)
|
||||
|
||||
## 3.8.1
|
||||
|
||||
`2018-08-12`
|
||||
|
||||
- 🐞 修复 TimePicker 面板输入框宽度过长的问题。[80f8267](https://github.com/ant-design/ant-design/commit/80f82674fb63b068d047651ccba772999139f1b7)
|
||||
- 🐞 修复 Tabs 中隐藏的输入框可能被聚焦的问题。[#11261](https://github.com/ant-design/ant-design/issues/11261)
|
||||
- 🐞 修复 Badge 组件属性 `offset` 的坐标设置顺序问题。[#11648](https://github.com/ant-design/ant-design/pull/11648) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- Upload
|
||||
- 🐞 修复 Upload 组件删除按钮可能不展示的问题。[#10454](https://github.com/ant-design/ant-design/issues/10454)
|
||||
- 🐞 修复 Upload 组件缩略图地址没有文件扩展名时的显示问题。[#11684](https://github.com/ant-design/ant-design/pull/11684) [@elantion](https://github.com/elantion)
|
||||
- 🐞 修复 Anchor 组件当 `affix=true` 时无法在滚动的窗口中固定的问题。[#11688](https://github.com/ant-design/ant-design/pull/11688) [@vitaliymaz](https://github.com/vitaliymaz)
|
||||
- 🐞 修复 List.Grid 组件中的卡片宽度问题。[!11712](https://github.com/ant-design/ant-design/issues/11712)
|
||||
- 🐞 修复 Radio 在 safari 下对齐的问题。[754a22c](https://github.com/ant-design/ant-design/commit/754a22ca24dee685666554778f53a5fe700959ff)
|
||||
- 💄 添加点击动画效果到组件 Switch, Radio.Button 和 Tag。[9cf6ae6](https://github.com/ant-design/ant-design/commit/9cf6ae601010acbf665d575d34c0cc0918e604e7)
|
||||
- TypeScript
|
||||
- 🐞 修复 Collapse 组件缺少的 `destroyInactivePanel` 定义。[#11646](https://github.com/ant-design/ant-design/pull/11646) [@zheeeng](https://github.com/zheeeng)
|
||||
- 💄 修复 AutoComplete 没有 `getPopupContainer` 属性定义的问题。[#11690](https://github.com/ant-design/ant-design/pull/11690) [@Huanghuiying0624](https://github.com/Huanghuiying0624)
|
||||
- 🐞 修复 Upload 组件的 `lastModifiedDate` 定义。[#11709](https://github.com/ant-design/ant-design/pull/11709) [@andycall](https://github.com/andycall)
|
||||
- 💄 使用新的 React 生命周期函数，包括组件 Upload, CheckboxGroup, Layout.Sider, Tooltip, Popconfirm。[#11666](https://github.com/ant-design/ant-design/pull/11666) [@dancerphil](https://github.com/dancerphil) [#11682](https://github.com/ant-design/ant-design/pull/11682) [@dancerphil](https://github.com/dancerphil)
|
||||
|
||||
## 3.8.0
|
||||
|
||||
`2018-08-05`
|
||||
|
||||
非常感谢在 3.8.0 上提交 PR 的 24 位贡献者！
|
||||
|
||||
- 💄 支持 TypeScript 3，并优化了大量组件定义。
|
||||
- 💄 使用 [font-variant-numeric](https://developer.mozilla.org/en-US/docs/Web/CSS/font-variant-numeric) 优化了等宽数字的实现方式，解决了数字字体和其他字体不一致的问题。[#11567](https://github.com/ant-design/ant-design/pull/11567) [@tibdex](https://github.com/tibdex)
|
||||
- 🌟 Timeline 现在支持左/右/交替三种布局形式。[#11490](https://github.com/ant-design/ant-design/pull/11490) [@jrvboesch](https://github.com/jrvboesch)
|
||||
- 🌟 Button 增加 `block` 属性用于撑满父容器宽度。[#11500](https://github.com/ant-design/ant-design/pull/11500) [@ilanus](https://github.com/ilanus)
|
||||
- Tree
|
||||
- 💄 优化了组件可访问性。
|
||||
- 🐞 修复一个拖拽后节点失踪的问题。[#11492](https://github.com/ant-design/ant-design/issues/11492)
|
||||
- 🐞 修复一个在拖拽后节点位置没有垂直居中的问题。[#11458](https://github.com/ant-design/ant-design/issues/11458)
|
||||
- Table
|
||||
- 🌟 新增 `rowSelection.columnTitle` 可以定制选择列的列标题。[#11042](https://github.com/ant-design/ant-design/issues/11042) [@littleLane](https://github.com/littleLane)
|
||||
- 💄 新增了一个[可拖拽改变列宽的例子](/components/table/#components-table-demo-resizable-column)。
|
||||
- 💄 支持按住 shift 进行多选。[#11404](https://github.com/ant-design/ant-design/issues/11404) [@RaphaelChauveau](https://github.com/RaphaelChauveau)
|
||||
- Avatar
|
||||
- 🌟 新增 `onError` 属性，作为图片加载失败时的回调。[#11285](https://github.com/ant-design/ant-design/pull/11285/) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- 🌟 新增 `size` 属性，方便自定义头像大小。[#11256](https://github.com/ant-design/ant-design/issues/11256) [@emersonlaurentino](https://github.com/emersonlaurentino)
|
||||
- 🌟 Card 新增 `headStyle` 属性用于定制标题样式。[#11407](https://github.com/ant-design/ant-design/pull/11407) [@emersonlaurentino](https://github.com/emersonlaurentino)
|
||||
- 🐞 修复 DatePicker 上无法使用 Tooltip 的问题。[#11451](https://github.com/ant-design/ant-design/issues/11451) [@yociduo](https://github.com/yociduo)
|
||||
- 🐞 修复 Input.Group 上无法使用 Tooltip 的问题。[#11532](https://github.com/ant-design/ant-design/issues/11532) [@yociduo](https://github.com/yociduo)
|
||||
- 🐞 修复一个 DatePicker 中时间面板 hover 时数字跳动的问题。[#11460](https://github.com/ant-design/ant-design/issues/11460)
|
||||
- 🐞 Tabs 修复了一个切换焦点异常的问题。[#11261](https://github.com/ant-design/ant-design/issues/11261)
|
||||
- Select
|
||||
- 🌟 支持 `data-*` 属性。
|
||||
- 🐞 修复一个选中项在列表中没有聚焦的问题。[#11268](https://github.com/ant-design/ant-design/issues/11268)
|
||||
- 🌟 Calendar 新增了 `onChange` 作为日期改变的回调。[#11476](https://github.com/ant-design/ant-design/pull/11476) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- 🌟 Popconfirm 新增 `icon` 支持自定义图标。[#11191](https://github.com/ant-design/ant-design/pull/11191) [@nuintun](https://github.com/nuintun)
|
||||
- Modal
|
||||
- 🌟 新增 `centered` 属性用于设置对话框垂直居中。[#11537](https://github.com/ant-design/ant-design/pull/11537) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 修复了多个对话框会被 ESC 一次性全部关掉的问题。[#11394](https://github.com/ant-design/ant-design/issues/11394) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 再次修复 Modal.confirm 的标题区域某些情况下会显示滚动条的问题。[#11568](https://github.com/ant-design/ant-design/pull/11568) [@cheshireoctopus](https://github.com/cheshireoctopus)
|
||||
- 🌟 Progress 新增 `strokeLinecap` 属性用于调整边缘形状。[#11547](https://github.com/ant-design/ant-design/pull/11547) [@blatinier](https://github.com/blatinier)
|
||||
- 🌟 Drawer 新增 `className` 并废弃 `wrapClassName`。[#11609](https://github.com/ant-design/ant-design/pull/11609) [@fergiar](https://github.com/fergiar)
|
||||
|
||||
## 3.7.3
|
||||
|
||||
`2018-07-28`
|
||||
|
||||
- 🐞 修复 Steps 在 `labelPlacement` 为 `vertical` 时标题与图标不对齐的问题。[#11426](https://github.com/ant-design/ant-design/pull/11426) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 修复 Cascader 设置 `fieldNames` 时不能正确读取子节点的问题。[#11311](https://github.com/ant-design/ant-design/pull/11311) [@405go](https://github.com/405go)
|
||||
- TypeScript
|
||||
- 🐞 修复 Pagination 类型定义。[#11474](https://github.com/ant-design/ant-design/pull/11474) [@kagd](https://github.com/kagd)
|
||||
- 🐞 修复 Select 类型定义。[#11189](https://github.com/ant-design/ant-design/pull/11189<Paste>) [@thisJJ](https://github.com/thisJJ)
|
||||
|
||||
## 3.7.2
|
||||
|
||||
`2018-07-25`
|
||||
|
||||
- DatePicker
|
||||
- 🐞 **修复在受控模式下不能切换年月的问题。**[b9992f4](https://github.com/ant-design/ant-design/commit/b9992f4a08574efb47b6e6cd80eb1e888b9a1ede)
|
||||
- 🐞 修复在 `getDerivedStateFromProp` 的警告。[#11398](https://github.com/ant-design/ant-design/pull/11398) [@yoyo837](https://github.com/yoyo837)
|
||||
- Drawer
|
||||
- 🐞 修复使用 `destroyOnClose` 时没有关闭动画的问题。[#11307](https://github.com/ant-design/ant-design/issues/11307)
|
||||
- 🐞 修复 `width` 以 `vw` 为单位时的显示错误。[#11326](https://github.com/ant-design/ant-design/issues/11326)
|
||||
- 🐞 修复 `wrapClassName` 属性无效的问题。
|
||||
- 🐞 修复 Tooltip 文字溢出的问题。[#11402](https://github.com/ant-design/ant-design/pull/11402) [@weidapao](https://github.com/weidapao)
|
||||
- 🐞 修复 Menu 在 `theme` 为 `dark` 是在 Layout.Header 里的样式问题。[#11400](https://github.com/ant-design/ant-design/pull/11400) [@hongxuWei](https://github.com/hongxuWei)
|
||||
- 🐞 修复 InputNumber 的箭头按钮在使用了固定列的 Table 里显示错位的问题。[#11408](https://github.com/ant-design/ant-design/issues/11408)
|
||||
- 🐞 修复 Select 使用分组时 Option 的圆角显示错误。[6cb6f5c](https://github.com/ant-design/ant-design/commit/6cb6f5c83ed634e67d5b5d0816d11aa0788a74d8)
|
||||
- 🐞 修复 Table 第一次点击过滤按钮的时候 `onChange` 会被触发两次的问题。[#11164](https://github.com/ant-design/ant-design/issues/11164) [@adybionka](https://github.com/adybionka)
|
||||
- 🐞 修复 Modal.confirm 的标题在 Firefox 下会显示滚动条的问题。[#11432](https://github.com/ant-design/ant-design/issues/11432)
|
||||
- TypeScript
|
||||
- 🐞 修复 Radio.Group 类型定义。[#11409](https://github.com/ant-design/ant-design/pull/11409) [@eddiemoore](https://github.com/eddiemoore)
|
||||
- 🐞 修复 TreeSelect 类型定义。[#11442](https://github.com/ant-design/ant-design/pull/11442) [@JribiBelhassen](https://github.com/JribiBelhassen)
|
||||
- 🐞 修复 Badge 类型定义。[#11421](https://github.com/ant-design/ant-design/pull/11421) [@zongzi531](https://github.com/zongzi531)
|
||||
|
||||
## 3.7.1
|
||||
|
||||
`2018-07-21`
|
||||
|
||||
- 🐞 修复 Drawer 内无法显示弹层组件的问题。[#11304](https://github.com/ant-design/ant-design/issues/11304)
|
||||
- 🐞 带页签的卡片页签支持 disabled 属性。[#11212](https://github.com/ant-design/ant-design/issues/11212)
|
||||
- 🐞 修复锚点链接组件 href 改变不更新的问题。 [#11287](https://github.com/ant-design/ant-design/pull/11287/files) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
- 🐞 修复 Menu 样式细节问题。[#11299](https://github.com/ant-design/ant-design/issues/11299)
|
||||
- 🐞 修复 Drawer 组件设置 `destroyOnClose` 后关闭动画消失。[#11307](https://github.com/ant-design/ant-design/issues/11307)
|
||||
- 🐞 修复 DirectoryTree 在 `expandedKeys` 属性可控时点击无法展开的问题。[#11366](https://github.com/ant-design/ant-design/issues/11366)
|
||||
- 🐞 修复 ButtonGroup 中使用 Tooltip 的 Button 在 `disabled` 时样式不正确的问题。[11321](https://github.com/ant-design/ant-design/pull/11321) [@tangjinzhou](https://github.com/tangjinzhou)
|
||||
|
||||
## 3.7.0
|
||||
|
||||
3.7.0 是一个重磅更新，带来了很多激动人心的变化和新特性。
|
||||
以下是一些亮点✨：
|
||||
|
||||
- 🔥 增加抽屉组件 : [`Drawer`](https://ant.design/components/drawer-cn/) [#10791](https://github.com/ant-design/ant-design/pull/10791)
|
||||
- 🔥 新增 `Tree.DirectoryTree` 组件，作为内置的目录树。[#7749](https://github.com/ant-design/ant-design/issues/7749)
|
||||
|
||||
组件修复/功能增强：
|
||||
|
||||
- TreeSelect 组件升级 `rc-tree-select` 到 `2.0.5`，进行了重构，修复了 check 的逻辑。
|
||||
- 🌟 新增 `autoClearSearchValue` 属性，当多选模式下值被选择，用于自动清空搜索框。[10996](https://github.com/ant-design/ant-design/issues/10996)
|
||||
- 🌟 新增 `searchValue` 属性，用于设置搜索框的值。[6ff7dd8](https://github.com/ant-design/ant-design/commit/6ff7dd8fb953f079ee51ee638aaf4d832d0e10bf#diff-1e8e47abbdbe6e12d009aa61619ab22f)
|
||||
- 🌟 新增 `maxTagCount` 属性，用于设置显示标签的最大数量。[fb96c9d](https://github.com/ant-design/ant-design/commit/fb96c9db351e44a202f64f780470c6319a8a9626)
|
||||
- 🌟 新增 `maxTagPlaceholder` 属性，用于设置标签隐藏时显示的内容。[fb96c9d](https://github.com/ant-design/ant-design/commit/fb96c9db351e44a202f64f780470c6319a8a9626)
|
||||
- 🌟 搜索框支持大小写敏感。[#10990](https://github.com/ant-design/ant-design/issues/10990)
|
||||
- 🗑 `treeData` 数据格式中的 `label` 属性被废弃，使用 `title` 属性代替。
|
||||
- Upload 组件升级 `rc-upload` 到 `2.5.0`
|
||||
- 🌟 新增 `directory` 属性，支持上传一个文件夹。[#7315](https://github.com/ant-design/ant-design/issues/7315)
|
||||
- 🌟 `action` 属性支持作为一个返回 `Promise` 对象的函数，使用更加灵活。[fd96967](https://github.com/ant-design/ant-design/commit/fd96967c872600b79bb608e9ddf9f8c38814a704)
|
||||
- Dropdown 增加新特性，可以做为右键菜单来使用。
|
||||
- 🌟 给菜单项的 icon 提供默认的外间距样式。[8e60a59](https://github.com/ant-design/ant-design/commit/8e60a591fd24f644de4f67d69c2210e9270be9cc)
|
||||
- 🌟 触发方式为 `contextMenu` 时自动调整菜单的位置。[16e4260](https://github.com/ant-design/ant-design/commit/16e42601d6772fc0830ee237a1e751a38a118676)
|
||||
- Table 组件升级 `rc-table` 到 `6.2.2`。[f2fddff](https://github.com/ant-design/ant-design/commit/f2fddff3fd0d6b36e8e6d8ee06bfcbcc85ead4f0)
|
||||
- 🌟 新增 `expanded` 作为 `expandedRowRender` 属性函数的第四个参数，用于获取当前行是否展开。[#10379](https://github.com/ant-design/ant-design/issues/10379)
|
||||
- 🌟 新增无须使用完全受控组件也能覆盖筛选菜单的能力。[59cc3a8](https://github.com/ant-design/ant-design/commit/59cc3a8b6c643f7206feedf2dc2c7154296ba3e3) [@chrvadala](https://github.com/chrvadala)
|
||||
- 🌟 `filterIcon` 属性支持作为一个返回 `ReactNode` 的函数。[1af4392](https://github.com/ant-design/ant-design/commit/1af4392ae9fbdaa6fcfbf2f0de5413100ef4a84a)
|
||||
- 🐞 修复在固定列时导致的行错位的问题。[#10392](https://github.com/ant-design/ant-design/issues/10392)
|
||||
- 🐞 修复在组件中使用 `combobox` 模式的 `Select` 导致的重影问题。[#10828](https://github.com/ant-design/ant-design/issues/10828)
|
||||
- 🐞 修复 components 属性值不能变化的问题。[c380186](https://github.com/ant-design/ant-design/commit/c380186e794a7735ae91e992f25a313158ee4984)
|
||||
- 🗑 Select 组件废弃了 `combobox` 模式，请使用 `AutoComplete` 组件代替。[53046a4](https://github.com/ant-design/ant-design/commit/53046a454ad83ca03dc313e63f56474ed1173002)
|
||||
- 🌟 Alert 组件允许传递 `data-*`、`aria-*` 和 `role-*` 属性到组件内部。[f0b684d](https://github.com/ant-design/ant-design/commit/f0b684de6a7c422f0de56e1ef72aeb35ab25a858)
|
||||
- 🌟 Avatar 组件新增 `alt` 属性，用于设置图像无法显示时的替代文本。[#10798](https://github.com/ant-design/ant-design/pull/10798)
|
||||
- 🌟 DatePicker 组件允许传递 `data-*`、`aria-*` 和 `role-*` 属性到组件内部的 `Input`。[e63f9d4](https://github.com/ant-design/ant-design/commit/e63f9d4beb440de92c0b0ce8e6e83f7e24fef792)
|
||||
- 🌟 Input.Search 组件新增 `event` 事件对象作为 `onSearch` 属性函数的第二个参数。[#11015](https://github.com/ant-design/ant-design/issues/11015)
|
||||
- 🌟 Layout.Sider 组件新增 `onBreakPoint` 属性，用作响应式布局的断点触发时的回调函数。[#10750](https://github.com/ant-design/ant-design/pull/10750) [@nuintun](https://github.com/nuintun)
|
||||
- 🌟 Modal 组件新增 `okButtonProps` 和 `cancelButtonProps` 属性，分别用于设置 `取消` 按钮和 `确定` 按钮的属性。[#10955](https://github.com/ant-design/ant-design/pull/10955) [@djyde](https://github.com/djyde)
|
||||
- 🌟 Progress 组件新增 `strokeColor` 属性，用于设置进度条的颜色。[#10725](https://github.com/ant-design/ant-design/issues/10725)
|
||||
- 🌟 Radio.Group 组件新增 `buttonStyle` 属性 (可选值 `outline | solid`)，用于设置 `RadioButton` 的风格样式。[60e3cfa](https://github.com/ant-design/ant-design/commit/60e3cfa37ac0dae3a895e74c1fe5351c54536a07#diff-c2ee8b5a368a121e9d2cc2661212045d)
|
||||
- 🌟 Spin 组件新增 `setDefaultIndicator` 静态方法，用于设置全局的加载指示符。[#10787](https://github.com/ant-design/ant-design/issues/10787)
|
||||
- 🌟 Tag 组件新增 `visible` 属性，用于设置是否显示标签。[4ac0277](https://github.com/ant-design/ant-design/commit/4ac027781372dda08a5458bc73836fbc14dfe51f)
|
||||
- Tree 组件升级 `rc-tree` 到 `1.12.0`
|
||||
- 🌟 新增 `loadedKeys` 属性，用于设置已经加载的节点，需要配合 `loadData` 使用。[#10666](https://github.com/ant-design/ant-design/issues/10666)
|
||||
- 🌟 新增 `onLoad` 属性，作为节点加载完毕时的回调函数。[c488aca](https://github.com/ant-design/ant-design/commit/c488aca05e11d942d77c1b6bff45d12bbb1a2bd6)
|
||||
- 🌟 增加 `okButtonDisabled` and `cancelButtonDisabled` 属性用于禁用确定和取消按钮。[#10955](https://github.com/ant-design/ant-design/pull/10955)
|
||||
- 🌟 Cascader 新增 fieldNames 并废弃拼写错误的 filedNames。 [#10896](https://github.com/ant-design/ant-design/issues/10896)
|
||||
- 🐞 修复时间轴不能与`Tooltip`一起使用的问题。 [0e3b67e](https://github.com/ant-design/ant-design/commit/0e3b67e9999d867cc304f3be61a8a042a2ab92ee)
|
||||
- 🐞 修复当 Avatar 自定义大小时，圆角不改变的问题。[e1e6523](https://github.com/ant-design/ant-design/commit/e1e6523452286ba56f20b73abad762a58ea7d7bc)
|
||||
|
||||
## 3.6.6
|
||||
|
||||
`2018-07-07`
|
||||
|
||||
- 🐞 修复 `DatePicker` 组件被选中日期的样式问题。[#6146](https://github.com/ant-design/ant-design/issues/6146) [#9529](https://github.com/ant-design/ant-design/issues/9529)
|
||||
- 🐞 修复 `DatePicker.RangePicker` 组件中被选中日期的样式问题。[004561b](https://github.com/ant-design/ant-design/commit/004561ba1f3b894dc164225e9e27b0a90679d15c)
|
||||
- 🐞 修复 `Cascader` 组件在 `Form.Item` 下的对齐问题。[#9827](https://github.com/ant-design/ant-design/issues/9827) [#11133](https://github.com/ant-design/ant-design/issues/11133)
|
||||
- 🐞 修复 `InputNumber` 组件的 `handler` 的背景样式问题。[4aabc53](https://github.com/ant-design/ant-design/commit/4aabc5374497359e13a958ef81ae4569db6164a7)
|
||||
- 🐞 修复 `Table` 组件在 `FireFox` 浏览器下数据为空时的头部溢出的样式问题。[#11135](https://github.com/ant-design/ant-design/issues/11135)
|
||||
|
||||
## 3.6.5
|
||||
|
||||
`2018-07-02`
|
||||
|
||||
- 🐞 修复 `Transfer` 组件的文本 "Not Found" 在 IE 或 Edge 浏览器上显示异常。[#9697](https://github.com/ant-design/ant-design/issues/9697)
|
||||
- 🐞 修复 Chrome 在缩放模式下，`Card` 组件的边框被标题的背景色覆盖。[#9085](https://github.com/ant-design/ant-design/issues/9085)
|
||||
- TypeScript
|
||||
- 🐞 修复 `Table` 不兼容的类型 `size`。[bf5b6ae1](https://github.com/ant-design/ant-design/commit/bf5b6ae1f3b5da4629a7d10a2d1764eaa3fbbb04)
|
||||
- 🐞 修复 `Select` 组件的 `showArrow` 类型定义。[cde2a6b6](https://github.com/ant-design/ant-design/commit/cde2a6b6f011a5b3a367b3f58731def547bc98d8)
|
||||
- 🐞 修复 Pagination 全局 locale 设置不能被组件 locale 覆盖的问题。[babbbdd4](https://github.com/ant-design/ant-design/commit/babbbdd4e5c33ca050f8ee08969185c8d3269b4c)
|
||||
- 🐞 修复 `Tooltip` 组件的 `max-width` 样式，使 `overlayStyle.maxWidth` 可覆盖。[e2b359e9](https://github.com/ant-design/ant-design/commit/e2b359e9c3dae067eeba37a886f7896474c87e31)
|
||||
- 🐞 修复 `Select` 组件的样式，避免过长文本的溢出。[#11035](https://github.com/ant-design/ant-design/issues/11035)
|
||||
|
||||
## 3.6.4
|
||||
|
||||
`2018-06-23`
|
||||
|
||||
- 🐞 修复 `Steps` 组件的 `@process-icon-color` 样式定义。[#10973](https://github.com/ant-design/ant-design/issues/10973)
|
||||
- 🐞 修复 `RangePicker` 组件使用预置范围时的样式问题。[#10986]
|
||||
(https://github.com/ant-design/ant-design/issues/10986)
|
||||
- 🐞 修复 `Dropdown` 组件可能报出的 `non-boolean attribute` 的警告。[#7798](https://github.com/ant-design/ant-design/issues/7798)
|
||||
- TypeScript
|
||||
- 🌟 给 `Tree` 组件添加 `className` 的定义。[#10950](https://github.com/ant-design/ant-design/issues/10950)
|
||||
- 🌟 给 `Tree` 组件添加 `selectable` 的定义。[3fb478e](https://github.com/ant-design/ant-design/commit/3fb478e743f3bad23dc300f501df11e5423468ba)
|
||||
|
||||
## 3.6.3
|
||||
|
||||
`2018-06-17`
|
||||
|
||||
- 🐞 修复 Upload 图片文件后缀名为大写时无法正确识别的问题。[#10928](https://github.com/ant-design/ant-design/pull/10928) [@sliwey](https://github.com/sliwey)
|
||||
- 🐞 修复 InputNumber 在浏览器缩放时边框样式丢失的问题。[#10562](https://github.com/ant-design/ant-design/issues/10562)
|
||||
- 🐞 修复 Spin 内使用 `position: fixed` 的元素无法固定的问题。[#10196](https://github.com/ant-design/ant-design/issues/10196)
|
||||
- 🐞 修复小号表格下固定列的边框样式问题。[#9754](https://github.com/ant-design/ant-design/issues/9754)
|
||||
- 🐞 修复 Table `filterIcon` 的 `className` 属性失效的问题。[#10937](https://github.com/ant-design/ant-design/issues/10937)
|
||||
- 🐞 修复 Affix 的 `offsetTop` 和 `offsetBottom` 无法动态修改的问题。[#10874](https://github.com/ant-design/ant-design/issues/10874)
|
||||
- TypeScript
|
||||
- 🐞 修复 TreeSelect `TS2339` 错误。[#10868](https://github.com/ant-design/ant-design/issues/10868)
|
||||
- 🌟 补充 Form 的 `validateMessages` 和 `onFieldsChange` 参数的定义。
|
||||
- 🌟 优化 Button 的属性定义。[#10877](https://github.com/ant-design/ant-design/pull/10877) [@zheeeng](https://github.com/zheeeng)
|
||||
- 🌟 补充 AutoComplete 的 `backfill` 属性定义。[#10909](https://github.com/ant-design/ant-design/pull/10909) [@zhanba](https://github.com/zhanba)
|
||||
|
||||
## 3.6.2
|
||||
|
||||
`2018-06-09`
|
||||
|
||||
- 🐞 修复 Table 数据变化时全选勾选框状态显示不正确的问题。[#10629](https://github.com/ant-design/ant-design/issues/10629)
|
||||
- 🐞 修复 Button.Group 中使用 disabled 按钮时缺失边框。
|
||||
- 🐞 修复 Upload 中 `beforeUpload` 返回 `false` 时，文件列表排序会被反转的问题。[#10681](https://github.com/ant-design/ant-design/issues/10681)
|
||||
- 🐞 修复 Calendar 表格中内容溢出的问题。[#10808](https://github.com/ant-design/ant-design/pull/10808) [@Yangzhedi](https://github.com/ant-design/Yangzhedi)
|
||||
- Spin
|
||||
- 🐞 修复使用图标时不能按照 `size` 正确显示大小的问题。[#10786](https://github.com/ant-design/ant-design/issues/10786)
|
||||
- 🐞 修复默认旋转时 `delay` 不生效的问题。[#10727](https://github.com/ant-design/ant-design/pull/10727) [@dreamerblue](https://github.com/dreamerblue)
|
||||
- 修复 Badge 的状态色不跟主题色变化的问题。
|
||||
- TypeScript
|
||||
- 🐞 修复 Menu 类型定义。[#10773](https://github.com/ant-design/ant-design/issues/10773)
|
||||
- 🐞 修复 AutoComplete 类型定义。[#10745](https://github.com/ant-design/ant-design/issues/10745) [#10619](https://github.com/ant-design/ant-design/issues/10619)
|
||||
- 🐞 修复 Tree 类型定义。[#10841](https://github.com/ant-design/ant-design/pull/10841) [@Voronar](https://github.com/Voronar)
|
||||
- 🐞 修复 Checkbox.Group 的类型定义。[#10677](https://github.com/ant-design/ant-design/pull/10677)
|
||||
|
||||
## 3.6.0
|
||||
|
||||
`2018-06-02`
|
||||
|
||||
* 🌟 `Form` 表单错误信息展示支持传入 ReactNode。 [#10136](https://github.com/ant-design/ant-design/issues/10136) [@lovekonakona](https://github.com/lovekonakona)
|
||||
* 🌟 `List` 组件支持指定分页器的位置。 [#10581](https://github.com/ant-design/ant-design/pull/10581) [@zheeeng](https://github.com/zheeeng)
|
||||
* 🌟 `Layout.Sider` 支持 dark/light 主题定制。 [#10142](https://github.com/ant-design/ant-design/issues/10142) [@pd4d10](https://github.com/pd4d10)
|
||||
* 🌟 支持 Ant Design 站点的离线模式。 [#10625](https://github.com/ant-design/ant-design/issues/10625)
|
||||
* 🌟 `Transfer` 新增 `style` 以及 `operationStyle` 属性配置样式。 [@eduludi](https://github.com/eduludi)
|
||||
* 🌟 `Message` 增加 promise 化的回调接口。 [#10421](https://github.com/ant-design/ant-design/issues/10421) [@zhujinxuan](https://github.com/zhujinxuan)
|
||||
* 🐞 修复编译时 typescript v2.9.1兼容性问题。 [#10729](https://github.com/ant-design/ant-design/issues/10729) [@karol-majewski](https://github.com/karol-majewski)
|
||||
* 🐞 修复 `Menu` 嵌套超过两层时选中最里层后对应最外层没有亮起问题。 [#8666](https://github.com/ant-design/ant-design/issues/8666) [@stonehank](https://github.com/stonehank)
|
||||
* 🐞 修复 `Affix` 组件 offsetBottom 无效问题。 [#10674](https://github.com/ant-design/ant-design/issues/10674)
|
||||
|
||||
## 3.5.4
|
||||
|
||||
`2018-05-26`
|
||||
|
||||
- 🐞 修复 `Cascader` 的 `showSearch` 无效问题。[968488a2](https://github.com/ant-design/ant-design/commit/968488a2fac9bcb16bee9f0c248f49bca00dbec6)
|
||||
- 🐞 使 `Badge[status]` 支持 `Tooltip`。[#10626](https://github.com/ant-design/ant-design/issues/10626)
|
||||
- 🐞 修复父元素使用 `text-align` 会影响 `Spin` 的问题。[#10643](https://github.com/ant-design/ant-design/pull/10643) [@wmzhong](https://github.com/wmzhong)
|
||||
- 💄 `Table` 换行从 `break-all` 改为 `break-word`。[#10655](https://github.com/ant-design/ant-design/pull/10655) [@clinyong](https://github.com/clinyong)
|
||||
- 🌟 `Search` 在未定义 `enterButton` 时，点击搜索图标将触发 `onSearch`。[36ffe7e1](https://github.com/ant-design/ant-design/commit/36ffe7e1dc9d9473c8c68168ab79b7a03a604702)
|
||||
|
||||
## 3.5.3
|
||||
|
||||
`2018-05-20`
|
||||
|
||||
- 🐞 修复了 `Affix` 当 `offsetTop === 0`，值将变为 `undefined` 的问题 [#10566](https://github.com/ant-design/ant-design/pull/10566)
|
||||
- 🐞 修复了 `Menu` item 中的高亮链接颜色问题 [09d5e36](https://github.com/ant-design/ant-design/commit/09d5e36cfa27e371a7b4d4e68276a279698ea901)
|
||||
- 🐞 修复了 `Input.Group` 组件阴影被遮盖的问题 [#10230](https://github.com/ant-design/ant-design/issues/10230)
|
||||
- 🐞 修复了 `Transfer` 组件 checkbox 事件触发两次的问题 [`#10480`](https://github.com/ant-design/ant-design/issues/10480)
|
||||
- 💄 统一 less 的变量命名 [12d3046](https://github.com/ant-design/ant-design/commit/12d3046687a0dcdb51fece08dd2bea64f185cc40)
|
||||
- 💄 微调了 `Dropdown` 的样式 [8e2f72f](https://github.com/ant-design/ant-design/commit/8e2f72ffe0eb300f5997296726b02246bf990c8f)
|
||||
- 💄 现在中文文档的组件会用中文语言包进行演示。[9b17a94](https://github.com/ant-design/ant-design/commit/9b17a943f5d57d40d65041b7b0c247add09d2851)
|
||||
- 💄 主站主题切换 修改为 `antd-theme-generato` ，感谢 [@mzohaibqc](https://github.com/mzohaibqc) 的工作.
|
||||
- TypeScript
|
||||
- 🐞 修复了 `Row` 中 gutter 属性的类型问题 [b7d508e](https://github.com/ant-design/ant-design/commit/b7d508e1662bf20a0cacbe6440a2ce31a65a8a59)
|
||||
- 💄 改进了 `Form` 组件类型 [#10564](https://github.com/ant-design/ant-design/pull/10564)
|
||||
- 💄 改进了 `Button` 和 `Tag` 类型 [1ed9fed](https://github.com/ant-design/ant-design/commit/1ed9fed2cf1c99b947359fafb101b2e58213cb48)
|
||||
|
||||
## 3.5.2
|
||||
|
||||
`2018-05-13`
|
||||
|
||||
- 🐞 修复 `Table` 过滤器和 `Transfer` 复选框无法点击的问题。[#10452](https://github.com/ant-design/ant-design/issues/10452)
|
||||
- 🐞 修复 `Cascader` 的 `displayRender` 里的链接无法点击的问题。[#10433](https://github.com/ant-design/ant-design/issues/10433)
|
||||
- 🐞 修复 `Button` ref 不兼容问题。[#10405](https://github.com/ant-design/ant-design/issues/10405)
|
||||
- 🐞 修复 `Form` 表单项校验位置高度时出现抖动问题。[#10445](https://github.com/ant-design/ant-design/issues/10445)
|
||||
- 🌟 设置 `Layout` 宽度时，允许使用任何的 CSS 单位。 [#10479](https://github.com/ant-design/ant-design/pull/10479)
|
||||
|
||||
## 3.5.1
|
||||
|
||||
`2018-05-09`
|
||||
|
||||
- 🐞 修复 Input.Group 在 Form 下样式错位的问题。[#10371](https://github.com/ant-design/ant-design/issues/10371)
|
||||
- 🐞 修复 Select 箭头和内容重叠的问题。[#10383](https://github.com/ant-design/ant-design/issues/10383)
|
||||
- 🐞 移除 Collapse 点击时的 focus 样式。
|
||||
- 🐞 移除 Input.Group 和 Checkbox 不必要的 `z-index`。[#9840](https://github.com/ant-design/ant-design/issues/9840) [#10385](https://github.com/ant-design/ant-design/issues/10385)
|
||||
- 🐞 修复一个数字等宽字体没有加粗的问题。
|
||||
- Table
|
||||
- 💄 重写了可编辑表格的演示。[#10119](https://github.com/ant-design/ant-design/pull/10119)
|
||||
- 🐞 修复一个表格列内容互相重叠的问题。[#9822](https://github.com/ant-design/ant-design/issues/9822)
|
||||
- TypeScript
|
||||
- 🐞 调整 Breadcrumb.Item 的类型。[#10372](https://github.com/ant-design/ant-design/pull/10372) [@karol-majewski](https://github.com/karol-majewski)
|
||||
- 🐞 修复 Table 的 `rowSelection` 的类型。[#10374](https://github.com/ant-design/ant-design/issues/10374)
|
||||
|
||||
## 3.5.0
|
||||
|
||||
`2018-05-04`
|
||||
|
||||
- 🌟 组件 `Badge` 新增 `title` 属性支持鼠标 hover 的时候显示。[74d81c2](https://github.com/ant-design/ant-design/commit/74d81c2d078a3c84b3e44cbfbdd99b8f479ea71d) [@ludwigbacklund](https://github.com/ludwigbacklund)
|
||||
- 🌟 添加 `successPercent` 为 `Progress[format]` 的参数。[#10096](https://github.com/ant-design/ant-design/issues/10096)
|
||||
- 🌟 更新 `rc-notification` 到 3.1.0 来支持组件 `Notification` 的 `maxCount` 属性。[#10161](https://github.com/ant-design/ant-design/pull/10161) [@jzhangs](https://github.com/jzhangs)
|
||||
- 🌟 更新 `rc-cascader` 到 1.13.0 来支持组件 `Cascader` 的 `filedNames` 属性。[react-component/cascader#23](https://github.com/react-component/cascader/pull/23) [@405go](https://github.com/405go)
|
||||
- 🌟 组件 `Notification` 支持通过 key 更新通知属性。 [react-component/notification#40](https://github.com/react-component/notification/pull/40) [@yevhen-hryhorevskyi](https://github.com/yevhen-hryhorevskyi)
|
||||
- 🌟 组件 `List` 支持内置的翻页功能。[#10135](https://github.com/ant-design/ant-design/pull/10135)
|
||||
- Table
|
||||
- 🌟 新增 `sortOrder` 参数传递给列配置中的 `sorter` 方法。[#10306](https://github.com/ant-design/ant-design/pull/10306) [@kumarashwin](https://github.com/kumarashwin)
|
||||
- 🐞 修复头部单元格的边框样式问题。[#10359](https://github.com/ant-design/ant-design/issues/10359)
|
||||
- 🐞 修复当数据变化时用户选择项丢失的问题。[#10332](https://github.com/ant-design/ant-design/pull/10332) [@chrvadala](https://github.com/chrvadala)
|
||||
- `Menu` 升级 `rc-menu` 到 `7.x` [#10305](https://github.com/ant-design/ant-design/pull/10305)
|
||||
- 🌟 更好的 aria-* 属性支持。[react-component/menu#137](https://github.com/react-component/menu/pull/137)
|
||||
- 🌟 一些内部优化提升组件性能。[react-component/menu#133](https://github.com/react-component/menu/pull/133)
|
||||
- 🌟 支持将属性传递到菜单项中。[react-component/menu#135](https://github.com/react-component/menu/pull/135)
|
||||
- 🐞 修复一些快捷键的问题。[react-component/menu#132](https://github.com/react-component/menu/pull/132)
|
||||
- Collapse
|
||||
- 🌟 更新 `rc-collapse` 到 1.9.0 优化键盘支持。[react-component/collapse#84](https://github.com/react-component/collapse/pull/84/) [@kossel](https://github.com/kossel)
|
||||
- 🌟 支持通过 less 定义组件 `Collapse` 的样式。[#9943](https://github.com/ant-design/ant-design/pull/9943) [@davidhatten](https://github.com/davidhatten)
|
||||
- Select
|
||||
- 🐞 修复 `placeholder` 的 ts 类型问题。[#10282](https://github.com/ant-design/ant-design/pull/10282) [@thomasthiebaud](https://github.com/thomasthiebaud)
|
||||
- 🐞 修复不显示箭头时多余的空白。[#10296](https://github.com/ant-design/ant-design/pull/10296)
|
||||
- 🐞 修复属性 `value` 的 typescript 类型错误。[#10336](https://github.com/ant-design/ant-design/pull/10336) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- Input
|
||||
- 🐞 修复 `Input.Search` 当 disabled 为 true 时按钮没有被禁用的问题。[#10040](https://github.com/ant-design/ant-design/issues/10040)
|
||||
- 🐞 修复 `Input.Group` 在表单中对齐的问题。[#10281](https://github.com/ant-design/ant-design/issues/10281)
|
||||
- Form
|
||||
- 🐞 修复 `Form.onValuesChange` 的 ts 类型错误。[#10231](https://github.com/ant-design/ant-design/pull/10231) [@whtsky](https://github.com/whtsky)
|
||||
- 🐞 修复 `ComponentDecorator` typescript 定义的错误。[#10324](https://github.com/ant-design/ant-design/pull/10324) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- 🐞 修复 `Divider` 为 dashed 时的样式问题。[#10216](https://github.com/ant-design/ant-design/issues/10216)
|
||||
- 🐞 修复 `Spin` 覆盖层的展示问题。[#10227](https://github.com/ant-design/ant-design/issues/10227)
|
||||
- 🐞 修复 `Notification` 鼠标 hover 是图标的颜色问题。[#10272](https://github.com/ant-design/ant-design/issues/10272)
|
||||
- 🐞 修复 `Upload` 组件属性 `lastModifiedDate` 的拼写错误。[#10315](https://github.com/ant-design/ant-design/pull/10315) [@danielg2002](https://github.com/danielg2002)
|
||||
- 🐞 修复 `Button` 的属性类型，使用 `React.HTMLProps`。[#10229](https://github.com/ant-design/ant-design/pull/10229) [@whtsky](https://github.com/whtsky)
|
||||
- 🐞 修复 less 命名约定不一致的问题。 [#10275](https://github.com/ant-design/ant-design/issues/10275)
|
||||
|
||||
## 3.4.5
|
||||
|
||||
`2018-05-03`
|
||||
|
||||
- 🐞 修复 Upload 上传文件名不展示（file 对象属性为空）的问题。[#10319](https://github.com/ant-design/ant-design/issues/10319)
|
||||
|
||||
## 3.4.4
|
||||
|
||||
`2018-04-28`
|
||||
@@ -779,7 +156,7 @@ timeline: true
|
||||
- 🌟 添加 `Pagination` 字体变量。 [#9351](https://github.com/ant-design/ant-design/issues/9351)
|
||||
- 🌟 添加 `Badge` 字重变量。 [#9352](https://github.com/ant-design/ant-design/issues/9352)
|
||||
- 🐞 修复 `Table` 当自定义 `loading.indicator` 时，不显示emptyText。 [#9355](https://github.com/ant-design/ant-design/issues/9355)
|
||||
- 🐞 修复 `Form.create` 。[#9331](https://github.com/ant-design/ant-design/issues/9331)
|
||||
- 🐞 修复 `Form.create` 。 [#9331](https://github.com/ant-design/ant-design/issues/9331)
|
||||
- 🐞 回滚 `Table` 中 `column.dataIndex` 的 TypeScript 定义。 [#9393](https://github.com/ant-design/ant-design/issues/9393)
|
||||
- 🐞 修复 `Layout` 中 sider 高度不足时，最后一个菜单无法显示。 [#9398](https://github.com/ant-design/ant-design/issues/9398) [@MJ111](https://github.com/MJ111)
|
||||
- 🐞 修复 `Badge` dot 模式问题。 [#9359](https://github.com/ant-design/ant-design/issues/9359) [@khayalan-mathew](https://github.com/khayalan-mathew)
|
||||
@@ -926,7 +303,7 @@ timeline: true
|
||||
- 🐞 修复 Table 在设置 `size=small` 的情况下出现多余 padding 的问题。[#8724](https://github.com/ant-design/ant-design/issues/8724)
|
||||
- 🐞 修复 Checkbox.Group 在 Form 中和 label 的对齐问题。[#8739](https://github.com/ant-design/ant-design/issues/8739)
|
||||
- 🐞 修复 Affix 组件出现滚动条的问题。[#8606](https://github.com/ant-design/ant-design/issues/8606)
|
||||
- 🐞 修复组件 List "No Data" 和加载动画重叠的问题。[#8647](https://github.com/ant-design/ant-design/issues/8647)
|
||||
- 🐞 修复组件 List "No Data" 和加载动画重叠的问题. [#8647](https://github.com/ant-design/ant-design/issues/8647)
|
||||
- 🌟 为 Input 添加 onKeyUp。[#8705](https://github.com/ant-design/ant-design/issues/8705) [@delesseps](https://github.com/delesseps)
|
||||
- 🌟 折叠面板 Collapse 添加 `showArrow` 来支持隐藏箭头。[#8536](https://github.com/ant-design/ant-design/pull/8536) [@apieceofbart](https://github.com/apieceofbart)
|
||||
- 🌟 评分 Rate 组件添加 `allowClear`，支持再次点击后重置。[#8627](https://github.com/ant-design/ant-design/issues/8627)
|
||||
@@ -994,11 +371,11 @@ timeline: true
|
||||
|
||||
`2017-12-04`
|
||||
|
||||
更多内容见 [Ant Design 3.0 发布公告](https://medium.com/ant-design/announcing-ant-design-3-0-70e3e65eca0c)。
|
||||
更多内容见 [Ant Design 3.0 发布公告](https://medium.com/ant-design/announcing-ant-design-3-0-70e3e65eca0c)！
|
||||
|
||||
### 主要变化
|
||||
|
||||
- 全新的[色彩系统](https://ant.design/docs/spec/colors-cn#Color-Palettes)，组件主色由『`#108EE9`』改为『`#1890FF`』，新主色我们称之为『拂晓蓝』。
|
||||
- 全新的[色彩系统](https://ant.design/docs/spec/colors-cn#Color-Palettes)，组件主色由 『`#108EE9`』 改为 『`#1890FF`』，新主色我们称之为『拂晓蓝』。
|
||||
- 全新的视觉样式和组件尺寸，更现代更美观。
|
||||
- 基础字体大小由 `12px` 增大到 `14px`。
|
||||
- 默认语言由中文改为英文。
|
||||
@@ -1010,10 +387,6 @@ timeline: true
|
||||
|
||||
### 不兼容改动
|
||||
|
||||
> 如果你从 2.x 升级到 3.x，建议直接升级到 3.x 的最新版本。
|
||||
|
||||
> 3.x 后续的版本可能已经废弃了一些下面没有提到的改动，请参考控制台的警告提示相应升级。
|
||||
|
||||
此版本有部分不兼容的改动，升级时确保修改相应的使用代码。另外由于人肉查找代码中的废弃用法过于低效，所以我们提供了 [antd-migration-helper](https://github.com/ant-design/antd-migration-helper) 用于扫描代码中的废弃用法。
|
||||
|
||||
- Card 的 `noHovering` 属性重命名为 `hoverable`，且默认值改为 `true`。
|
||||
@@ -1060,7 +433,7 @@ timeline: true
|
||||
|
||||
- Form 下的表单控件不再默认为 `size="large"`。
|
||||
- `Input.Search` 默认的 🔍 图标只作为装饰，不再响应用户交互。需要添加可交互按钮请使用 `enterButton`。
|
||||
- UMD 版本的 `dist/antd.js` 不再包含 moment，使用的时候需要自己引入 moment。
|
||||
- UMD 版本的 `dist/antd.js` 不再包含 moment，使用的时候需要自己引入 moment。
|
||||
```diff
|
||||
<html>
|
||||
<head>
|
||||
@@ -1085,7 +458,7 @@ timeline: true
|
||||
- 🌟 Row 的 `gutter` 属性新增响应式断点的支持，可以使用诸如 `gutter={{ sm: 16, lg: 32 }}` 的设置。
|
||||
- 🌟 Spin 新增 `indicator` 属性，用于设置自定义的加载指示符。 [#7977](https://github.com/ant-design/ant-design/pull/7977) [@kossel](https://github.com/ant-design/ant-design/pull/7977)
|
||||
- 🌟 Input.Search 新增 `enterButton` 用于设置自定义的搜索图标。[#7596](https://github.com/ant-design/ant-design/issues/7596)
|
||||
- 🌟 Mention 新增 `placement`，用于设置下拉框的弹出方向。
|
||||
- 🌟 Mention 新增 `placement`, 用于设置下拉框的弹出方向。
|
||||
- 🌟 Carousel 新增 `next()`、`prev()`、`goTo(slideNumber)` 方法，用于控制面板展示。
|
||||
- 🌟 Button 新增链接支持，当提供 `href` 时会自动渲染为 `<a>`。[#8343](https://github.com/ant-design/ant-design/pull/8343)
|
||||
- 🌟 Steps 进行了重构，首次渲染的时候不会再闪烁。 [#6010](https://github.com/ant-design/ant-design/issues/6010)
|
||||
|
||||
@@ -1,56 +1,49 @@
|
||||
<p align="center">
|
||||
<a href="http://ant.design">
|
||||
<img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
|
||||
<img width="230" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<h1 align="center">Ant Design</h1>
|
||||
# Ant Design
|
||||
|
||||
<div align="center">
|
||||
[](https://travis-ci.org/ant-design/ant-design)
|
||||
[](https://codecov.io/gh/ant-design/ant-design/branch/master)
|
||||
[](https://gemnasium.com/ant-design/ant-design)
|
||||
|
||||
[](https://www.npmjs.org/package/antd)
|
||||
[](http://www.npmtrends.com/antd)
|
||||
[](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
|
||||
[](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
|
||||
[](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)（中文）
|
||||
|
||||
一套企业级的 UI 设计语言和 React 实现。
|
||||
|
||||
[](https://circleci.com/gh/ant-design/ant-design)
|
||||
[](https://codecov.io/gh/ant-design/ant-design/branch/master)
|
||||
[](https://david-dm.org/ant-design/ant-design)
|
||||
[](https://david-dm.org/ant-design/ant-design?type=dev)
|
||||
[README in English](README.md)
|
||||
|
||||
[](https://www.npmjs.org/package/antd)
|
||||
[](http://npmjs.com/antd)
|
||||
[](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
|
||||
[](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)(🇺🇸)
|
||||
[](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)(🇨🇳)
|
||||
|
||||
</div>
|
||||
|
||||
[](http://ant.design/index-cn)
|
||||
|
||||
[English](./README.md) | 简体中文
|
||||
|
||||
## ✨ 特性
|
||||
## 特性
|
||||
|
||||
- 提炼自企业级中后台产品的交互语言和视觉风格。
|
||||
- 开箱即用的高质量 React 组件。
|
||||
- 使用 TypeScript 构建，提供完整的类型定义文件。
|
||||
- 全链路开发和设计工具体系。
|
||||
|
||||
## 🖥 支持环境
|
||||
## 支持环境
|
||||
|
||||
* 现代浏览器和 IE9 及以上。
|
||||
* 支持服务端渲染。
|
||||
* [Electron](http://electron.atom.io/)
|
||||
|
||||
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Electron |
|
||||
| --------- | --------- | --------- | --------- | --------- | --------- |
|
||||
| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions
|
||||
## 参与共建 [](http://makeapullrequest.com)
|
||||
|
||||
## 📦 安装
|
||||
请参考[贡献指南](https://ant.design/docs/react/contributing-cn).
|
||||
|
||||
## 安装
|
||||
|
||||
```bash
|
||||
npm install antd --save
|
||||
```
|
||||
|
||||
## 🔨 示例
|
||||
## 示例
|
||||
|
||||
```jsx
|
||||
import { DatePicker } from 'antd';
|
||||
@@ -65,15 +58,15 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
|
||||
|
||||
你也可以[按需加载组件](https://ant.design/docs/react/getting-started-cn#按需加载)。
|
||||
|
||||
### TypeScript
|
||||
## TypeScript
|
||||
|
||||
参考 [在 TypeScript 中使用](https://ant.design/docs/react/use-in-typescript-cn)
|
||||
|
||||
## 🌍 国际化
|
||||
## 国际化
|
||||
|
||||
参考 [国际化文档](http://ant.design/docs/react/i18n-cn)。
|
||||
|
||||
## 🔗 链接
|
||||
## 链接
|
||||
|
||||
- [首页](http://ant.design/)
|
||||
- [组件库](http://ant.design/docs/react/introduce)
|
||||
@@ -83,16 +76,15 @@ import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
|
||||
- [React 底层基础组件](http://react-component.github.io/)
|
||||
- [移动端组件](http://mobile.ant.design)
|
||||
- [动效](https://motion.ant.design)
|
||||
- [Landing 模板集](https://landing.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)
|
||||
- [常见问题](https://ant.design/docs/react/faq-cn)
|
||||
- [常见问题](https://github.com/ant-design/ant-design/wiki/FAQ)
|
||||
- [CodeSandbox 模板](https://u.ant.design/codesandbox-repro) for bug reports
|
||||
- [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
|
||||
@@ -101,11 +93,11 @@ $ npm install
|
||||
$ npm start
|
||||
```
|
||||
|
||||
打开浏览器访问 http://127.0.0.1:8001 ，更多[本地开发文档](https://github.com/ant-design/ant-design/wiki/Development)。
|
||||
打开浏览器访问 http://127.0.0.1:8001 ，更多本地开发文档参见: https://github.com/ant-design/ant-design/wiki/Development 。
|
||||
|
||||
## 🤝 参与共建 [](http://makeapullrequest.com)
|
||||
## 如何贡献
|
||||
|
||||
请参考[贡献指南](https://ant.design/docs/react/contributing-cn).
|
||||
阅读我们的[贡献指南](./.github/CONTRIBUTING.md).
|
||||
|
||||
> 强烈推荐阅读 [《提问的智慧》](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)，更好的问题更容易获得帮助。
|
||||
|
||||
|
||||
67
README.md
67
README.md
@@ -1,56 +1,53 @@
|
||||
<p align="center">
|
||||
<a href="http://ant.design">
|
||||
<img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
|
||||
<img width="230" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<h1 align="center">Ant Design</h1>
|
||||
# Ant Design
|
||||
|
||||
<div align="center">
|
||||
[](https://travis-ci.org/ant-design/ant-design)
|
||||
[](https://codecov.io/gh/ant-design/ant-design/branch/master)
|
||||
[](https://gemnasium.com/ant-design/ant-design)
|
||||
|
||||
[](https://www.npmjs.org/package/antd)
|
||||
[](http://www.npmtrends.com/antd)
|
||||
[](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
|
||||
[](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge) (English)
|
||||
[](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.
|
||||
|
||||
[](https://circleci.com/gh/ant-design/ant-design)
|
||||
[](https://codecov.io/gh/ant-design/ant-design/branch/master)
|
||||
[](https://david-dm.org/ant-design/ant-design)
|
||||
[](https://david-dm.org/ant-design/ant-design?type=dev)
|
||||
[中文 README](README-zh_CN.md)
|
||||
|
||||
[](https://www.npmjs.org/package/antd)
|
||||
[](http://npmjs.com/antd)
|
||||
[](http://isitmaintained.com/project/ant-design/ant-design "Percentage of issues still open")
|
||||
[](https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge)(🇺🇸)
|
||||
[](https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)(🇨🇳)
|
||||
## 3.0 Released Now! :tada::tada::tada:
|
||||
|
||||
</div>
|
||||
[Announcing Ant Design 3.0](https://medium.com/ant-design/announcing-ant-design-3-0-70e3e65eca0c)
|
||||
|
||||
[](http://ant.design)
|
||||
## Features
|
||||
|
||||
English | [简体中文](./README-zh_CN.md)
|
||||
|
||||
## ✨ Features
|
||||
|
||||
- An enterprise-class UI design system for web applications.
|
||||
- An enterprise-class UI design system for desktop applications.
|
||||
- A set of high-quality React components out of the box.
|
||||
- Written in TypeScript with predictable static types.
|
||||
- The whole package of development and design resources and tools.
|
||||
|
||||
## 🖥 Environment Support
|
||||
## 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/)
|
||||
|
||||
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Opera | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)</br>Electron |
|
||||
| --------- | --------- | --------- | --------- | --------- | --------- |
|
||||
| IE9, IE10, IE11, Edge| last 2 versions| last 2 versions| last 2 versions| last 2 versions| last 2 versions
|
||||
## Let's build a better antd together [](http://makeapullrequest.com)
|
||||
|
||||
## 📦 Install
|
||||
Read our [contributing guide](https://ant.design/docs/react/contributing).
|
||||
|
||||
## Install
|
||||
|
||||
```bash
|
||||
npm install antd --save
|
||||
```
|
||||
|
||||
## 🔨 Usage
|
||||
## Usage
|
||||
|
||||
```jsx
|
||||
import { DatePicker } from 'antd';
|
||||
@@ -63,17 +60,18 @@ And import style manually:
|
||||
import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
|
||||
```
|
||||
|
||||
Or [import components on demand](https://ant.design/docs/react/getting-started#Import-on-Demand).
|
||||
Or [import components on demand](https://ant.design/docs/react/getting-started#Import-on-Demand)
|
||||
|
||||
### TypeScript
|
||||
|
||||
See [Use in TypeScript](https://ant.design/docs/react/use-in-typescript).
|
||||
See [Use in TypeScript](https://ant.design/docs/react/use-in-typescript)
|
||||
|
||||
## 🌍 Internationalization
|
||||
|
||||
## Internationalization
|
||||
|
||||
See [i18n](http://ant.design/docs/react/i18n).
|
||||
|
||||
## 🔗 Links
|
||||
## Links
|
||||
|
||||
- [Home page](http://ant.design/)
|
||||
- [Components](http://ant.design/docs/react/introduce)
|
||||
@@ -83,15 +81,14 @@ See [i18n](http://ant.design/docs/react/i18n).
|
||||
- [rc-components](http://react-component.github.io/)
|
||||
- [Mobile UI](http://mobile.ant.design)
|
||||
- [Motion](https://motion.ant.design)
|
||||
- [Landing Templates](https://landing.ant.design)
|
||||
- [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)
|
||||
- [FAQ](https://ant.design/docs/react/faq)
|
||||
- [FAQ](https://github.com/ant-design/ant-design/wiki/FAQ)
|
||||
- [CodeSandbox Template](https://u.ant.design/codesandbox-repro) for bug reports
|
||||
- [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
|
||||
- [Customize Theme](http://ant.design/docs/react/customize-theme)
|
||||
|
||||
## ⌨️ Development
|
||||
## Development
|
||||
|
||||
```bash
|
||||
$ git clone git@github.com:ant-design/ant-design.git
|
||||
@@ -100,10 +97,8 @@ $ npm install
|
||||
$ npm start
|
||||
```
|
||||
|
||||
Open your browser and visit http://127.0.0.1:8001 , see more at [Development](https://github.com/ant-design/ant-design/wiki/Development).
|
||||
Open your browser and visit http://127.0.0.1:8001 , see more at https://github.com/ant-design/ant-design/wiki/Development .
|
||||
|
||||
## 🤝 Contributing [](http://makeapullrequest.com)
|
||||
|
||||
Read our [contributing guide](https://ant.design/docs/react/contributing) and let's build a better antd together.
|
||||
## 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! :)
|
||||
|
||||
@@ -21,7 +21,6 @@ Array [
|
||||
"DatePicker",
|
||||
"Divider",
|
||||
"Dropdown",
|
||||
"Drawer",
|
||||
"Form",
|
||||
"Icon",
|
||||
"Input",
|
||||
@@ -41,7 +40,6 @@ Array [
|
||||
"Rate",
|
||||
"Row",
|
||||
"Select",
|
||||
"Skeleton",
|
||||
"Slider",
|
||||
"Spin",
|
||||
"Steps",
|
||||
|
||||
@@ -1,18 +1,12 @@
|
||||
const OLD_NODE_ENV = process.env.NODE_ENV;
|
||||
process.env.NODE_ENV = 'development';
|
||||
const warnSpy = jest.spyOn(console, 'warn').mockImplementation(() => {});
|
||||
const antd = require('..');
|
||||
|
||||
describe('antd', () => {
|
||||
afterAll(() => {
|
||||
process.env.NODE_ENV = OLD_NODE_ENV;
|
||||
});
|
||||
|
||||
it('exports modules correctly', () => {
|
||||
expect(Object.keys(antd)).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('should hint when import all components in dev mode', () => {
|
||||
it('should hint when import all components', () => {
|
||||
expect(warnSpy).toBeCalledWith(
|
||||
'You are using a whole package of antd, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.'
|
||||
);
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import throttleByAnimationFrame from '../throttleByAnimationFrame';
|
||||
import getDataOrAriaProps from '../getDataOrAriaProps';
|
||||
|
||||
describe('Test utils function', () => {
|
||||
beforeAll(() => {
|
||||
@@ -33,55 +32,4 @@ describe('Test utils function', () => {
|
||||
jest.runAllTimers();
|
||||
expect(callback).not.toBeCalled();
|
||||
});
|
||||
|
||||
describe('getDataOrAriaProps', () => {
|
||||
it('returns all data-* properties from an object', () => {
|
||||
const props = {
|
||||
onClick: () => {},
|
||||
isOpen: true,
|
||||
'data-test': 'test-id',
|
||||
'data-id': 1234,
|
||||
};
|
||||
const results = getDataOrAriaProps(props);
|
||||
expect(results).toEqual({
|
||||
'data-test': 'test-id',
|
||||
'data-id': 1234,
|
||||
});
|
||||
});
|
||||
|
||||
it('does not return data-__ properties from an object', () => {
|
||||
const props = {
|
||||
onClick: () => {},
|
||||
isOpen: true,
|
||||
'data-__test': 'test-id',
|
||||
'data-__id': 1234,
|
||||
};
|
||||
const results = getDataOrAriaProps(props);
|
||||
expect(results).toEqual({});
|
||||
});
|
||||
|
||||
it('returns all aria-* properties from an object', () => {
|
||||
const props = {
|
||||
onClick: () => {},
|
||||
isOpen: true,
|
||||
'aria-labelledby': 'label-id',
|
||||
'aria-label': 'some-label',
|
||||
};
|
||||
const results = getDataOrAriaProps(props);
|
||||
expect(results).toEqual({
|
||||
'aria-labelledby': 'label-id',
|
||||
'aria-label': 'some-label',
|
||||
});
|
||||
});
|
||||
|
||||
it('returns role property from an object', () => {
|
||||
const props = {
|
||||
onClick: () => {},
|
||||
isOpen: true,
|
||||
role: 'search',
|
||||
};
|
||||
const results = getDataOrAriaProps(props);
|
||||
expect(results).toEqual({ role: 'search' });
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
@@ -1,11 +0,0 @@
|
||||
export default function getDataOrAriaProps(props: any) {
|
||||
return Object.keys(props).reduce((prev: any, key: string) => {
|
||||
if (
|
||||
(key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-' || key === 'role') &&
|
||||
key.substr(0, 7) !== 'data-__'
|
||||
) {
|
||||
prev[key] = props[key];
|
||||
}
|
||||
return prev;
|
||||
}, {});
|
||||
}
|
||||
46
components/_util/getRequestAnimationFrame.tsx
Normal file
46
components/_util/getRequestAnimationFrame.tsx
Normal file
@@ -0,0 +1,46 @@
|
||||
const availablePrefixs = ['moz', 'ms', 'webkit'];
|
||||
|
||||
function requestAnimationFramePolyfill() {
|
||||
let lastTime = 0;
|
||||
return function(callback: (n: number) => void) {
|
||||
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 () => {};
|
||||
}
|
||||
if (window.requestAnimationFrame) {
|
||||
// https://github.com/vuejs/vue/issues/4465
|
||||
return window.requestAnimationFrame.bind(window);
|
||||
}
|
||||
|
||||
const prefix = availablePrefixs.filter(key => `${key}RequestAnimationFrame` in window)[0];
|
||||
|
||||
return prefix
|
||||
? (window as any)[`${prefix}RequestAnimationFrame`]
|
||||
: requestAnimationFramePolyfill();
|
||||
}
|
||||
|
||||
export function cancelRequestAnimationFrame(id: number) {
|
||||
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 as any)[`${prefix}CancelAnimationFrame`] ||
|
||||
(window as any)[`${prefix}CancelRequestAnimationFrame`]
|
||||
).call(this, id) : clearTimeout(id);
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
export default function getScroll(target: HTMLElement | Window | null, top: boolean): number {
|
||||
export default function getScroll(target: any, top: boolean): number {
|
||||
if (typeof window === 'undefined') {
|
||||
return 0;
|
||||
}
|
||||
@@ -7,10 +7,10 @@ export default function getScroll(target: HTMLElement | Window | null, top: bool
|
||||
const method = top ? 'scrollTop' : 'scrollLeft';
|
||||
const isWindow = target === window;
|
||||
|
||||
let ret = isWindow ? (target as Window)[prop] : (target as HTMLElement)[method];
|
||||
let ret = isWindow ? target[prop] : target[method];
|
||||
// ie6,7,8 standard mode
|
||||
if (isWindow && typeof ret !== 'number') {
|
||||
ret = (document.documentElement as HTMLElement)[method];
|
||||
ret = window.document.documentElement[method];
|
||||
}
|
||||
|
||||
return ret;
|
||||
|
||||
24
components/_util/isCssAnimationSupported.tsx
Normal file
24
components/_util/isCssAnimationSupported.tsx
Normal file
@@ -0,0 +1,24 @@
|
||||
let animation: boolean;
|
||||
|
||||
function isCssAnimationSupported() {
|
||||
if (animation !== undefined) {
|
||||
return animation;
|
||||
}
|
||||
const domPrefixes = 'Webkit Moz O ms Khtml'.split(' ');
|
||||
const elm = document.createElement('div');
|
||||
if (elm.style.animationName !== undefined) {
|
||||
animation = true;
|
||||
}
|
||||
if (animation !== undefined) {
|
||||
for (let i = 0; i < domPrefixes.length; i++) {
|
||||
if ((elm.style as any)[`${domPrefixes[i]}AnimationName`] !== undefined) {
|
||||
animation = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
}
|
||||
animation = animation || false;
|
||||
return animation;
|
||||
}
|
||||
|
||||
export default isCssAnimationSupported;
|
||||
@@ -1,5 +0,0 @@
|
||||
const isNumeric = <T extends number>(value: any): value is T => {
|
||||
return !isNaN(parseFloat(value)) && isFinite(value);
|
||||
};
|
||||
|
||||
export default isNumeric;
|
||||
@@ -1,5 +1,7 @@
|
||||
import cssAnimation from 'css-animation';
|
||||
import raf from 'raf';
|
||||
import getRequestAnimationFrame, { cancelRequestAnimationFrame } from './getRequestAnimationFrame';
|
||||
|
||||
const reqAnimFrame = getRequestAnimationFrame();
|
||||
|
||||
function animate(node: HTMLElement, show: boolean, done: () => void) {
|
||||
let height: number;
|
||||
@@ -17,16 +19,16 @@ function animate(node: HTMLElement, show: boolean, done: () => void) {
|
||||
},
|
||||
active() {
|
||||
if (requestAnimationFrameId) {
|
||||
raf.cancel(requestAnimationFrameId);
|
||||
cancelRequestAnimationFrame(requestAnimationFrameId);
|
||||
}
|
||||
requestAnimationFrameId = raf(() => {
|
||||
requestAnimationFrameId = reqAnimFrame(() => {
|
||||
node.style.height = `${show ? height : 0}px`;
|
||||
node.style.opacity = show ? '1' : '0';
|
||||
});
|
||||
},
|
||||
end() {
|
||||
if (requestAnimationFrameId) {
|
||||
raf.cancel(requestAnimationFrameId);
|
||||
cancelRequestAnimationFrame(requestAnimationFrameId);
|
||||
}
|
||||
node.style.height = '';
|
||||
node.style.opacity = '';
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
import raf from 'raf';
|
||||
import getRequestAnimationFrame, { cancelRequestAnimationFrame } from '../_util/getRequestAnimationFrame';
|
||||
|
||||
const reqAnimFrame = getRequestAnimationFrame();
|
||||
|
||||
export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
|
||||
let requestId: number | null;
|
||||
@@ -10,11 +12,11 @@ export default function throttleByAnimationFrame(fn: (...args: any[]) => void) {
|
||||
|
||||
const throttled = (...args: any[]) => {
|
||||
if (requestId == null) {
|
||||
requestId = raf(later(args));
|
||||
requestId = reqAnimFrame(later(args));
|
||||
}
|
||||
};
|
||||
|
||||
(throttled as any).cancel = () => raf.cancel(requestId!);
|
||||
(throttled as any).cancel = () => cancelRequestAnimationFrame(requestId!);
|
||||
|
||||
return throttled;
|
||||
}
|
||||
|
||||
@@ -1 +1,3 @@
|
||||
export type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
|
||||
export type Diff<T extends string, U extends string> = ({ [P in T]: P } &
|
||||
{ [P in U]: never } & { [x: string]: never })[T];
|
||||
export type Omit<T, K extends keyof T> = Pick<T, Diff<keyof T, K>>;
|
||||
|
||||
@@ -1,140 +0,0 @@
|
||||
import * as React from 'react';
|
||||
import { findDOMNode } from 'react-dom';
|
||||
import TransitionEvents from 'css-animation/lib/Event';
|
||||
|
||||
let styleForPesudo: HTMLStyleElement | null;
|
||||
|
||||
// Where el is the DOM element you'd like to test for visibility
|
||||
function isHidden(element: HTMLElement) {
|
||||
return !element || element.offsetParent === null;
|
||||
}
|
||||
|
||||
export default class Wave extends React.Component<{insertExtraNode?: boolean}> {
|
||||
private instance?: {
|
||||
cancel: () => void;
|
||||
};
|
||||
|
||||
private extraNode: HTMLDivElement;
|
||||
private clickWaveTimeoutId: number;
|
||||
|
||||
isNotGrey(color: string) {
|
||||
const match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\.\d]*)?\)/);
|
||||
if (match && match[1] && match[2] && match[3]) {
|
||||
return !(match[1] === match[2] && match[2] === match[3]);
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
onClick = (node: HTMLElement, waveColor: string) => {
|
||||
if (!node || isHidden(node) || node.className.indexOf('-leave') >= 0) {
|
||||
return;
|
||||
}
|
||||
const { insertExtraNode } = this.props;
|
||||
this.extraNode = document.createElement('div');
|
||||
const extraNode = this.extraNode;
|
||||
extraNode.className = 'ant-click-animating-node';
|
||||
const attributeName = this.getAttributeName();
|
||||
node.removeAttribute(attributeName);
|
||||
node.setAttribute(attributeName, 'true');
|
||||
// Not white or transparnt or grey
|
||||
styleForPesudo = styleForPesudo || document.createElement('style');
|
||||
if (waveColor &&
|
||||
waveColor !== '#ffffff' &&
|
||||
waveColor !== 'rgb(255, 255, 255)' &&
|
||||
this.isNotGrey(waveColor) &&
|
||||
!/rgba\(\d*, \d*, \d*, 0\)/.test(waveColor) && // any transparent rgba color
|
||||
waveColor !== 'transparent') {
|
||||
extraNode.style.borderColor = waveColor;
|
||||
styleForPesudo.innerHTML =
|
||||
`[ant-click-animating-without-extra-node]:after { border-color: ${waveColor}; }`;
|
||||
if (!document.body.contains(styleForPesudo)) {
|
||||
document.body.appendChild(styleForPesudo);
|
||||
}
|
||||
}
|
||||
if (insertExtraNode) {
|
||||
node.appendChild(extraNode);
|
||||
}
|
||||
TransitionEvents.addEndEventListener(node, this.onTransitionEnd);
|
||||
}
|
||||
|
||||
bindAnimationEvent = (node: HTMLElement) => {
|
||||
if (!node ||
|
||||
!node.getAttribute ||
|
||||
node.getAttribute('disabled') ||
|
||||
node.className.indexOf('disabled') >= 0) {
|
||||
return;
|
||||
}
|
||||
const onClick = (e: MouseEvent) => {
|
||||
// Fix radio button click twice
|
||||
if ((e.target as HTMLElement).tagName === 'INPUT' || isHidden(e.target as HTMLElement)) {
|
||||
return;
|
||||
}
|
||||
this.resetEffect(node);
|
||||
// Get wave color from target
|
||||
const waveColor =
|
||||
getComputedStyle(node).getPropertyValue('border-top-color') || // Firefox Compatible
|
||||
getComputedStyle(node).getPropertyValue('border-color') ||
|
||||
getComputedStyle(node).getPropertyValue('background-color');
|
||||
this.clickWaveTimeoutId = window.setTimeout(() => this.onClick(node, waveColor), 0);
|
||||
};
|
||||
node.addEventListener('click', onClick, true);
|
||||
return {
|
||||
cancel: () => {
|
||||
node.removeEventListener('click', onClick, true);
|
||||
},
|
||||
};
|
||||
}
|
||||
|
||||
getAttributeName() {
|
||||
const { insertExtraNode } = this.props;
|
||||
return insertExtraNode ? 'ant-click-animating' : 'ant-click-animating-without-extra-node';
|
||||
}
|
||||
|
||||
resetEffect(node: HTMLElement) {
|
||||
if (!node || node === this.extraNode) {
|
||||
return;
|
||||
}
|
||||
const { insertExtraNode } = this.props;
|
||||
const attributeName = this.getAttributeName();
|
||||
node.removeAttribute(attributeName);
|
||||
this.removeExtraStyleNode();
|
||||
if (insertExtraNode && this.extraNode && node.contains(this.extraNode)) {
|
||||
node.removeChild(this.extraNode);
|
||||
}
|
||||
TransitionEvents.removeEndEventListener(node, this.onTransitionEnd);
|
||||
}
|
||||
|
||||
onTransitionEnd = (e: AnimationEvent) => {
|
||||
if (!e || e.animationName !== 'fadeEffect') {
|
||||
return;
|
||||
}
|
||||
this.resetEffect(e.target as HTMLElement);
|
||||
}
|
||||
|
||||
removeExtraStyleNode() {
|
||||
if (styleForPesudo) {
|
||||
styleForPesudo.innerHTML = '';
|
||||
}
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
const node = findDOMNode(this) as HTMLElement;
|
||||
if (node.nodeType !== 1) {
|
||||
return;
|
||||
}
|
||||
this.instance = this.bindAnimationEvent(node);
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
if (this.instance) {
|
||||
this.instance.cancel();
|
||||
}
|
||||
if (this.clickWaveTimeoutId) {
|
||||
clearTimeout(this.clickWaveTimeoutId);
|
||||
}
|
||||
}
|
||||
|
||||
render() {
|
||||
return this.props.children;
|
||||
}
|
||||
}
|
||||
@@ -7,15 +7,14 @@ 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
|
||||
@@ -35,9 +34,8 @@ class AffixMounter extends React.Component {
|
||||
<Affix
|
||||
target={() => this.container}
|
||||
ref={ele => this.affix = ele}
|
||||
{...this.props}
|
||||
>
|
||||
<Button type="primary">
|
||||
<Button type="primary" >
|
||||
Fixed at the top of container
|
||||
</Button>
|
||||
</Affix>
|
||||
@@ -48,8 +46,6 @@ class AffixMounter extends React.Component {
|
||||
}
|
||||
|
||||
describe('Affix Render', () => {
|
||||
let wrapper;
|
||||
|
||||
beforeAll(() => {
|
||||
jest.useFakeTimers();
|
||||
});
|
||||
@@ -58,63 +54,23 @@ describe('Affix Render', () => {
|
||||
jest.useRealTimers();
|
||||
});
|
||||
|
||||
const scrollTo = (top) => {
|
||||
wrapper.instance().affix.fixedNode.parentNode.getBoundingClientRect = jest.fn(() => {
|
||||
return {
|
||||
bottom: 100, height: 28, left: 0, right: 0, top: 50 - top, width: 195,
|
||||
};
|
||||
});
|
||||
wrapper.instance().container.scrollTop = top;
|
||||
events.scroll({
|
||||
type: 'scroll',
|
||||
});
|
||||
jest.runAllTimers();
|
||||
};
|
||||
|
||||
it('Anchor render perfectly', () => {
|
||||
document.body.innerHTML = '<div id="mounter" />';
|
||||
|
||||
wrapper = mount(<AffixMounter />, { attachTo: document.getElementById('mounter') });
|
||||
const wrapper = mount(<AffixMounter />, { attachTo: document.getElementById('mounter') });
|
||||
jest.runAllTimers();
|
||||
|
||||
scrollTo(0);
|
||||
expect(wrapper.instance().affix.state.affixStyle).toBe(null);
|
||||
|
||||
scrollTo(100);
|
||||
expect(wrapper.instance().affix.state.affixStyle).not.toBe(null);
|
||||
|
||||
scrollTo(0);
|
||||
expect(wrapper.instance().affix.state.affixStyle).toBe(null);
|
||||
});
|
||||
|
||||
it('support offsetBottom', () => {
|
||||
document.body.innerHTML = '<div id="mounter" />';
|
||||
|
||||
wrapper = mount(<AffixMounter offsetBottom={0} />, { attachTo: document.getElementById('mounter') });
|
||||
jest.runAllTimers();
|
||||
|
||||
scrollTo(0);
|
||||
expect(wrapper.instance().affix.state.affixStyle).not.toBe(null);
|
||||
|
||||
scrollTo(100);
|
||||
expect(wrapper.instance().affix.state.affixStyle).toBe(null);
|
||||
|
||||
scrollTo(0);
|
||||
expect(wrapper.instance().affix.state.affixStyle).not.toBe(null);
|
||||
});
|
||||
|
||||
it('updatePosition when offsetTop changed', () => {
|
||||
document.body.innerHTML = '<div id="mounter" />';
|
||||
|
||||
wrapper = mount(<AffixMounter offsetTop={0} />, { attachTo: document.getElementById('mounter') });
|
||||
jest.runAllTimers();
|
||||
|
||||
scrollTo(100);
|
||||
expect(wrapper.instance().affix.state.affixStyle.top).toBe(0);
|
||||
wrapper.setProps({
|
||||
offsetTop: 10,
|
||||
wrapper.instance().affix.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.instance().affix.state.affixStyle.top).toBe(10);
|
||||
expect(wrapper.instance().affix.state.affixStyle).not.toBe(null);
|
||||
});
|
||||
});
|
||||
|
||||
@@ -16,44 +16,16 @@ The simplest usage.
|
||||
````jsx
|
||||
import { Affix, Button } from 'antd';
|
||||
|
||||
class Demo extends React.Component {
|
||||
state = {
|
||||
top: 10,
|
||||
bottom: 10,
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<Affix offsetTop={this.state.top}>
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
this.setState({
|
||||
top: this.state.top + 10,
|
||||
});
|
||||
}}
|
||||
>
|
||||
Affix top
|
||||
</Button>
|
||||
</Affix>
|
||||
<br />
|
||||
<Affix offsetBottom={this.state.bottom}>
|
||||
<Button
|
||||
type="primary"
|
||||
onClick={() => {
|
||||
this.setState({
|
||||
bottom: this.state.bottom + 10,
|
||||
});
|
||||
}}
|
||||
>
|
||||
Affix bottom
|
||||
</Button>
|
||||
</Affix>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
ReactDOM.render(<Demo />, mountNode);
|
||||
ReactDOM.render(
|
||||
<div>
|
||||
<Affix>
|
||||
<Button type="primary">Affix top</Button>
|
||||
</Affix>
|
||||
<br />
|
||||
<Affix offsetBottom={0}>
|
||||
<Button type="primary">Affix bottom</Button>
|
||||
</Affix>
|
||||
</div>,
|
||||
mountNode
|
||||
);
|
||||
````
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import PropTypes from 'prop-types';
|
||||
import addEventListener from 'rc-util/lib/Dom/addEventListener';
|
||||
import classNames from 'classnames';
|
||||
import shallowequal from 'shallowequal';
|
||||
@@ -38,7 +38,8 @@ function getOffset(element: HTMLElement, target: HTMLElement | Window | null) {
|
||||
function noop() {}
|
||||
|
||||
function getDefaultTarget() {
|
||||
return typeof window !== 'undefined' ? window : null;
|
||||
return typeof window !== 'undefined' ?
|
||||
window : null;
|
||||
}
|
||||
|
||||
// Affix
|
||||
@@ -70,16 +71,11 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
|
||||
target: PropTypes.func,
|
||||
};
|
||||
|
||||
state: AffixState = {
|
||||
affixStyle: undefined,
|
||||
placeholderStyle: undefined,
|
||||
};
|
||||
scrollEvent: any;
|
||||
resizeEvent: any;
|
||||
timeout: any;
|
||||
|
||||
private timeout: number;
|
||||
private eventHandlers: Record<string, any> = {};
|
||||
private fixedNode: HTMLElement;
|
||||
private placeholderNode: HTMLElement;
|
||||
private readonly events = [
|
||||
events = [
|
||||
'resize',
|
||||
'scroll',
|
||||
'touchstart',
|
||||
@@ -89,7 +85,19 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
|
||||
'load',
|
||||
];
|
||||
|
||||
setAffixStyle(e: Event, affixStyle: React.CSSProperties | null) {
|
||||
eventHandlers: {
|
||||
[key: string]: any;
|
||||
} = {};
|
||||
|
||||
state: AffixState = {
|
||||
affixStyle: undefined,
|
||||
placeholderStyle: undefined,
|
||||
};
|
||||
|
||||
private fixedNode: HTMLElement;
|
||||
private placeholderNode: HTMLElement;
|
||||
|
||||
setAffixStyle(e: any, affixStyle: React.CSSProperties | null) {
|
||||
const { onChange = noop, target = getDefaultTarget } = this.props;
|
||||
const originalAffixStyle = this.state.affixStyle;
|
||||
const isWindow = target() === window;
|
||||
@@ -116,7 +124,7 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
|
||||
this.setState({ placeholderStyle: placeholderStyle as React.CSSProperties });
|
||||
}
|
||||
|
||||
syncPlaceholderStyle(e: Event) {
|
||||
syncPlaceholderStyle(e: any) {
|
||||
const { affixStyle } = this.state;
|
||||
if (!affixStyle) {
|
||||
return;
|
||||
@@ -132,14 +140,12 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
|
||||
}
|
||||
|
||||
@throttleByAnimationFrameDecorator()
|
||||
updatePosition(e: Event) {
|
||||
updatePosition(e: any) {
|
||||
let { offsetTop, offsetBottom, offset, target = getDefaultTarget } = this.props;
|
||||
const targetNode = target();
|
||||
|
||||
// Backwards support
|
||||
// Fix: if offsetTop === 0, it will get undefined,
|
||||
// if offsetBottom is type of number, offsetMode will be { top: false, ... }
|
||||
offsetTop = typeof offsetTop === 'undefined' ? offset : offsetTop;
|
||||
offsetTop = offsetTop || offset;
|
||||
const scrollTop = getScroll(targetNode, true);
|
||||
const affixNode = ReactDOM.findDOMNode(this) as HTMLElement;
|
||||
const elemOffset = getOffset(affixNode, targetNode);
|
||||
@@ -224,13 +230,7 @@ export default class Affix extends React.Component<AffixProps, AffixState> {
|
||||
this.setTargetEventListeners(nextProps.target!);
|
||||
|
||||
// Mock Event object.
|
||||
this.updatePosition({} as Event);
|
||||
}
|
||||
if (
|
||||
this.props.offsetTop !== nextProps.offsetTop ||
|
||||
this.props.offsetBottom !== nextProps.offsetBottom
|
||||
) {
|
||||
this.updatePosition({} as Event);
|
||||
this.updatePosition({});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
category: Components
|
||||
subtitle: 固钉
|
||||
type: 导航
|
||||
type: Navigation
|
||||
title: Affix
|
||||
---
|
||||
|
||||
|
||||
@@ -8,21 +8,7 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-exclamation-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="exclamation-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -39,21 +25,7 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-exclamation-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="exclamation-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -66,22 +38,8 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
|
||||
class="ant-alert-close-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<br />
|
||||
@@ -104,22 +62,8 @@ exports[`renders ./components/alert/demo/banner.md correctly 1`] = `
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross-circle ant-alert-icon"
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -166,22 +110,8 @@ exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
|
||||
class="ant-alert-close-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<div
|
||||
@@ -202,22 +132,8 @@ exports[`renders ./components/alert/demo/closable.md correctly 1`] = `
|
||||
class="ant-alert-close-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
@@ -244,272 +160,6 @@ exports[`renders ./components/alert/demo/close-text.md correctly 1`] = `
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/alert/demo/custom-icon.md correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
class="ant-alert ant-alert-success ant-alert-no-icon"
|
||||
data-show="true"
|
||||
>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
showIcon = false
|
||||
</span>
|
||||
<span
|
||||
class="ant-alert-description"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
class="ant-alert ant-alert-success"
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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-smile ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="smile"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M288 421a48 48 0 1 0 96 0 48 48 0 1 0-96 0zm352 0a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm263 711c-34.2 34.2-74 61-118.3 79.8C611 874.2 562.3 884 512 884c-50.3 0-99-9.8-144.8-29.2A370.4 370.4 0 0 1 248.9 775c-34.2-34.2-61-74-79.8-118.3C149.8 611 140 562.3 140 512s9.8-99 29.2-144.8A370.4 370.4 0 0 1 249 248.9c34.2-34.2 74-61 118.3-79.8C413 149.8 461.7 140 512 140c50.3 0 99 9.8 144.8 29.2A370.4 370.4 0 0 1 775.1 249c34.2 34.2 61 74 79.8 118.3C874.2 413 884 461.7 884 512s-9.8 99-29.2 144.8A368.89 368.89 0 0 1 775 775zM664 533h-48.1c-4.2 0-7.8 3.2-8.1 7.4C604 589.9 562.5 629 512 629s-92.1-39.1-95.8-88.6c-.3-4.2-3.9-7.4-8.1-7.4H360a8 8 0 0 0-8 8.4c4.4 84.3 74.5 151.6 160 151.6s155.6-67.3 160-151.6a8 8 0 0 0-8-8.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<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/description.md correctly 1`] = `
|
||||
<div>
|
||||
<div
|
||||
@@ -583,21 +233,7 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-check-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="check-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm193.5 301.7l-210.6 292a31.8 31.8 0 0 1-51.7 0L318.5 484.9c-3.8-5.3 0-12.7 6.5-12.7h46.9c10.2 0 19.9 4.9 25.9 13.3l71.2 98.8 157.2-218c6-8.3 15.6-13.3 25.9-13.3H699c6.5 0 10.3 7.4 6.5 12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -613,21 +249,7 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-info-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="info-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm32 664c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V456c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272zm-32-344a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -643,21 +265,7 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-exclamation-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="exclamation-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm-32 232c0-4.4 3.6-8 8-8h48c4.4 0 8 3.6 8 8v272c0 4.4-3.6 8-8 8h-48c-4.4 0-8-3.6-8-8V296zm32 440a48.01 48.01 0 0 1 0-96 48.01 48.01 0 0 1 0 96z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -672,22 +280,8 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm165.4 618.2l-66-.3L512 563.4l-99.3 118.4-66.1.3c-4.4 0-8-3.5-8-8 0-1.9.7-3.7 1.9-5.2l130.1-155L340.5 359a8.32 8.32 0 0 1-1.9-5.2c0-4.4 3.6-8 8-8l66.1.3L512 464.6l99.3-118.4 66-.3c4.4 0 8 3.5 8 8 0 1.9-.7 3.7-1.9 5.2L553.5 514l130 155c1.2 1.5 1.9 3.3 1.9 5.2 0 4.4-3.6 8-8 8z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross-circle ant-alert-icon"
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -702,25 +296,8 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-check-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="check-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M699 353h-46.9c-10.2 0-19.9 4.9-25.9 13.3L469 584.3l-71.2-98.8c-6-8.3-15.6-13.3-25.9-13.3H325c-6.5 0-10.3 7.4-6.5 12.7l124.6 172.8a31.8 31.8 0 0 0 51.7 0l210.6-292c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-check-circle-o ant-alert-icon"
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -737,25 +314,8 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-info-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="info-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
|
||||
/>
|
||||
<path
|
||||
d="M464 336a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM536 448h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8h48c4.4 0 8-3.6 8-8V456c0-4.4-3.6-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-info-circle-o ant-alert-icon"
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -772,25 +332,8 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-exclamation-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="exclamation-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M512 64C264.6 64 64 264.6 64 512s200.6 448 448 448 448-200.6 448-448S759.4 64 512 64zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
|
||||
/>
|
||||
<path
|
||||
d="M464 688a48 48 0 1 0 96 0 48 48 0 1 0-96 0zM488 576h48c4.4 0 8-3.6 8-8V296c0-4.4-3.6-8-8-8h-48c-4.4 0-8 3.6-8 8v272c0 4.4 3.6 8 8 8z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-exclamation-circle-o ant-alert-icon"
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -807,25 +350,8 @@ exports[`renders ./components/alert/demo/icon.md correctly 1`] = `
|
||||
data-show="true"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close-circle ant-alert-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close-circle"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M685.4 354.8c0-4.4-3.6-8-8-8l-66 .3L512 465.6l-99.3-118.4-66.1-.3c-4.4 0-8 3.5-8 8 0 1.9.7 3.7 1.9 5.2l130.1 155L340.5 670a8.32 8.32 0 0 0-1.9 5.2c0 4.4 3.6 8 8 8l66.1-.3L512 564.4l99.3 118.4 66 .3c4.4 0 8-3.5 8-8 0-1.9-.7-3.7-1.9-5.2L553.5 515l130.1-155c1.2-1.4 1.8-3.3 1.8-5.2z"
|
||||
/>
|
||||
<path
|
||||
d="M512 65C264.6 65 64 265.6 64 513s200.6 448 448 448 448-200.6 448-448S759.4 65 512 65zm0 820c-205.4 0-372-166.6-372-372s166.6-372 372-372 372 166.6 372 372-166.6 372-372 372z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross-circle-o ant-alert-icon"
|
||||
/>
|
||||
<span
|
||||
class="ant-alert-message"
|
||||
>
|
||||
@@ -858,22 +384,8 @@ exports[`renders ./components/alert/demo/smooth-closed.md correctly 1`] = `
|
||||
class="ant-alert-close-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-close"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="close"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M563.8 512l262.5-312.9c4.4-5.2.7-13.1-6.1-13.1h-79.8c-4.7 0-9.2 2.1-12.3 5.7L511.6 449.8 295.1 191.7c-3-3.6-7.5-5.7-12.3-5.7H203c-6.8 0-10.5 7.9-6.1 13.1L459.4 512 196.9 824.9A7.95 7.95 0 0 0 203 838h79.8c4.7 0 9.2-2.1 12.3-5.7l216.5-258.1 216.5 258.1c3 3.6 7.5 5.7 12.3 5.7h79.8c6.8 0 10.5-7.9 6.1-13.1L563.8 512z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
class="anticon anticon-cross"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
<p>
|
||||
|
||||
@@ -1,58 +0,0 @@
|
||||
import React from 'react';
|
||||
import { mount } from 'enzyme';
|
||||
import Alert from '..';
|
||||
|
||||
describe('Alert', () => {
|
||||
beforeAll(() => {
|
||||
jest.useFakeTimers();
|
||||
});
|
||||
|
||||
afterAll(() => {
|
||||
jest.useRealTimers();
|
||||
});
|
||||
|
||||
it('could be closed', () => {
|
||||
const onClose = jest.fn();
|
||||
const afterClose = jest.fn();
|
||||
const wrapper = mount(
|
||||
<Alert
|
||||
message="Warning Text Warning Text Warning TextW arning Text Warning Text Warning TextWarning Text"
|
||||
type="warning"
|
||||
closable
|
||||
onClose={onClose}
|
||||
afterClose={afterClose}
|
||||
/>
|
||||
);
|
||||
wrapper.find('.ant-alert-close-icon').simulate('click');
|
||||
expect(onClose).toBeCalled();
|
||||
jest.runAllTimers();
|
||||
expect(afterClose).toBeCalled();
|
||||
});
|
||||
|
||||
describe('data and aria props', () => {
|
||||
it('sets data attributes on input', () => {
|
||||
const wrapper = mount(
|
||||
<Alert data-test="test-id" data-id="12345" />
|
||||
);
|
||||
const input = wrapper.find('.ant-alert').getDOMNode();
|
||||
expect(input.getAttribute('data-test')).toBe('test-id');
|
||||
expect(input.getAttribute('data-id')).toBe('12345');
|
||||
});
|
||||
|
||||
it('sets aria attributes on input', () => {
|
||||
const wrapper = mount(
|
||||
<Alert aria-describedby="some-label" />
|
||||
);
|
||||
const input = wrapper.find('.ant-alert').getDOMNode();
|
||||
expect(input.getAttribute('aria-describedby')).toBe('some-label');
|
||||
});
|
||||
|
||||
it('sets role attribute on input', () => {
|
||||
const wrapper = mount(
|
||||
<Alert role="status" />
|
||||
);
|
||||
const input = wrapper.find('.ant-alert').getDOMNode();
|
||||
expect(input.getAttribute('role')).toBe('status');
|
||||
});
|
||||
});
|
||||
});
|
||||
@@ -26,6 +26,6 @@ ReactDOM.render(
|
||||
<Alert showIcon={false} message="Warning text without icon" banner />
|
||||
<br />
|
||||
<Alert type="error" message="Error text" banner />
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -17,8 +17,8 @@ The simplest usage for short messages.
|
||||
import { Alert } from 'antd';
|
||||
|
||||
ReactDOM.render(
|
||||
<Alert message="Success Text" type="success" />,
|
||||
mountNode);
|
||||
<Alert message="Success Text" type="success" />
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
|
||||
@@ -35,6 +35,6 @@ ReactDOM.render(
|
||||
closable
|
||||
onClose={onClose}
|
||||
/>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -17,6 +17,6 @@ Replace the default icon with customized text.
|
||||
import { Alert } from 'antd';
|
||||
|
||||
ReactDOM.render(
|
||||
<Alert message="Info Text" type="info" closeText="Close Now" />,
|
||||
mountNode);
|
||||
<Alert message="Info Text" type="info" closeText="Close Now" />
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -1,59 +0,0 @@
|
||||
---
|
||||
order: 12
|
||||
debug: true
|
||||
title:
|
||||
zh-CN: 自定义图标
|
||||
en-US: Custom Icon
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
可口的图标让信息类型更加醒目。
|
||||
|
||||
## en-US
|
||||
|
||||
Decent icon make information more clear and more friendly.
|
||||
|
||||
````jsx
|
||||
import { Alert, Icon } from 'antd';
|
||||
|
||||
const icon = <Icon type="smile" />;
|
||||
|
||||
ReactDOM.render(
|
||||
<div>
|
||||
<Alert icon={icon} message="showIcon = false" type="success" />
|
||||
<Alert icon={icon} message="Success Tips" type="success" showIcon />
|
||||
<Alert icon={icon} message="Informational Notes" type="info" showIcon />
|
||||
<Alert icon={icon} message="Warning" type="warning" showIcon />
|
||||
<Alert icon={icon} message="Error" type="error" showIcon />
|
||||
<Alert
|
||||
icon={icon}
|
||||
message="Success Tips"
|
||||
description="Detailed description and advices about successful copywriting."
|
||||
type="success"
|
||||
showIcon
|
||||
/>
|
||||
<Alert
|
||||
icon={icon}
|
||||
message="Informational Notes"
|
||||
description="Additional description and informations about copywriting."
|
||||
type="info"
|
||||
showIcon
|
||||
/>
|
||||
<Alert
|
||||
icon={icon}
|
||||
message="Warning"
|
||||
description="This is a warning notice about copywriting."
|
||||
type="warning"
|
||||
showIcon
|
||||
/>
|
||||
<Alert
|
||||
icon={icon}
|
||||
message="Error"
|
||||
description="This is an error message about copywriting."
|
||||
type="error"
|
||||
showIcon
|
||||
/>
|
||||
</div>,
|
||||
mountNode);
|
||||
````
|
||||
@@ -38,6 +38,6 @@ ReactDOM.render(
|
||||
description="Error Description Error Description Error Description Error Description"
|
||||
type="error"
|
||||
/>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -46,6 +46,6 @@ ReactDOM.render(
|
||||
type="error"
|
||||
showIcon
|
||||
/>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -7,7 +7,7 @@ title:
|
||||
|
||||
## zh-CN
|
||||
|
||||
平滑、自然的卸载提示。
|
||||
平滑、自然的卸载提示
|
||||
|
||||
## en-US
|
||||
|
||||
@@ -20,11 +20,9 @@ class App extends React.Component {
|
||||
state = {
|
||||
visible: true,
|
||||
}
|
||||
|
||||
handleClose = () => {
|
||||
this.setState({ visible: false });
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
@@ -45,6 +43,6 @@ class App extends React.Component {
|
||||
}
|
||||
|
||||
ReactDOM.render(
|
||||
<App />,
|
||||
mountNode);
|
||||
<App />
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -22,6 +22,6 @@ ReactDOM.render(
|
||||
<Alert message="Info Text" type="info" />
|
||||
<Alert message="Warning Text" type="warning" />
|
||||
<Alert message="Error Text" type="error" />
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -20,8 +20,8 @@ Alert component for feedback.
|
||||
| closable | Whether Alert can be closed | boolean | - |
|
||||
| closeText | Close text to show | string\|ReactNode | - |
|
||||
| description | Additional content of Alert | string\|ReactNode | - |
|
||||
| icon | Custom icon, effective when `showIcon` is `true` | ReactNode | - |
|
||||
| message | Content of Alert | string\|ReactNode | - |
|
||||
| showIcon | Whether to show icon | boolean | false, in `banner` mode default is true |
|
||||
| iconType | Icon type, effective when `showIcon` is `true` | string | - |
|
||||
| type | Type of Alert styles, options: `success`, `info`, `warning`, `error` | string | `info`, in `banner` mode default is `warning` |
|
||||
| onClose | Callback when Alert is closed | (e: MouseEvent) => void | - |
|
||||
|
||||
@@ -1,9 +1,8 @@
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import Animate from 'rc-animate';
|
||||
import Icon, { ThemeType } from '../icon';
|
||||
import Icon from '../icon';
|
||||
import classNames from 'classnames';
|
||||
import getDataOrAriaProps from '../_util/getDataOrAriaProps';
|
||||
|
||||
function noop() { }
|
||||
|
||||
@@ -31,23 +30,19 @@ export interface AlertProps {
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
banner?: boolean;
|
||||
icon?: React.ReactNode;
|
||||
}
|
||||
|
||||
export interface AlertState {
|
||||
closing: boolean,
|
||||
closed: boolean
|
||||
}
|
||||
|
||||
export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
state: AlertState = {
|
||||
closing: true,
|
||||
closed: false,
|
||||
};
|
||||
|
||||
export default class Alert extends React.Component<AlertProps, any> {
|
||||
constructor(props: AlertProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
closing: true,
|
||||
closed: false,
|
||||
};
|
||||
}
|
||||
handleClose = (e: React.MouseEvent<HTMLAnchorElement>) => {
|
||||
e.preventDefault();
|
||||
const dom = ReactDOM.findDOMNode(this) as HTMLElement;
|
||||
let dom = ReactDOM.findDOMNode(this) as HTMLElement;
|
||||
dom.style.height = `${dom.offsetHeight}px`;
|
||||
// Magic code
|
||||
// 重复一次后才能正确设置 height
|
||||
@@ -58,7 +53,6 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
});
|
||||
(this.props.onClose || noop)(e);
|
||||
}
|
||||
|
||||
animationEnd = () => {
|
||||
this.setState({
|
||||
closed: true,
|
||||
@@ -66,11 +60,10 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
});
|
||||
(this.props.afterClose || noop)();
|
||||
}
|
||||
|
||||
render() {
|
||||
let {
|
||||
closable, description, type, prefixCls = 'ant-alert', message, closeText, showIcon, banner,
|
||||
className = '', style, iconType, icon,
|
||||
className = '', style, iconType,
|
||||
} = this.props;
|
||||
|
||||
// banner模式默认有 Icon
|
||||
@@ -78,9 +71,6 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
// banner模式默认为警告
|
||||
type = banner && type === undefined ? 'warning' : type || 'info';
|
||||
|
||||
let iconTheme: ThemeType = 'filled';
|
||||
// should we give a warning?
|
||||
// warning(!iconType, `The property 'iconType' is deprecated. Use the property 'icon' instead.`);
|
||||
if (!iconType) {
|
||||
switch (type) {
|
||||
case 'success':
|
||||
@@ -90,7 +80,7 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
iconType = 'info-circle';
|
||||
break;
|
||||
case 'error':
|
||||
iconType = 'close-circle';
|
||||
iconType = 'cross-circle';
|
||||
break;
|
||||
case 'warning':
|
||||
iconType = 'exclamation-circle';
|
||||
@@ -101,11 +91,12 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
|
||||
// use outline icon in alert with description
|
||||
if (!!description) {
|
||||
iconTheme = 'outlined';
|
||||
iconType += '-o';
|
||||
}
|
||||
}
|
||||
|
||||
const alertCls = classNames(prefixCls, `${prefixCls}-${type}`, {
|
||||
let alertCls = classNames(prefixCls, {
|
||||
[`${prefixCls}-${type}`]: true,
|
||||
[`${prefixCls}-close`]: !this.state.closing,
|
||||
[`${prefixCls}-with-description`]: !!description,
|
||||
[`${prefixCls}-no-icon`]: !showIcon,
|
||||
@@ -119,26 +110,10 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
|
||||
const closeIcon = closable ? (
|
||||
<a onClick={this.handleClose} className={`${prefixCls}-close-icon`}>
|
||||
{closeText || <Icon type="close" />}
|
||||
{closeText || <Icon type="cross" />}
|
||||
</a>
|
||||
) : null;
|
||||
|
||||
const dataOrAriaProps = getDataOrAriaProps(this.props);
|
||||
|
||||
const iconNode = icon && (
|
||||
React.isValidElement<{ className?: string }>(icon)
|
||||
? React.cloneElement(
|
||||
icon,
|
||||
{
|
||||
className: classNames({
|
||||
[icon.props.className as string]: icon.props.className,
|
||||
[`${prefixCls}-icon`]: true,
|
||||
}),
|
||||
},
|
||||
) : <span className={`${prefixCls}-icon`}>{icon}</span>) || (
|
||||
<Icon className={`${prefixCls}-icon`} type={iconType} theme={iconTheme} />
|
||||
);
|
||||
|
||||
return this.state.closed ? null : (
|
||||
<Animate
|
||||
component=""
|
||||
@@ -146,8 +121,8 @@ export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
transitionName={`${prefixCls}-slide-up`}
|
||||
onEnd={this.animationEnd}
|
||||
>
|
||||
<div data-show={this.state.closing} className={alertCls} style={style} {...dataOrAriaProps}>
|
||||
{showIcon ? iconNode : null}
|
||||
<div data-show={this.state.closing} className={alertCls} style={style}>
|
||||
{showIcon ? <Icon className={`${prefixCls}-icon`} type={iconType} /> : null}
|
||||
<span className={`${prefixCls}-message`}>{message}</span>
|
||||
<span className={`${prefixCls}-description`}>{description}</span>
|
||||
{closeIcon}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
category: Components
|
||||
subtitle: 警告提示
|
||||
type: 反馈
|
||||
type: Feedback
|
||||
title: Alert
|
||||
---
|
||||
|
||||
@@ -16,13 +16,13 @@ title: Alert
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| afterClose | 关闭动画结束后触发的回调函数 | () => void | - |
|
||||
| afterClose | 关闭动画结束后的回掉 | () => void | - |
|
||||
| banner | 是否用作顶部公告 | boolean | false |
|
||||
| closable | 默认不显示关闭按钮 | boolean | 无 |
|
||||
| closeText | 自定义关闭按钮 | string\|ReactNode | 无 |
|
||||
| description | 警告提示的辅助性文字介绍 | string\|ReactNode | 无 |
|
||||
| icon | 自定义图标，`showIcon` 为 `true` 时有效 | ReactNode | - |
|
||||
| message | 警告提示内容 | string\|ReactNode | 无 |
|
||||
| showIcon | 是否显示辅助图标 | boolean | false，`banner` 模式下默认值为 true |
|
||||
| iconType | 自定义图标类型，`showIcon` 为 `true` 时有效 | string | - |
|
||||
| type | 指定警告提示的样式，有四种选择 `success`、`info`、`warning`、`error` | string | `info`，`banner` 模式下默认值为 `warning` |
|
||||
| onClose | 关闭时触发的回调函数 | (e: MouseEvent) => void | 无 |
|
||||
|
||||
@@ -5,7 +5,6 @@
|
||||
|
||||
@alert-message-color: @heading-color;
|
||||
@alert-text-color: @text-color;
|
||||
@alert-close-color: @text-color-secondary;
|
||||
|
||||
.@{alert-prefix-cls} {
|
||||
.reset-component;
|
||||
@@ -18,7 +17,7 @@
|
||||
}
|
||||
|
||||
&-icon {
|
||||
top: 8px + @font-size-base * @line-height-base / 2 - @font-size-base / 2;
|
||||
top: 8px + @font-size-base * @line-height-base / 2 - @font-size-base / 2 + 1px;
|
||||
left: 16px;
|
||||
position: absolute;
|
||||
}
|
||||
@@ -30,34 +29,34 @@
|
||||
}
|
||||
|
||||
&-success {
|
||||
border: @border-width-base @border-style-base @alert-success-border-color;
|
||||
background-color: @alert-success-bg-color;
|
||||
border: @border-width-base @border-style-base ~`colorPalette("@{success-color}", 3)`;
|
||||
background-color: ~`colorPalette("@{success-color}", 1)`;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-success-icon-color;
|
||||
color: @success-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-info {
|
||||
border: @border-width-base @border-style-base @alert-info-border-color;
|
||||
background-color: @alert-info-bg-color;
|
||||
border: @border-width-base @border-style-base ~`colorPalette("@{info-color}", 3)`;
|
||||
background-color: ~`colorPalette("@{info-color}", 1)`;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-info-icon-color;
|
||||
color: @info-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-warning {
|
||||
border: @border-width-base @border-style-base @alert-warning-border-color;
|
||||
background-color: @alert-warning-bg-color;
|
||||
border: @border-width-base @border-style-base ~`colorPalette("@{warning-color}", 3)`;
|
||||
background-color: ~`colorPalette("@{warning-color}", 1)`;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-warning-icon-color;
|
||||
color: @warning-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-error {
|
||||
border: @border-width-base @border-style-base @alert-error-border-color;
|
||||
background-color: @alert-error-bg-color;
|
||||
border: @border-width-base @border-style-base ~`colorPalette("@{error-color}", 3)`;
|
||||
background-color: ~`colorPalette("@{error-color}", 1)`;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-error-icon-color;
|
||||
color: @error-color;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -70,8 +69,8 @@
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
|
||||
.@{iconfont-css-prefix}-close {
|
||||
color: @alert-close-color;
|
||||
.@{iconfont-css-prefix}-cross {
|
||||
color: @text-color-secondary;
|
||||
transition: color .3s;
|
||||
&:hover {
|
||||
color: #404040;
|
||||
@@ -88,7 +87,7 @@
|
||||
padding: 15px 15px 15px 64px;
|
||||
position: relative;
|
||||
border-radius: @border-radius-base;
|
||||
color: @alert-text-color;
|
||||
color: @text-color;
|
||||
line-height: @line-height-base;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import addEventListener from 'rc-util/lib/Dom/addEventListener';
|
||||
import Affix from '../affix';
|
||||
import AnchorLink from './AnchorLink';
|
||||
import getScroll from '../_util/getScroll';
|
||||
import raf from 'raf';
|
||||
import getRequestAnimationFrame from '../_util/getRequestAnimationFrame';
|
||||
|
||||
function getDefaultContainer() {
|
||||
return window;
|
||||
@@ -25,7 +25,7 @@ function getOffsetTop(element: HTMLElement, container: AnchorContainer): number
|
||||
|
||||
if (rect.width || rect.height) {
|
||||
if (container === window) {
|
||||
container = element.ownerDocument!.documentElement!;
|
||||
container = element.ownerDocument.documentElement;
|
||||
return rect.top - container.clientTop;
|
||||
}
|
||||
return rect.top - (container as HTMLElement).getBoundingClientRect().top;
|
||||
@@ -43,6 +43,7 @@ function easeInOutCubic(t: number, b: number, c: number, d: number) {
|
||||
return cc / 2 * ((t -= 2) * t * t + 2) + b;
|
||||
}
|
||||
|
||||
const reqAnimFrame = getRequestAnimationFrame();
|
||||
const sharpMatcherRegx = /#([^#]+)$/;
|
||||
function scrollTo(href: string, offsetTop = 0, getContainer: () => AnchorContainer, callback = () => { }) {
|
||||
const container = getContainer();
|
||||
@@ -66,16 +67,17 @@ function scrollTo(href: string, offsetTop = 0, getContainer: () => AnchorContain
|
||||
(container as HTMLElement).scrollTop = nextScrollTop;
|
||||
}
|
||||
if (time < 450) {
|
||||
raf(frameFunc);
|
||||
reqAnimFrame(frameFunc);
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
raf(frameFunc);
|
||||
reqAnimFrame(frameFunc);
|
||||
history.pushState(null, '', href);
|
||||
}
|
||||
|
||||
type Section = {
|
||||
link: string;
|
||||
link: String;
|
||||
top: number;
|
||||
};
|
||||
|
||||
@@ -91,11 +93,6 @@ export interface AnchorProps {
|
||||
affix?: boolean;
|
||||
showInkInFixed?: boolean;
|
||||
getContainer?: () => AnchorContainer;
|
||||
onClick?: (e: React.MouseEvent<HTMLElement>, link: { title: React.ReactNode, href: string }) => void;
|
||||
}
|
||||
|
||||
export interface AnchorState {
|
||||
activeLink: null | string;
|
||||
}
|
||||
|
||||
export interface AnchorDefaultProps extends AnchorProps {
|
||||
@@ -105,15 +102,7 @@ export interface AnchorDefaultProps extends AnchorProps {
|
||||
getContainer: () => AnchorContainer;
|
||||
}
|
||||
|
||||
export interface AntAnchor {
|
||||
registerLink: (link: string) => void;
|
||||
unregisterLink: (link: string) => void;
|
||||
activeLink: string | null;
|
||||
scrollTo: (link: string) => void;
|
||||
onClick?: (e: React.MouseEvent<HTMLElement>, link: { title: React.ReactNode, href: string }) => void;
|
||||
}
|
||||
|
||||
export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
export default class Anchor extends React.Component<AnchorProps, any> {
|
||||
static Link: typeof AnchorLink;
|
||||
|
||||
static defaultProps = {
|
||||
@@ -127,34 +116,38 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
antAnchor: PropTypes.object,
|
||||
};
|
||||
|
||||
state = {
|
||||
activeLink: null,
|
||||
};
|
||||
|
||||
private inkNode: HTMLSpanElement;
|
||||
|
||||
private links: string[] = [];
|
||||
private links: String[];
|
||||
private scrollEvent: any;
|
||||
private animating: boolean;
|
||||
|
||||
getChildContext() {
|
||||
const antAnchor: AntAnchor = {
|
||||
registerLink: (link: string) => {
|
||||
if (!this.links.includes(link)) {
|
||||
this.links.push(link);
|
||||
}
|
||||
},
|
||||
unregisterLink: (link: string) => {
|
||||
const index = this.links.indexOf(link);
|
||||
if (index !== -1) {
|
||||
this.links.splice(index, 1);
|
||||
}
|
||||
},
|
||||
activeLink: this.state.activeLink,
|
||||
scrollTo: this.handleScrollTo,
|
||||
onClick: this.props.onClick,
|
||||
constructor(props: AnchorProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
activeLink: null,
|
||||
};
|
||||
this.links = [];
|
||||
}
|
||||
|
||||
getChildContext() {
|
||||
return {
|
||||
antAnchor: {
|
||||
registerLink: (link: String) => {
|
||||
if (!this.links.includes(link)) {
|
||||
this.links.push(link);
|
||||
}
|
||||
},
|
||||
unregisterLink: (link: String) => {
|
||||
const index = this.links.indexOf(link);
|
||||
if (index !== -1) {
|
||||
this.links.splice(index, 1);
|
||||
}
|
||||
},
|
||||
activeLink: this.state.activeLink,
|
||||
scrollTo: this.handleScrollTo,
|
||||
},
|
||||
};
|
||||
return { antAnchor };
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@@ -192,7 +185,7 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
});
|
||||
}
|
||||
|
||||
getCurrentAnchor(offsetTop = 0, bounds = 5): string {
|
||||
getCurrentAnchor(offsetTop = 0, bounds = 5) {
|
||||
let activeLink = '';
|
||||
if (typeof document === 'undefined') {
|
||||
return activeLink;
|
||||
@@ -248,7 +241,6 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
affix,
|
||||
showInkInFixed,
|
||||
children,
|
||||
getContainer,
|
||||
} = this.props;
|
||||
const { activeLink } = this.state;
|
||||
|
||||
@@ -282,7 +274,7 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
);
|
||||
|
||||
return !affix ? anchorContent : (
|
||||
<Affix offsetTop={offsetTop} target={getContainer}>
|
||||
<Affix offsetTop={offsetTop}>
|
||||
{anchorContent}
|
||||
</Affix>
|
||||
);
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import { AntAnchor } from './Anchor';
|
||||
|
||||
export interface AnchorLinkProps {
|
||||
prefixCls?: string;
|
||||
@@ -21,32 +20,19 @@ export default class AnchorLink extends React.Component<AnchorLinkProps, any> {
|
||||
};
|
||||
|
||||
context: {
|
||||
antAnchor: AntAnchor;
|
||||
antAnchor: any;
|
||||
};
|
||||
|
||||
componentDidMount() {
|
||||
this.context.antAnchor.registerLink(this.props.href);
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps: AnchorLinkProps) {
|
||||
const { href } = nextProps;
|
||||
if (this.props.href !== href) {
|
||||
this.context.antAnchor.unregisterLink(this.props.href);
|
||||
this.context.antAnchor.registerLink(href);
|
||||
}
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
this.context.antAnchor.unregisterLink(this.props.href);
|
||||
}
|
||||
|
||||
handleClick = (e: React.MouseEvent<HTMLElement>) => {
|
||||
const { scrollTo, onClick } = this.context.antAnchor;
|
||||
const { href, title } = this.props;
|
||||
if (onClick) {
|
||||
onClick(e, { title, href });
|
||||
}
|
||||
scrollTo(href);
|
||||
handleClick = () => {
|
||||
this.context.antAnchor.scrollTo(this.props.href);
|
||||
}
|
||||
|
||||
render() {
|
||||
|
||||
@@ -28,7 +28,7 @@ describe('Anchor Render', () => {
|
||||
expect(wrapper.instance().state.activeLink).toBe('http://www.example.com/#API');
|
||||
});
|
||||
|
||||
it('Anchor render perfectly for complete href - scroll', () => {
|
||||
it('Anchor render perfectly for complete href - scoll', () => {
|
||||
let root = document.getElementById('root');
|
||||
if (!root) {
|
||||
root = document.createElement('div', { id: 'root' });
|
||||
@@ -45,8 +45,7 @@ describe('Anchor Render', () => {
|
||||
expect(wrapper.instance().state.activeLink).toBe('http://www.example.com/#API');
|
||||
});
|
||||
|
||||
it('Anchor render perfectly for complete href - scrollTo', async () => {
|
||||
const scrollToSpy = jest.spyOn(window, 'scrollTo');
|
||||
it('Anchor render perfectly for complete href - scollTo', () => {
|
||||
let root = document.getElementById('root');
|
||||
if (!root) {
|
||||
root = document.createElement('div', { id: 'root' });
|
||||
@@ -61,67 +60,5 @@ describe('Anchor Render', () => {
|
||||
);
|
||||
wrapper.instance().handleScrollTo('##API');
|
||||
expect(wrapper.instance().state.activeLink).toBe('##API');
|
||||
expect(scrollToSpy).not.toHaveBeenCalled();
|
||||
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||
expect(scrollToSpy).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should remove listener when unmount', async () => {
|
||||
const wrapper = mount(
|
||||
<Anchor>
|
||||
<Link href="#API" title="API" />
|
||||
</Anchor>
|
||||
);
|
||||
const removeListenerSpy = jest.spyOn(wrapper.instance().scrollEvent, 'remove');
|
||||
wrapper.unmount();
|
||||
expect(removeListenerSpy).toHaveBeenCalled();
|
||||
});
|
||||
|
||||
it('should unregister link when unmount children', async () => {
|
||||
const wrapper = mount(
|
||||
<Anchor>
|
||||
<Link href="#API" title="API" />
|
||||
</Anchor>
|
||||
);
|
||||
expect(wrapper.instance().links).toEqual(['#API']);
|
||||
wrapper.setProps({ children: null });
|
||||
expect(wrapper.instance().links).toEqual([]);
|
||||
});
|
||||
|
||||
it('should update links when link href update', async () => {
|
||||
let anchorInstance = null;
|
||||
function AnchorUpdate({ href }) {
|
||||
return (
|
||||
<Anchor ref={c => anchorInstance = c}>
|
||||
<Link href={href} title="API" />
|
||||
</Anchor>
|
||||
);
|
||||
}
|
||||
const wrapper = mount(<AnchorUpdate href="#API" />);
|
||||
|
||||
expect(anchorInstance.links).toEqual(['#API']);
|
||||
wrapper.setProps({ href: '#API_1' });
|
||||
expect(anchorInstance.links).toEqual(['#API_1']);
|
||||
});
|
||||
|
||||
it('Anchor onClick event', () => {
|
||||
let event;
|
||||
let link;
|
||||
const handleClick = (...arg) => ([event, link] = arg);
|
||||
|
||||
const href = '#API';
|
||||
const title = 'API';
|
||||
|
||||
const wrapper = mount(
|
||||
<Anchor onClick={handleClick}>
|
||||
<Link href={href} title={title} />
|
||||
</Anchor>
|
||||
);
|
||||
|
||||
wrapper.find(`a[href="${href}"]`).simulate('click');
|
||||
|
||||
wrapper.instance().handleScroll();
|
||||
expect(event).not.toBe(undefined);
|
||||
expect(link).toEqual({ href, title });
|
||||
});
|
||||
});
|
||||
|
||||
@@ -80,80 +80,6 @@ exports[`renders ./components/anchor/demo/basic.md correctly 1`] = `
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/anchor/demo/onClick.md correctly 1`] = `
|
||||
<div
|
||||
class="ant-anchor-wrapper"
|
||||
style="max-height:100vh"
|
||||
>
|
||||
<div
|
||||
class="ant-anchor fixed"
|
||||
>
|
||||
<div
|
||||
class="ant-anchor-ink"
|
||||
>
|
||||
<span
|
||||
class="ant-anchor-ink-ball"
|
||||
/>
|
||||
</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>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/anchor/demo/static.md correctly 1`] = `
|
||||
<div
|
||||
class="ant-anchor-wrapper"
|
||||
|
||||
@@ -15,7 +15,6 @@ The simplest usage.
|
||||
|
||||
```jsx
|
||||
import { Anchor } from 'antd';
|
||||
|
||||
const { Link } = Anchor;
|
||||
|
||||
ReactDOM.render(
|
||||
@@ -26,8 +25,8 @@ ReactDOM.render(
|
||||
<Link href="#Anchor-Props" title="Anchor Props" />
|
||||
<Link href="#Link-Props" title="Link Props" />
|
||||
</Link>
|
||||
</Anchor>,
|
||||
mountNode);
|
||||
</Anchor>
|
||||
, mountNode);
|
||||
```
|
||||
|
||||
<style>
|
||||
|
||||
@@ -1,36 +0,0 @@
|
||||
---
|
||||
order: 3
|
||||
title:
|
||||
zh-CN: 自定义 onClick 事件
|
||||
en-US: Customize the onClick event
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
点击锚点不记录历史。
|
||||
|
||||
## en-US
|
||||
|
||||
Clicking on an anchor does not record history.
|
||||
|
||||
```jsx
|
||||
import { Anchor } from 'antd';
|
||||
|
||||
const { Link } = Anchor;
|
||||
|
||||
const handleClick = (e, link) => {
|
||||
e.preventDefault();
|
||||
console.log(link);
|
||||
};
|
||||
|
||||
ReactDOM.render(
|
||||
<Anchor affix={false} onClick={handleClick}>
|
||||
<Link href="#components-anchor-demo-basic" title="Basic demo" />
|
||||
<Link href="#components-anchor-demo-fixed" title="Fixed demo" />
|
||||
<Link href="#API" title="API">
|
||||
<Link href="#Anchor-Props" title="Anchor Props" />
|
||||
<Link href="#Link-Props" title="Link Props" />
|
||||
</Link>
|
||||
</Anchor>,
|
||||
mountNode);
|
||||
```
|
||||
@@ -15,7 +15,6 @@ Do not change state when page is scrolling.
|
||||
|
||||
```jsx
|
||||
import { Anchor } from 'antd';
|
||||
|
||||
const { Link } = Anchor;
|
||||
|
||||
ReactDOM.render(
|
||||
@@ -26,6 +25,6 @@ ReactDOM.render(
|
||||
<Link href="#Anchor-Props" title="Anchor Props" />
|
||||
<Link href="#Link-Props" title="Link Props" />
|
||||
</Link>
|
||||
</Anchor>,
|
||||
mountNode);
|
||||
</Anchor>
|
||||
, mountNode);
|
||||
```
|
||||
|
||||
@@ -19,11 +19,10 @@ For displaying anchor hyperlinks on page and jumping between them.
|
||||
| -------- | ----------- | ---- | ------- |
|
||||
| affix | Fixed mode of Anchor | boolean | true |
|
||||
| bounds | Bounding distance of anchor area | number | 5(px) |
|
||||
| getContainer | Scrolling container | () => HTMLElement | () => window |
|
||||
| getContainer | Scrolling container | () => HTMLElement | () => window |
|
||||
| offsetBottom | Pixels to offset from bottom when calculating position of scroll | number | - |
|
||||
| offsetTop | Pixels to offset from top when calculating position of scroll | number | 0 |
|
||||
| showInkInFixed | Whether show ink-balls in Fixed mode | boolean | false |
|
||||
| onClick | set the handler to handle `click` event | Function(e: Event, link: Object) | - |
|
||||
|
||||
### Link Props
|
||||
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
category: Components
|
||||
subtitle: 锚点
|
||||
cols: 2
|
||||
type: 其他
|
||||
type: Other
|
||||
title: Anchor
|
||||
---
|
||||
|
||||
@@ -24,7 +24,6 @@ title: Anchor
|
||||
| offsetBottom | 距离窗口底部达到指定偏移量后触发 | number | |
|
||||
| offsetTop | 距离窗口顶部达到指定偏移量后触发 | number | |
|
||||
| showInkInFixed | 固定模式是否显示小圆点 | boolean | false |
|
||||
| onClick | `click` 事件的 handler | Function(e: Event, link: Object) | - |
|
||||
|
||||
### Link Props
|
||||
|
||||
|
||||
@@ -51,8 +51,8 @@
|
||||
}
|
||||
|
||||
&-link {
|
||||
padding: 7px 0 7px 16px;
|
||||
line-height: 1.143;
|
||||
padding: 8px 0 8px 16px;
|
||||
line-height: 1;
|
||||
|
||||
&-title {
|
||||
display: block;
|
||||
@@ -62,7 +62,7 @@
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
margin-bottom: 6px;
|
||||
margin-bottom: 8px;
|
||||
|
||||
&:only-child {
|
||||
margin-bottom: 0;
|
||||
@@ -75,7 +75,7 @@
|
||||
}
|
||||
|
||||
&-link &-link {
|
||||
padding-top: 5px;
|
||||
padding-bottom: 5px;
|
||||
padding-top: 6px;
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -19,7 +19,7 @@ exports[`renders ./components/auto-complete/demo/basic.md correctly 1`] = `
|
||||
<div
|
||||
class="ant-select-selection__placeholder"
|
||||
style="display:block;user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
input here
|
||||
</div>
|
||||
@@ -47,25 +47,9 @@ exports[`renders ./components/auto-complete/demo/basic.md correctly 1`] = `
|
||||
<span
|
||||
class="ant-select-arrow"
|
||||
style="user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-down ant-select-arrow-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<b />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -94,7 +78,7 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
|
||||
<div
|
||||
class="ant-select-selection__placeholder"
|
||||
style="display:block;user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
input here
|
||||
</div>
|
||||
@@ -118,21 +102,7 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-search certain-category-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="search"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
</span>
|
||||
<span
|
||||
@@ -147,25 +117,9 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
|
||||
<span
|
||||
class="ant-select-arrow"
|
||||
style="user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-down ant-select-arrow-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<b />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -212,25 +166,9 @@ exports[`renders ./components/auto-complete/demo/custom.md correctly 1`] = `
|
||||
<span
|
||||
class="ant-select-arrow"
|
||||
style="user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-down ant-select-arrow-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<b />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -255,7 +193,7 @@ exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly
|
||||
<div
|
||||
class="ant-select-selection__placeholder"
|
||||
style="display:block;user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
try to type \`b\`
|
||||
</div>
|
||||
@@ -283,25 +221,9 @@ exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly
|
||||
<span
|
||||
class="ant-select-arrow"
|
||||
style="user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-down ant-select-arrow-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<b />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -326,7 +248,7 @@ exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
|
||||
<div
|
||||
class="ant-select-selection__placeholder"
|
||||
style="display:block;user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
input here
|
||||
</div>
|
||||
@@ -354,25 +276,9 @@ exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
|
||||
<span
|
||||
class="ant-select-arrow"
|
||||
style="user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-down ant-select-arrow-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<b />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -401,7 +307,7 @@ exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly
|
||||
<div
|
||||
class="ant-select-selection__placeholder"
|
||||
style="display:block;user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
input here
|
||||
</div>
|
||||
@@ -429,21 +335,7 @@ exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-search"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="search"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M909.6 854.5L649.9 594.8C690.2 542.7 712 479 712 412c0-80.2-31.3-155.4-87.9-212.1-56.6-56.7-132-87.9-212.1-87.9s-155.5 31.3-212.1 87.9C143.2 256.5 112 331.8 112 412c0 80.1 31.3 155.5 87.9 212.1C256.5 680.8 331.8 712 412 712c67 0 130.6-21.8 182.7-62l259.7 259.6a8.2 8.2 0 0 0 11.6 0l43.6-43.5a8.2 8.2 0 0 0 0-11.6zM570.4 570.4C528 612.7 471.8 636 412 636s-116-23.3-158.4-65.6C211.3 528 188 471.8 188 412s23.3-116.1 65.6-158.4C296 211.3 352.2 188 412 188s116.1 23.2 158.4 65.6S636 352.2 636 412s-23.3 116.1-65.6 158.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
</span>
|
||||
@@ -459,25 +351,9 @@ exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly
|
||||
<span
|
||||
class="ant-select-arrow"
|
||||
style="user-select:none;-webkit-user-select:none"
|
||||
unselectable="on"
|
||||
unselectable="unselectable"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-down ant-select-arrow-icon"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="down"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M884 256h-75c-5.1 0-9.9 2.5-12.9 6.6L512 654.2 227.9 262.6c-3-4.1-7.8-6.6-12.9-6.6h-75c-6.5 0-10.3 7.4-6.5 12.7l352.6 486.1c12.8 17.6 39 17.6 51.7 0l352.6-486.1c3.9-5.3.1-12.7-6.4-12.7z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
<b />
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -16,7 +16,6 @@ Basic Usage, set datasource of autocomplete with `dataSource` property.
|
||||
|
||||
````jsx
|
||||
import { Icon, Input, AutoComplete } from 'antd';
|
||||
|
||||
const Option = AutoComplete.Option;
|
||||
const OptGroup = AutoComplete.OptGroup;
|
||||
|
||||
|
||||
@@ -15,7 +15,6 @@ Customize Input Component
|
||||
|
||||
````jsx
|
||||
import { AutoComplete, Input } from 'antd';
|
||||
|
||||
const { TextArea } = Input;
|
||||
|
||||
function onSelect(value) {
|
||||
|
||||
@@ -16,7 +16,6 @@ Basic Usage, set datasource of autocomplete with `dataSource` property.
|
||||
|
||||
````jsx
|
||||
import { Icon, Button, Input, AutoComplete } from 'antd';
|
||||
|
||||
const Option = AutoComplete.Option;
|
||||
|
||||
function onSelect(value) {
|
||||
|
||||
@@ -33,14 +33,9 @@ const dataSource = ['12345', '23456', '34567'];
|
||||
| optionLabelProp | Which prop value of option will render as content of select. | string | `children` |
|
||||
| placeholder | placeholder of input | string | - |
|
||||
| value | selected option | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | - |
|
||||
| onBlur | Called when leaving the component. | function() | - |
|
||||
| onChange | Called when select an option or input value change, or value of input is changed | function(value) | - |
|
||||
| onFocus | Called when entering the component | function() | - |
|
||||
| onSearch | Called when searching items. | function(value) | - |
|
||||
| onSelect | Called when a option is selected. param is option's value and option instance. | function(value, option) | - |
|
||||
| defaultOpen | Initial open state of dropdown | boolean | - |
|
||||
| open | Controlled open state of dropdown | boolean | - |
|
||||
| onDropdownVisibleChange | Call when dropdown open | function(open) | - |
|
||||
|
||||
## Methods
|
||||
|
||||
|
||||
@@ -6,11 +6,7 @@ import Input from '../input';
|
||||
import InputElement from './InputElement';
|
||||
|
||||
export interface DataSourceItemObject { value: string; text: string; }
|
||||
export type DataSourceItemType =
|
||||
string |
|
||||
DataSourceItemObject |
|
||||
React.ReactElement<OptionProps> |
|
||||
React.ReactElement<OptGroupProps>;
|
||||
export type DataSourceItemType = string | DataSourceItemObject;
|
||||
|
||||
export interface AutoCompleteInputProps {
|
||||
onChange?: React.FormEventHandler<any>;
|
||||
@@ -26,13 +22,9 @@ export interface AutoCompleteProps extends AbstractSelectProps {
|
||||
value?: SelectValue;
|
||||
defaultValue?: SelectValue;
|
||||
dataSource?: DataSourceItemType[];
|
||||
autoFocus?: boolean;
|
||||
backfill?: boolean;
|
||||
optionLabelProp?: string;
|
||||
onChange?: (value: SelectValue) => void;
|
||||
onSelect?: (value: SelectValue, option: Object) => any;
|
||||
onBlur?: (value: SelectValue) => void;
|
||||
onFocus?: () => void;
|
||||
children?: ValidInputElement |
|
||||
React.ReactElement<OptionProps> |
|
||||
Array<React.ReactElement<OptionProps>>;
|
||||
@@ -82,7 +74,7 @@ export default class AutoComplete extends React.Component<AutoCompleteProps, {}>
|
||||
}
|
||||
|
||||
render() {
|
||||
const {
|
||||
let {
|
||||
size, className = '', notFoundContent, prefixCls, optionLabelProp, dataSource, children,
|
||||
} = this.props;
|
||||
|
||||
@@ -124,7 +116,7 @@ export default class AutoComplete extends React.Component<AutoCompleteProps, {}>
|
||||
<Select
|
||||
{...this.props}
|
||||
className={cls}
|
||||
mode={Select.SECRET_COMBOBOX_MODE_DO_NOT_USE}
|
||||
mode="combobox"
|
||||
optionLabelProp={optionLabelProp}
|
||||
getInputElement={this.getInputElement}
|
||||
notFoundContent={notFoundContent}
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
category: Components
|
||||
subtitle: 自动完成
|
||||
type: 数据录入
|
||||
type: Data Entry
|
||||
cols: 2
|
||||
title: AutoComplete
|
||||
---
|
||||
@@ -34,14 +34,9 @@ const dataSource = ['12345', '23456', '34567'];
|
||||
| optionLabelProp | 回填到选择框的 Option 的属性值，默认是 Option 的子元素。比如在子元素需要高亮效果时，此值可以设为 `value`。 | string | `children` |
|
||||
| placeholder | 输入框提示 | string | - |
|
||||
| value | 指定当前选中的条目 | string\|string\[]\|{ key: string, label: string\|ReactNode }\|Array<{ key: string, label: string\|ReactNode }> | 无 |
|
||||
| onBlur | 失去焦点时的回调 | function() | - |
|
||||
| onChange | 选中 option，或 input 的 value 变化时，调用此函数 | function(value) | 无 |
|
||||
| onFocus | 获得焦点时的回调 | function() | - |
|
||||
| onSearch | 搜索补全项的时候调用 | function(value) | 无 |
|
||||
| onSelect | 被选中时调用，参数为选中项的 value 值 | function(value, option) | 无 |
|
||||
| defaultOpen | 是否默认展开下拉菜单 | boolean | - |
|
||||
| open | 是否展开下拉菜单 | boolean | - |
|
||||
| onDropdownVisibleChange | 展开下拉菜单的回调 | function(open) | - |
|
||||
|
||||
## 方法
|
||||
|
||||
|
||||
@@ -52,9 +52,6 @@
|
||||
&:hover {
|
||||
.hover;
|
||||
}
|
||||
&[disabled] {
|
||||
.disabled;
|
||||
}
|
||||
}
|
||||
|
||||
&-lg {
|
||||
|
||||
@@ -15,51 +15,13 @@ describe('Avatar Render', () => {
|
||||
|
||||
const wrapper = mount(<Avatar src="http://error.url">Fallback</Avatar>, { attachTo: div });
|
||||
wrapper.instance().setScale = jest.fn(() => wrapper.instance().setState({ scale: 0.5 }));
|
||||
|
||||
wrapper.find('img').simulate('error');
|
||||
wrapper.setState({ isImgExist: false });
|
||||
|
||||
const children = wrapper.find('.ant-avatar-string');
|
||||
expect(children.length).toBe(1);
|
||||
expect(children.text()).toBe('Fallback');
|
||||
expect(wrapper.instance().setScale).toBeCalled();
|
||||
expect(div.querySelector('.ant-avatar-string').style.transform).toContain('scale(0.5)');
|
||||
|
||||
wrapper.detach();
|
||||
global.document.body.removeChild(div);
|
||||
});
|
||||
|
||||
it('should handle onError correctly', () => {
|
||||
const LOAD_FAILURE_SRC = 'http://error.url';
|
||||
const LOAD_SUCCESS_SRC = 'https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png';
|
||||
|
||||
const div = global.document.createElement('div');
|
||||
global.document.body.appendChild(div);
|
||||
|
||||
class Foo extends React.Component {
|
||||
state = {
|
||||
src: LOAD_FAILURE_SRC,
|
||||
}
|
||||
|
||||
handleImgError = () => {
|
||||
this.setState({
|
||||
src: LOAD_SUCCESS_SRC,
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
render() {
|
||||
const { src } = this.state;
|
||||
return <Avatar src={src} onError={this.handleImgError} />;
|
||||
}
|
||||
}
|
||||
|
||||
const wrapper = mount(<Foo />, { attachTo: div });
|
||||
// mock img load Error, since jsdom do not load resource by default
|
||||
// https://github.com/jsdom/jsdom/issues/1816
|
||||
wrapper.find('img').simulate('error');
|
||||
|
||||
expect(wrapper.find(Avatar).instance().state.isImgExist).toBe(true);
|
||||
expect(div.querySelector('img').getAttribute('src')).toBe(LOAD_SUCCESS_SRC);
|
||||
expect(div.querySelector('.ant-avatar-string').style.transform).toBe('scale(0.5)');
|
||||
|
||||
wrapper.detach();
|
||||
global.document.body.removeChild(div);
|
||||
|
||||
@@ -13,21 +13,7 @@ exports[`renders ./components/avatar/demo/badge.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<sup
|
||||
class="ant-scroll-number ant-badge-count"
|
||||
@@ -201,21 +187,7 @@ exports[`renders ./components/avatar/demo/badge.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<sup
|
||||
class="ant-scroll-number ant-badge-dot"
|
||||
@@ -229,177 +201,49 @@ exports[`renders ./components/avatar/demo/badge.md correctly 1`] = `
|
||||
exports[`renders ./components/avatar/demo/basic.md correctly 1`] = `
|
||||
<div>
|
||||
<div>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-circle ant-avatar-icon"
|
||||
style="width:64px;height:64px;line-height:64px;font-size:32px"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-circle ant-avatar-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-sm ant-avatar-circle ant-avatar-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-square ant-avatar-icon"
|
||||
style="width:64px;height:64px;line-height:64px;font-size:32px"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-lg ant-avatar-square ant-avatar-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-square ant-avatar-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-sm ant-avatar-square ant-avatar-icon"
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
@@ -436,21 +280,7 @@ exports[`renders ./components/avatar/demo/type.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="ant-avatar ant-avatar-circle"
|
||||
@@ -493,21 +323,7 @@ exports[`renders ./components/avatar/demo/type.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
</div>
|
||||
`;
|
||||
|
||||
@@ -24,6 +24,6 @@ ReactDOM.render(
|
||||
<span>
|
||||
<Badge dot><Avatar shape="square" icon="user" /></Badge>
|
||||
</span>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -19,19 +19,17 @@ import { Avatar } from 'antd';
|
||||
ReactDOM.render(
|
||||
<div>
|
||||
<div>
|
||||
<Avatar size={64} icon="user" />
|
||||
<Avatar size="large" icon="user" />
|
||||
<Avatar icon="user" />
|
||||
<Avatar size="small" icon="user" />
|
||||
</div>
|
||||
<div>
|
||||
<Avatar shape="square" size={64} icon="user" />
|
||||
<Avatar shape="square" size="large" icon="user" />
|
||||
<Avatar shape="square" icon="user" />
|
||||
<Avatar shape="square" size="small" icon="user" />
|
||||
</div>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
|
||||
@@ -27,7 +27,6 @@ class Autoset extends React.Component {
|
||||
color: colorList[0],
|
||||
};
|
||||
}
|
||||
|
||||
changeUser = () => {
|
||||
const index = UserList.indexOf(this.state.user);
|
||||
this.setState({
|
||||
@@ -35,7 +34,6 @@ class Autoset extends React.Component {
|
||||
color: index < colorList.length - 1 ? colorList[index + 1] : colorList[0],
|
||||
});
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
@@ -50,6 +48,6 @@ class Autoset extends React.Component {
|
||||
}
|
||||
}
|
||||
|
||||
ReactDOM.render(<Autoset />,
|
||||
mountNode);
|
||||
ReactDOM.render(<Autoset />
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -24,8 +24,8 @@ ReactDOM.render(
|
||||
<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);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
|
||||
@@ -12,7 +12,5 @@ Avatars can be used to represent people or objects. It supports images, `Icon`s,
|
||||
| -------- | ----------- | ---- | ------- |
|
||||
| icon | the `Icon` type for an icon avatar, see `Icon` Component | string | - |
|
||||
| shape | the shape of avatar | `circle` \| `square` | `circle` |
|
||||
| size | the size of the avatar | number \| string: `large` `small` `default` | `default` |
|
||||
| size | the size of the avatar | `large` \| `small` \| `default` | `default` |
|
||||
| src | the address of the image for an image avatar | string | - |
|
||||
| alt | This attribute defines the alternative text describing the image | string | - |
|
||||
| onError | handler when img load error，return false to prevent default fallback behavior | () => boolean | - |
|
||||
|
||||
@@ -6,11 +6,8 @@ import classNames from 'classnames';
|
||||
export interface AvatarProps {
|
||||
/** Shape of avatar, options:`circle`, `square` */
|
||||
shape?: 'circle' | 'square';
|
||||
/*
|
||||
* Size of avatar, options: `large`, `small`, `default`
|
||||
* or a custom number size
|
||||
* */
|
||||
size?: 'large' | 'small' | 'default' | number;
|
||||
/** 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 */
|
||||
@@ -19,10 +16,6 @@ export interface AvatarProps {
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
children?: any;
|
||||
alt?: string;
|
||||
/* callback when img load error */
|
||||
/* return false to prevent Avatar show default fallback behavior, then you can do fallback by your self*/
|
||||
onError?: () => boolean;
|
||||
}
|
||||
|
||||
export interface AvatarState {
|
||||
@@ -37,13 +30,16 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {
|
||||
size: 'default',
|
||||
};
|
||||
|
||||
state = {
|
||||
scale: 1,
|
||||
isImgExist: true,
|
||||
};
|
||||
|
||||
private avatarChildren: any;
|
||||
|
||||
constructor(props: AvatarProps) {
|
||||
super(props);
|
||||
this.state = {
|
||||
scale: 1,
|
||||
isImgExist: true,
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.setScale();
|
||||
}
|
||||
@@ -75,21 +71,13 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {
|
||||
}
|
||||
}
|
||||
|
||||
handleImgLoadError = () => {
|
||||
const { onError } = this.props;
|
||||
const errorFlag = onError ? onError() : undefined;
|
||||
if (errorFlag !== false) {
|
||||
this.setState({ isImgExist: false });
|
||||
}
|
||||
}
|
||||
handleImgLoadError = () => this.setState({ isImgExist: false });
|
||||
|
||||
render() {
|
||||
const {
|
||||
prefixCls, shape, size, src, icon, className, alt, ...others
|
||||
prefixCls, shape, size, src, icon, className, ...others,
|
||||
} = this.props;
|
||||
|
||||
const { isImgExist, scale } = this.state;
|
||||
|
||||
const sizeCls = classNames({
|
||||
[`${prefixCls}-lg`]: size === 'large',
|
||||
[`${prefixCls}-sm`]: size === 'small',
|
||||
@@ -97,46 +85,36 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {
|
||||
|
||||
const classString = classNames(prefixCls, className, sizeCls, {
|
||||
[`${prefixCls}-${shape}`]: shape,
|
||||
[`${prefixCls}-image`]: src && isImgExist,
|
||||
[`${prefixCls}-image`]: src && this.state.isImgExist,
|
||||
[`${prefixCls}-icon`]: icon,
|
||||
});
|
||||
|
||||
const sizeStyle: React.CSSProperties = typeof size === 'number' ? {
|
||||
width: size,
|
||||
height: size,
|
||||
lineHeight: `${size}px`,
|
||||
fontSize: icon ? size / 2 : 18,
|
||||
} : {};
|
||||
|
||||
let children = this.props.children;
|
||||
if (src && isImgExist) {
|
||||
if (src && this.state.isImgExist) {
|
||||
children = (
|
||||
<img
|
||||
src={src}
|
||||
onError={this.handleImgLoadError}
|
||||
alt={alt}
|
||||
/>
|
||||
);
|
||||
} else if (icon) {
|
||||
children = <Icon type={icon} />;
|
||||
} else {
|
||||
const childrenNode = this.avatarChildren;
|
||||
if (childrenNode || scale !== 1) {
|
||||
const transformString = `scale(${scale}) translateX(-50%)`;
|
||||
if (childrenNode || this.state.scale !== 1) {
|
||||
const childrenStyle: React.CSSProperties = {
|
||||
msTransform: transformString,
|
||||
WebkitTransform: transformString,
|
||||
transform: transformString,
|
||||
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)`,
|
||||
};
|
||||
const sizeChildrenStyle: React.CSSProperties =
|
||||
typeof size === 'number' ? {
|
||||
lineHeight: `${size}px`,
|
||||
} : {};
|
||||
children = (
|
||||
<span
|
||||
className={`${prefixCls}-string`}
|
||||
ref={span => this.avatarChildren = span}
|
||||
style={{ ...sizeChildrenStyle, ...childrenStyle }}
|
||||
style={childrenStyle}
|
||||
>
|
||||
{children}
|
||||
</span>
|
||||
@@ -153,11 +131,7 @@ export default class Avatar extends React.Component<AvatarProps, AvatarState> {
|
||||
}
|
||||
}
|
||||
return (
|
||||
<span
|
||||
{...others}
|
||||
style={{ ...sizeStyle, ...others.style }}
|
||||
className={classString}
|
||||
>
|
||||
<span {...others} className={classString}>
|
||||
{children}
|
||||
</span>
|
||||
);
|
||||
|
||||
@@ -1,23 +1,17 @@
|
||||
---
|
||||
category: Components
|
||||
subtitle: 头像
|
||||
type: 数据展示
|
||||
type: Data Display
|
||||
title: Avatar
|
||||
---
|
||||
|
||||
用来代表用户或事物，支持图片、图标或字符展示。
|
||||
|
||||
## 设计师专属
|
||||
|
||||
安装 [Kitchen Sketch 插件 💎](https://kitchen.alipay.com)，一键填充高逼格头像和文本.
|
||||
|
||||
## API
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| icon | 设置头像的图标类型，参考 `Icon` 组件 | string | - |
|
||||
| shape | 指定头像的形状 | Enum{ 'circle', 'square' } | `circle` |
|
||||
| size | 设置头像的大小 | number \| Enum{ 'large', 'small', 'default' } | `default` |
|
||||
| size | 设置头像的大小 | Enum{ 'large', 'small', 'default' } | `default` |
|
||||
| src | 图片类头像的资源地址 | string | - |
|
||||
| alt | 图像无法显示时的替代文本 | string | - |
|
||||
| onError | 图片加载失败的事件，返回 false 会关闭组件默认的 fallback 行为 | () => boolean | - |
|
||||
|
||||
@@ -43,18 +43,12 @@
|
||||
width: @size;
|
||||
height: @size;
|
||||
line-height: @size;
|
||||
border-radius: 50%;
|
||||
border-radius: @size / 2;
|
||||
|
||||
& > * {
|
||||
line-height: @size;
|
||||
}
|
||||
|
||||
&-string {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform-origin: 0 center;
|
||||
}
|
||||
|
||||
&.@{avatar-prefix-cls}-icon {
|
||||
font-size: @font-size;
|
||||
}
|
||||
|
||||
@@ -4,7 +4,9 @@ import addEventListener from 'rc-util/lib/Dom/addEventListener';
|
||||
import classNames from 'classnames';
|
||||
import omit from 'omit.js';
|
||||
import getScroll from '../_util/getScroll';
|
||||
import raf from 'raf';
|
||||
import getRequestAnimationFrame from '../_util/getRequestAnimationFrame';
|
||||
|
||||
const reqAnimFrame = getRequestAnimationFrame();
|
||||
|
||||
const easeInOutCubic = (t: number, b: number, c: number, d: number) => {
|
||||
const cc = c - b;
|
||||
@@ -49,7 +51,7 @@ export default class BackTop extends React.Component<BackTopProps, any> {
|
||||
const getTarget = this.props.target || getDefaultTarget;
|
||||
const targetNode = getTarget();
|
||||
if (targetNode === window) {
|
||||
return window.pageYOffset || document.body.scrollTop || document.documentElement!.scrollTop;
|
||||
return window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop;
|
||||
}
|
||||
return (targetNode as HTMLElement).scrollTop;
|
||||
}
|
||||
@@ -62,12 +64,10 @@ export default class BackTop extends React.Component<BackTopProps, any> {
|
||||
const time = timestamp - startTime;
|
||||
this.setScrollTop(easeInOutCubic(time, scrollTop, 0, 450));
|
||||
if (time < 450) {
|
||||
raf(frameFunc);
|
||||
} else {
|
||||
this.setScrollTop(0);
|
||||
reqAnimFrame(frameFunc);
|
||||
}
|
||||
};
|
||||
raf(frameFunc);
|
||||
reqAnimFrame(frameFunc);
|
||||
(this.props.onClick || noop)(e);
|
||||
}
|
||||
|
||||
@@ -76,7 +76,7 @@ export default class BackTop extends React.Component<BackTopProps, any> {
|
||||
const targetNode = getTarget();
|
||||
if (targetNode === window) {
|
||||
document.body.scrollTop = value;
|
||||
document.documentElement!.scrollTop = value;
|
||||
document.documentElement.scrollTop = value;
|
||||
} else {
|
||||
(targetNode as HTMLElement).scrollTop = value;
|
||||
}
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
category: Components
|
||||
type: 其他
|
||||
type: Other
|
||||
subtitle: 回到顶部
|
||||
title: BackTop
|
||||
---
|
||||
|
||||
@@ -3,7 +3,7 @@ import { createElement, Component } from 'react';
|
||||
import omit from 'omit.js';
|
||||
import classNames from 'classnames';
|
||||
|
||||
function getNumberArray(num: string | number | undefined | null) {
|
||||
function getNumberArray(num: string | number | undefined) {
|
||||
return num ?
|
||||
num.toString()
|
||||
.split('')
|
||||
@@ -14,16 +14,16 @@ function getNumberArray(num: string | number | undefined | null) {
|
||||
export interface ScrollNumberProps {
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
count?: string | number | null;
|
||||
count?: string | number;
|
||||
component?: string;
|
||||
onAnimated?: Function;
|
||||
style?: React.CSSProperties;
|
||||
title?: string | number | null;
|
||||
title?: string | number;
|
||||
}
|
||||
|
||||
export interface ScrollNumberState {
|
||||
animateStarted?: boolean;
|
||||
count?: string | number | null;
|
||||
count?: string | number;
|
||||
}
|
||||
|
||||
export default class ScrollNumber extends Component<ScrollNumberProps, ScrollNumberState> {
|
||||
|
||||
@@ -370,21 +370,7 @@ exports[`renders ./components/badge/demo/change.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-minus"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="minus"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M872 474H152c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h720c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</button>
|
||||
<button
|
||||
class="ant-btn"
|
||||
@@ -392,21 +378,7 @@ exports[`renders ./components/badge/demo/change.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-plus"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="plus"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M848 474H550V152h-76v322H176c-4.4 0-8 3.6-8 8v60c0 4.4 3.6 8 8 8h298v322h76V550h298c4.4 0 8-3.6 8-8v-60c0-4.4-3.6-8-8-8z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
@@ -425,17 +397,15 @@ exports[`renders ./components/badge/demo/change.md correctly 1`] = `
|
||||
data-show="true"
|
||||
/>
|
||||
</span>
|
||||
<button
|
||||
aria-checked="true"
|
||||
<span
|
||||
checked=""
|
||||
class="ant-switch ant-switch-checked"
|
||||
role="switch"
|
||||
type="button"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="ant-switch-inner"
|
||||
/>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
@@ -447,21 +417,7 @@ exports[`renders ./components/badge/demo/dot.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-notification"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="notification"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M880 112c-3.8 0-7.7.7-11.6 2.3L292 345.9H128c-8.8 0-16 7.4-16 16.6v299c0 9.2 7.2 16.6 16 16.6h101.7c-3.7 11.6-5.7 23.9-5.7 36.4 0 65.9 53.8 119.5 120 119.5 55.4 0 102.1-37.6 115.9-88.4l408.6 164.2c3.9 1.5 7.8 2.3 11.6 2.3 16.9 0 32-14.2 32-33.2V145.2C912 126.2 897 112 880 112zM344 762.3c-26.5 0-48-21.4-48-47.8 0-11.2 3.9-21.9 11-30.4l84.9 34.1c-2 24.6-22.7 44.1-47.9 44.1zm496 58.4L318.8 611.3l-12.9-5.2H184V417.9h121.9l12.9-5.2L840 203.3v617.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<sup
|
||||
class="ant-scroll-number ant-badge-dot"
|
||||
data-show="true"
|
||||
@@ -472,21 +428,7 @@ exports[`renders ./components/badge/demo/dot.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-notification"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="notification"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M880 112c-3.8 0-7.7.7-11.6 2.3L292 345.9H128c-8.8 0-16 7.4-16 16.6v299c0 9.2 7.2 16.6 16 16.6h101.7c-3.7 11.6-5.7 23.9-5.7 36.4 0 65.9 53.8 119.5 120 119.5 55.4 0 102.1-37.6 115.9-88.4l408.6 164.2c3.9 1.5 7.8 2.3 11.6 2.3 16.9 0 32-14.2 32-33.2V145.2C912 126.2 897 112 880 112zM344 762.3c-26.5 0-48-21.4-48-47.8 0-11.2 3.9-21.9 11-30.4l84.9 34.1c-2 24.6-22.7 44.1-47.9 44.1zm496 58.4L318.8 611.3l-12.9-5.2H184V417.9h121.9l12.9-5.2L840 203.3v617.4z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</span>
|
||||
<span
|
||||
class="ant-badge"
|
||||
@@ -1675,177 +1617,3 @@ exports[`renders ./components/badge/demo/status.md correctly 1`] = `
|
||||
</span>
|
||||
</div>
|
||||
`;
|
||||
|
||||
exports[`renders ./components/badge/demo/title.md correctly 1`] = `
|
||||
<div>
|
||||
<span
|
||||
class="ant-badge"
|
||||
>
|
||||
<a
|
||||
class="head-example"
|
||||
href="#"
|
||||
/>
|
||||
<sup
|
||||
class="ant-scroll-number ant-badge-count"
|
||||
data-show="true"
|
||||
title="Custom hover text"
|
||||
>
|
||||
<span
|
||||
class="ant-scroll-number-only"
|
||||
style="transition:none;-ms-transform:translateY(-1500%);-webkit-transform:translateY(-1500%);transform:translateY(-1500%)"
|
||||
>
|
||||
<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=""
|
||||
>
|
||||
1
|
||||
</p>
|
||||
<p
|
||||
class=""
|
||||
>
|
||||
2
|
||||
</p>
|
||||
<p
|
||||
class=""
|
||||
>
|
||||
3
|
||||
</p>
|
||||
<p
|
||||
class=""
|
||||
>
|
||||
4
|
||||
</p>
|
||||
<p
|
||||
class="current"
|
||||
>
|
||||
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>
|
||||
</div>
|
||||
`;
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,65 +1,14 @@
|
||||
import React from 'react';
|
||||
import { mount, render } from 'enzyme';
|
||||
import { mount } from 'enzyme';
|
||||
import Badge from '../index';
|
||||
import Tooltip from '../../tooltip';
|
||||
|
||||
describe('Badge', () => {
|
||||
beforeEach(() => {
|
||||
jest.useFakeTimers();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
jest.useRealTimers();
|
||||
});
|
||||
|
||||
it('badge dot not scaling count > 9', () => {
|
||||
test('badge dot not scaling count > 9', () => {
|
||||
const badge = mount(<Badge count={10} dot />);
|
||||
expect(badge.find('.ant-card-multiple-words').length).toBe(0);
|
||||
});
|
||||
|
||||
it('badge dot not showing count == 0', () => {
|
||||
test('badge dot not showing count == 0', () => {
|
||||
const badge = mount(<Badge count={0} dot />);
|
||||
expect(badge.find('.ant-badge-dot').length).toBe(0);
|
||||
});
|
||||
|
||||
it('should have an overriden title attribute', () => {
|
||||
const badge = mount(<Badge count={10} title="Custom title" />);
|
||||
expect(badge.find('.ant-scroll-number').getDOMNode().attributes.getNamedItem('title').value).toEqual('Custom title');
|
||||
});
|
||||
|
||||
// https://github.com/ant-design/ant-design/issues/10626
|
||||
it('should be composable with Tooltip', () => {
|
||||
const wrapper = mount(
|
||||
<Tooltip title="Fix the error">
|
||||
<Badge status="error" />
|
||||
</Tooltip>
|
||||
);
|
||||
wrapper.find('Badge').simulate('mouseenter');
|
||||
jest.runAllTimers();
|
||||
expect(wrapper.instance().tooltip.props.visible).toBe(true);
|
||||
});
|
||||
|
||||
it('should render when count is changed', () => {
|
||||
const wrapper = mount(<Badge count={9} />);
|
||||
wrapper.setProps({ count: 10 });
|
||||
jest.runAllTimers();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
wrapper.setProps({ count: 11 });
|
||||
jest.runAllTimers();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
wrapper.setProps({ count: 11 });
|
||||
jest.runAllTimers();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
wrapper.setProps({ count: 10 });
|
||||
jest.runAllTimers();
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
jest.runAllTimers();
|
||||
wrapper.setProps({ count: 9 });
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('should be compatible with borderColor style', () => {
|
||||
const wrapper = render(<Badge count={4} style={{ backgroundColor: '#fff', color: '#999', borderColor: '#d9d9d9' }} />);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
|
||||
@@ -24,12 +24,12 @@ ReactDOM.render(
|
||||
<Badge count={0} showZero>
|
||||
<a href="#" className="head-example" />
|
||||
</Badge>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
.ant-badge:not(.ant-badge-not-a-wrapper) {
|
||||
.ant-badge:not(.ant-badge-status) {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.head-example {
|
||||
@@ -38,6 +38,5 @@ ReactDOM.render(
|
||||
border-radius: 4px;
|
||||
background: #eee;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -15,7 +15,6 @@ The count will be animated as it changes.
|
||||
|
||||
````jsx
|
||||
import { Badge, Button, Icon, Switch } from 'antd';
|
||||
|
||||
const ButtonGroup = Button.Group;
|
||||
|
||||
class Demo extends React.Component {
|
||||
|
||||
@@ -28,8 +28,8 @@ ReactDOM.render(
|
||||
<Badge dot>
|
||||
<a href="#">Link something</a>
|
||||
</Badge>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
|
||||
@@ -21,6 +21,6 @@ ReactDOM.render(
|
||||
<Badge count={5}>
|
||||
<span className="head-example" />
|
||||
</Badge>
|
||||
</a>,
|
||||
mountNode);
|
||||
</a>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -23,12 +23,6 @@ ReactDOM.render(
|
||||
<Badge count={25} />
|
||||
<Badge count={4} style={{ backgroundColor: '#fff', color: '#999', boxShadow: '0 0 0 1px #d9d9d9 inset' }} />
|
||||
<Badge count={109} style={{ backgroundColor: '#52c41a' }} />
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
.ant-badge-not-a-wrapper:not(.ant-badge-status) {
|
||||
margin-right: 8px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -30,6 +30,6 @@ ReactDOM.render(
|
||||
<Badge count={1000} overflowCount={999}>
|
||||
<a href="#" className="head-example" />
|
||||
</Badge>
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -33,6 +33,6 @@ ReactDOM.render(
|
||||
<Badge status="processing" text="Processing" />
|
||||
<br />
|
||||
<Badge status="warning" text="Warning" />
|
||||
</div>,
|
||||
mountNode);
|
||||
</div>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -1,39 +0,0 @@
|
||||
---
|
||||
order: 7
|
||||
title:
|
||||
zh-CN: 自定义标题
|
||||
en-US: Title
|
||||
---
|
||||
|
||||
## zh-CN
|
||||
|
||||
设置鼠标放在状态点上时显示的文字
|
||||
|
||||
## en-US
|
||||
|
||||
The badge will display `title` when hovered over, instead of `count`.
|
||||
|
||||
````jsx
|
||||
import { Badge } from 'antd';
|
||||
|
||||
ReactDOM.render(
|
||||
<div>
|
||||
<Badge count={5} title="Custom hover text">
|
||||
<a href="#" className="head-example" />
|
||||
</Badge>
|
||||
</div>,
|
||||
mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
.ant-badge:not(.ant-badge-not-a-wrapper) {
|
||||
margin-right: 20px;
|
||||
}
|
||||
.head-example {
|
||||
width: 42px;
|
||||
height: 42px;
|
||||
border-radius: 4px;
|
||||
background: #eee;
|
||||
display: inline-block;
|
||||
}
|
||||
</style>
|
||||
@@ -24,11 +24,10 @@ Badge normally appears in proximity to notifications or user avatars with eye-ca
|
||||
|
||||
| Property | Description | Type | Default |
|
||||
| -------- | ----------- | ---- | ------- |
|
||||
| count | Number to show in badge | ReactNode | |
|
||||
| count | Number to show in badge | number\|ReactNode | |
|
||||
| dot | Whether to display a red dot instead of `count` | boolean | `false` |
|
||||
| offset | set offset of the badge dot, like`[x, y]` | `[number, number]` | - |
|
||||
| overflowCount | Max count to show | number | 99 |
|
||||
| showZero | Whether to show badge when `count` is zero | boolean | `false` |
|
||||
| status | Set Badge as a status dot | `success` \| `processing` \| `default` \| `error` \| `warning` | `''` |
|
||||
| text | If `status` is set, `text` sets the display text of the status `dot` | string | `''` |
|
||||
| title | Text to show when hovering over the badge | string | `count` |
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import PropTypes from 'prop-types';
|
||||
import Animate from 'rc-animate';
|
||||
import ScrollNumber from './ScrollNumber';
|
||||
import classNames from 'classnames';
|
||||
@@ -8,7 +8,7 @@ export { ScrollNumberProps } from './ScrollNumber';
|
||||
|
||||
export interface BadgeProps {
|
||||
/** Number to show in badge */
|
||||
count?: number | string | null;
|
||||
count?: number | string;
|
||||
showZero?: boolean;
|
||||
/** Max count to show */
|
||||
overflowCount?: number;
|
||||
@@ -21,7 +21,6 @@ export interface BadgeProps {
|
||||
status?: 'success' | 'processing' | 'default' | 'error' | 'warning';
|
||||
text?: string;
|
||||
offset?: [number | string, number | string];
|
||||
title?: string;
|
||||
}
|
||||
|
||||
export default class Badge extends React.Component<BadgeProps, any> {
|
||||
@@ -58,8 +57,7 @@ export default class Badge extends React.Component<BadgeProps, any> {
|
||||
status,
|
||||
text,
|
||||
offset,
|
||||
title,
|
||||
...restProps
|
||||
...restProps,
|
||||
} = this.props;
|
||||
let displayCount = (count as number) > (overflowCount as number) ? `${overflowCount}+` : count;
|
||||
const isZero = displayCount === '0' || displayCount === 0;
|
||||
@@ -85,14 +83,14 @@ export default class Badge extends React.Component<BadgeProps, any> {
|
||||
[`${prefixCls}-not-a-wrapper`]: !children,
|
||||
});
|
||||
const styleWithOffset = offset ? {
|
||||
right: -parseInt(offset[0] as string, 10),
|
||||
marginTop: offset[1],
|
||||
marginTop: offset[0],
|
||||
marginLeft: offset[1],
|
||||
...style,
|
||||
} : style;
|
||||
// <Badge status="success" />
|
||||
if (!children && status) {
|
||||
return (
|
||||
<span {...restProps} className={badgeCls} style={styleWithOffset}>
|
||||
<span className={badgeCls} style={styleWithOffset}>
|
||||
<span className={statusCls} />
|
||||
<span className={`${prefixCls}-status-text`}>{text}</span>
|
||||
</span>
|
||||
@@ -105,9 +103,8 @@ export default class Badge extends React.Component<BadgeProps, any> {
|
||||
data-show={!hidden}
|
||||
className={scrollNumberCls}
|
||||
count={displayCount}
|
||||
title={title || count}
|
||||
title={count}
|
||||
style={styleWithOffset}
|
||||
key="scrollNumber"
|
||||
/>
|
||||
);
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
---
|
||||
category: Components
|
||||
subtitle: 徽标数
|
||||
type: 数据展示
|
||||
type: Data Display
|
||||
title: Badge
|
||||
---
|
||||
|
||||
@@ -25,11 +25,10 @@ title: Badge
|
||||
|
||||
| 参数 | 说明 | 类型 | 默认值 |
|
||||
| --- | --- | --- | --- |
|
||||
| count | 展示的数字，大于 overflowCount 时显示为 `${overflowCount}+`，为 0 时隐藏 | ReactNode | |
|
||||
| count | 展示的数字，大于 overflowCount 时显示为 `${overflowCount}+`，为 0 时隐藏 | number\|ReactNode | |
|
||||
| dot | 不展示数字，只有一个小红点 | boolean | false |
|
||||
| offset | 设置状态点的位置偏移，格式为 `[x, y]` | `[number, number]` | - |
|
||||
| overflowCount | 展示封顶的数字值 | number | 99 |
|
||||
| showZero | 当数值为 0 时，是否展示 Badge | boolean | false |
|
||||
| status | 设置 Badge 为状态点 | Enum{ 'success', 'processing, 'default', 'error', 'warning' } | '' |
|
||||
| text | 在设置了 `status` 的前提下有效，设置状态点的文本 | string | '' |
|
||||
| title | 设置鼠标放在状态点上时显示的文字 | string | `count` |
|
||||
|
||||
@@ -9,9 +9,11 @@
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
color: unset;
|
||||
vertical-align: middle;
|
||||
|
||||
&-count {
|
||||
position: absolute;
|
||||
transform: translateX(-50%);
|
||||
top: -@badge-height / 2;
|
||||
height: @badge-height;
|
||||
border-radius: @badge-height / 2;
|
||||
@@ -24,6 +26,7 @@
|
||||
font-size: @badge-font-size;
|
||||
font-weight: @badge-font-weight;
|
||||
white-space: nowrap;
|
||||
transform-origin: -10% center;
|
||||
box-shadow: 0 0 0 1px #fff;
|
||||
a,
|
||||
a:hover {
|
||||
@@ -36,6 +39,9 @@
|
||||
}
|
||||
|
||||
&-dot {
|
||||
position: absolute;
|
||||
transform: translateX(-50%);
|
||||
transform-origin: 0 center;
|
||||
top: -@badge-dot-size / 2;
|
||||
height: @badge-dot-size;
|
||||
width: @badge-dot-size;
|
||||
@@ -45,14 +51,6 @@
|
||||
box-shadow: 0 0 0 1px #fff;
|
||||
}
|
||||
|
||||
&-count,
|
||||
&-dot {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
transform: translateX(50%);
|
||||
transform-origin: 100%;
|
||||
}
|
||||
|
||||
&-status {
|
||||
line-height: inherit;
|
||||
vertical-align: baseline;
|
||||
@@ -111,18 +109,14 @@
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
&-not-a-wrapper {
|
||||
vertical-align: middle;
|
||||
&-not-a-wrapper .@{ant-prefix}-scroll-number {
|
||||
top: auto;
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.@{ant-prefix}-scroll-number {
|
||||
top: auto;
|
||||
display: block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.@{badge-prefix-cls}-count {
|
||||
transform: none;
|
||||
}
|
||||
&-not-a-wrapper .@{badge-prefix-cls}-count {
|
||||
transform: none;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -153,19 +147,19 @@
|
||||
@keyframes antZoomBadgeIn {
|
||||
0% {
|
||||
opacity: 0;
|
||||
transform: scale(0) translateX(50%);
|
||||
transform: scale(0) translateX(-50%);
|
||||
}
|
||||
100% {
|
||||
transform: scale(1) translateX(50%);
|
||||
transform: scale(1) translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes antZoomBadgeOut {
|
||||
0% {
|
||||
transform: scale(1) translateX(50%);
|
||||
transform: scale(1) translateX(-50%);
|
||||
}
|
||||
100% {
|
||||
opacity: 0;
|
||||
transform: scale(0) translateX(50%);
|
||||
transform: scale(0) translateX(-50%);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import PropTypes from 'prop-types';
|
||||
import { cloneElement } from 'react';
|
||||
import warning from '../_util/warning';
|
||||
import BreadcrumbItem from './BreadcrumbItem';
|
||||
@@ -41,7 +41,7 @@ function defaultItemRender(route: Route, params: any, routes: Route[], paths: st
|
||||
}
|
||||
|
||||
export default class Breadcrumb extends React.Component<BreadcrumbProps, any> {
|
||||
static Item: typeof BreadcrumbItem;
|
||||
static Item: any;
|
||||
|
||||
static defaultProps = {
|
||||
prefixCls: 'ant-breadcrumb',
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import PropTypes from 'prop-types';
|
||||
|
||||
export interface BreadcrumbItemProps {
|
||||
prefixCls?: string;
|
||||
|
||||
@@ -224,21 +224,7 @@ exports[`renders ./components/breadcrumb/demo/withIcon.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-home"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="home"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M946.5 505L560.1 118.8l-25.9-25.9a31.5 31.5 0 0 0-44.4 0L77.5 505a63.9 63.9 0 0 0-18.8 46c.4 35.2 29.7 63.3 64.9 63.3h42.5V940h691.8V614.3h43.4c17.1 0 33.2-6.7 45.3-18.8a63.6 63.6 0 0 0 18.7-45.3c0-17-6.7-33.1-18.8-45.2zM568 868H456V664h112v204zm217.9-325.7V868H632V640c0-22.1-17.9-40-40-40H432c-22.1 0-40 17.9-40 40v228H238.1V542.3h-96l370-369.7 23.1 23.1L882 542.3h-96.1z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
</a>
|
||||
<span
|
||||
class="ant-breadcrumb-separator"
|
||||
@@ -253,21 +239,7 @@ exports[`renders ./components/breadcrumb/demo/withIcon.md correctly 1`] = `
|
||||
>
|
||||
<i
|
||||
class="anticon anticon-user"
|
||||
>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
class=""
|
||||
data-icon="user"
|
||||
fill="currentColor"
|
||||
height="1em"
|
||||
viewBox="64 64 896 896"
|
||||
width="1em"
|
||||
>
|
||||
<path
|
||||
d="M858.5 763.6a374 374 0 0 0-80.6-119.5 375.63 375.63 0 0 0-119.5-80.6c-.4-.2-.8-.3-1.2-.5C719.5 518 760 444.7 760 362c0-137-111-248-248-248S264 225 264 362c0 82.7 40.5 156 102.8 201.1-.4.2-.8.3-1.2.5-44.8 18.9-85 46-119.5 80.6a375.63 375.63 0 0 0-80.6 119.5A371.7 371.7 0 0 0 136 901.8a8 8 0 0 0 8 8.2h60c4.4 0 7.9-3.5 8-7.8 2-77.2 33-149.5 87.8-204.3 56.7-56.7 132-87.9 212.2-87.9s155.5 31.2 212.2 87.9C779 752.7 810 825 812 902.2c.1 4.4 3.6 7.8 8 7.8h60a8 8 0 0 0 8-8.2c-1-47.8-10.9-94.3-29.5-138.2zM512 534c-45.9 0-89.1-17.9-121.6-50.4S340 407.9 340 362c0-45.9 17.9-89.1 50.4-121.6S466.1 190 512 190s89.1 17.9 121.6 50.4S684 316.1 684 362c0 45.9-17.9 89.1-50.4 121.6S557.9 534 512 534z"
|
||||
/>
|
||||
</svg>
|
||||
</i>
|
||||
/>
|
||||
<span>
|
||||
Application List
|
||||
</span>
|
||||
|
||||
@@ -1,170 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`react router react router 3 1`] = `
|
||||
<Breadcrumb
|
||||
params={
|
||||
Object {
|
||||
"id": 1,
|
||||
}
|
||||
}
|
||||
prefixCls="ant-breadcrumb"
|
||||
routes={
|
||||
Array [
|
||||
Object {
|
||||
"breadcrumbName": "Home",
|
||||
"childRoutes": Array [
|
||||
Object {
|
||||
"breadcrumbName": "Application List",
|
||||
"childRoutes": Array [
|
||||
Object {
|
||||
"breadcrumbName": "Application:id",
|
||||
"childRoutes": Array [
|
||||
Object {
|
||||
"breadcrumbName": "Detail",
|
||||
"name": "detail",
|
||||
"path": "detail",
|
||||
},
|
||||
],
|
||||
"name": "app",
|
||||
"path": ":id",
|
||||
},
|
||||
],
|
||||
"name": "apps",
|
||||
"path": "apps",
|
||||
},
|
||||
],
|
||||
"name": "home",
|
||||
"path": "/",
|
||||
},
|
||||
Object {
|
||||
"breadcrumbName": "Application List",
|
||||
"childRoutes": Array [
|
||||
Object {
|
||||
"breadcrumbName": "Application:id",
|
||||
"childRoutes": Array [
|
||||
Object {
|
||||
"breadcrumbName": "Detail",
|
||||
"name": "detail",
|
||||
"path": "detail",
|
||||
},
|
||||
],
|
||||
"name": "app",
|
||||
"path": ":id",
|
||||
},
|
||||
],
|
||||
"name": "apps",
|
||||
"path": "apps",
|
||||
},
|
||||
Object {
|
||||
"breadcrumbName": "Application:id",
|
||||
"childRoutes": Array [
|
||||
Object {
|
||||
"breadcrumbName": "Detail",
|
||||
"name": "detail",
|
||||
"path": "detail",
|
||||
},
|
||||
],
|
||||
"name": "app",
|
||||
"path": ":id",
|
||||
},
|
||||
Object {
|
||||
"breadcrumbName": "Detail",
|
||||
"name": "detail",
|
||||
"path": "detail",
|
||||
},
|
||||
]
|
||||
}
|
||||
separator="/"
|
||||
>
|
||||
<div
|
||||
className="ant-breadcrumb"
|
||||
>
|
||||
<BreadcrumbItem
|
||||
key="Home"
|
||||
prefixCls="ant-breadcrumb"
|
||||
separator="/"
|
||||
>
|
||||
<span>
|
||||
<span
|
||||
className="ant-breadcrumb-link"
|
||||
>
|
||||
<a
|
||||
href="#/"
|
||||
>
|
||||
Home
|
||||
</a>
|
||||
</span>
|
||||
<span
|
||||
className="ant-breadcrumb-separator"
|
||||
>
|
||||
/
|
||||
</span>
|
||||
</span>
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbItem
|
||||
key="Application List"
|
||||
prefixCls="ant-breadcrumb"
|
||||
separator="/"
|
||||
>
|
||||
<span>
|
||||
<span
|
||||
className="ant-breadcrumb-link"
|
||||
>
|
||||
<a
|
||||
href="#/apps"
|
||||
>
|
||||
Application List
|
||||
</a>
|
||||
</span>
|
||||
<span
|
||||
className="ant-breadcrumb-separator"
|
||||
>
|
||||
/
|
||||
</span>
|
||||
</span>
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbItem
|
||||
key="Application:id"
|
||||
prefixCls="ant-breadcrumb"
|
||||
separator="/"
|
||||
>
|
||||
<span>
|
||||
<span
|
||||
className="ant-breadcrumb-link"
|
||||
>
|
||||
<a
|
||||
href="#/apps/1"
|
||||
>
|
||||
Application1
|
||||
</a>
|
||||
</span>
|
||||
<span
|
||||
className="ant-breadcrumb-separator"
|
||||
>
|
||||
/
|
||||
</span>
|
||||
</span>
|
||||
</BreadcrumbItem>
|
||||
<BreadcrumbItem
|
||||
key="Detail"
|
||||
prefixCls="ant-breadcrumb"
|
||||
separator="/"
|
||||
>
|
||||
<span>
|
||||
<span
|
||||
className="ant-breadcrumb-link"
|
||||
>
|
||||
<span>
|
||||
Detail
|
||||
</span>
|
||||
</span>
|
||||
<span
|
||||
className="ant-breadcrumb-separator"
|
||||
>
|
||||
/
|
||||
</span>
|
||||
</span>
|
||||
</BreadcrumbItem>
|
||||
</div>
|
||||
</Breadcrumb>
|
||||
`;
|
||||
@@ -1,150 +0,0 @@
|
||||
import React from 'react';
|
||||
import { Route, Switch, Link, withRouter, MemoryRouter } from 'react-router-dom';
|
||||
import { mount } from 'enzyme';
|
||||
import Breadcrumb from '../index';
|
||||
|
||||
const Apps = () => (
|
||||
<ul className="app-list">
|
||||
<li>
|
||||
<Link to="/apps/1">Application1</Link>：<Link to="/apps/1/detail">Detail</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to="/apps/2">Application2</Link>：<Link to="/apps/2/detail">Detail</Link>
|
||||
</li>
|
||||
</ul>
|
||||
);
|
||||
|
||||
const breadcrumbNameMap = {
|
||||
'/apps': 'Application List',
|
||||
'/apps/1': 'Application1',
|
||||
'/apps/2': 'Application2',
|
||||
'/apps/1/detail': 'Detail',
|
||||
'/apps/2/detail': 'Detail',
|
||||
};
|
||||
|
||||
const Home = withRouter((props) => {
|
||||
const { location, history } = props;
|
||||
const pathSnippets = location.pathname.split('/').filter(i => i);
|
||||
const extraBreadcrumbItems = pathSnippets.map((_, index) => {
|
||||
const url = `/${pathSnippets.slice(0, index + 1).join('/')}`;
|
||||
return (
|
||||
<Breadcrumb.Item key={url}>
|
||||
<Link to={url}>
|
||||
{breadcrumbNameMap[url]}
|
||||
</Link>
|
||||
</Breadcrumb.Item>
|
||||
);
|
||||
});
|
||||
const breadcrumbItems = [(
|
||||
<Breadcrumb.Item key="home">
|
||||
<Link to="/">Home</Link>
|
||||
</Breadcrumb.Item>
|
||||
)].concat(extraBreadcrumbItems);
|
||||
return (
|
||||
<div className="demo">
|
||||
<div className="demo-nav">
|
||||
<a onClick={() => history.push('/')}>Home</a>
|
||||
<a onClick={() => history.push('/apps')}>Application List</a>
|
||||
</div>
|
||||
<Switch>
|
||||
<Route path="/apps" component={Apps} />
|
||||
<Route render={() => <span>Home Page</span>} />
|
||||
</Switch>
|
||||
<Breadcrumb>
|
||||
{breadcrumbItems}
|
||||
</Breadcrumb>
|
||||
</div>
|
||||
);
|
||||
});
|
||||
|
||||
describe('react router', () => {
|
||||
beforeAll(() => {
|
||||
jest.useFakeTimers();
|
||||
});
|
||||
|
||||
afterAll(() => {
|
||||
jest.useRealTimers();
|
||||
});
|
||||
// https://github.com/airbnb/enzyme/issues/875
|
||||
it('react router 4', () => {
|
||||
const wrapper = mount(
|
||||
<MemoryRouter initialEntries={['/']} initialIndex={0}>
|
||||
<Home />
|
||||
</MemoryRouter>
|
||||
);
|
||||
expect(wrapper.find('BreadcrumbItem').length).toBe(1);
|
||||
expect(wrapper.find('BreadcrumbItem .ant-breadcrumb-link').at(0).text()).toBe('Home');
|
||||
wrapper.find('.demo-nav a').at(1).simulate('click');
|
||||
expect(wrapper.find('BreadcrumbItem').length).toBe(2);
|
||||
expect(wrapper.find('BreadcrumbItem .ant-breadcrumb-link').at(1).text()).toBe('Application List');
|
||||
});
|
||||
|
||||
it('react router 3', () => {
|
||||
const routes = [{
|
||||
name: 'home',
|
||||
breadcrumbName: 'Home',
|
||||
path: '/',
|
||||
childRoutes: [
|
||||
{
|
||||
name: 'apps',
|
||||
breadcrumbName: 'Application List',
|
||||
path: 'apps',
|
||||
childRoutes: [
|
||||
{
|
||||
name: 'app',
|
||||
breadcrumbName: 'Application:id',
|
||||
path: ':id',
|
||||
childRoutes: [
|
||||
{
|
||||
name: 'detail',
|
||||
breadcrumbName: 'Detail',
|
||||
path: 'detail',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'apps',
|
||||
breadcrumbName: 'Application List',
|
||||
path: 'apps',
|
||||
childRoutes: [
|
||||
{
|
||||
name: 'app',
|
||||
breadcrumbName: 'Application:id',
|
||||
path: ':id',
|
||||
childRoutes: [
|
||||
{
|
||||
name: 'detail',
|
||||
breadcrumbName: 'Detail',
|
||||
path: 'detail',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'app',
|
||||
breadcrumbName: 'Application:id',
|
||||
path: ':id',
|
||||
childRoutes: [
|
||||
{
|
||||
name: 'detail',
|
||||
breadcrumbName: 'Detail',
|
||||
path: 'detail',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: 'detail',
|
||||
breadcrumbName: 'Detail',
|
||||
path: 'detail',
|
||||
}];
|
||||
const wrapper = mount(
|
||||
<Breadcrumb routes={routes} params={{ id: 1 }} />
|
||||
);
|
||||
expect(wrapper).toMatchSnapshot();
|
||||
});
|
||||
});
|
||||
@@ -22,6 +22,6 @@ ReactDOM.render(
|
||||
<Breadcrumb.Item><a href="">Application Center</a></Breadcrumb.Item>
|
||||
<Breadcrumb.Item><a href="">Application List</a></Breadcrumb.Item>
|
||||
<Breadcrumb.Item>An Application</Breadcrumb.Item>
|
||||
</Breadcrumb>,
|
||||
mountNode);
|
||||
</Breadcrumb>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
@@ -76,8 +76,8 @@ const Home = withRouter((props) => {
|
||||
ReactDOM.render(
|
||||
<Router>
|
||||
<Home />
|
||||
</Router>,
|
||||
mountNode);
|
||||
</Router>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
````css
|
||||
|
||||
@@ -51,8 +51,8 @@ ReactDOM.render(
|
||||
</Route>
|
||||
</Route>
|
||||
</Route>
|
||||
</Router>,
|
||||
mountNode);
|
||||
</Router>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
````css
|
||||
|
||||
@@ -22,6 +22,6 @@ ReactDOM.render(
|
||||
<Breadcrumb.Item href="">Application Center</Breadcrumb.Item>
|
||||
<Breadcrumb.Item href="">Application List</Breadcrumb.Item>
|
||||
<Breadcrumb.Item>An Application</Breadcrumb.Item>
|
||||
</Breadcrumb>,
|
||||
mountNode);
|
||||
</Breadcrumb>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user