mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 11:10:01 +08:00
Code Issues Actions 25 Packages Projects Releases Wiki Activity

chore: auto merge branches (#37939)

Browse Source 
chore: Feature merge master
This commit is contained in:
github-actions[bot] 2022-10-11 08:12:10 +00:00 committed by GitHub
commit 8a454a136e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
255 changed files with 14841 additions and 23764 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.github/PULL_REQUEST_TEMPLATE.md vendored
View File

@ -58,7 +58,7 @@ Describe changes from the user side, and list all potential break changes or oth
### ☑️ Self-Check before Merge
⚠️ Please check all items below before review. ⚠️
⚠️ Please check all items below before requesting a reviewing. ⚠️
- [ ] Doc is updated/provided or not needed
- [ ] Demo is updated/provided or not needed

1
.github/workflows/ui-upload.yml vendored
View File

@ -18,6 +18,7 @@ jobs:
name: deploy preview
runs-on: ubuntu-latest
if: >
github.repository == 'ant-design/ant-design' &&
github.event.workflow_run.conclusion == 'success'
steps:
- name: checkout

3
.github/workflows/ui.yml vendored
View File

@ -10,6 +10,9 @@ concurrency:
group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
cancel-in-progress: true
permissions:
contents: read
jobs:
imagesnapshot:
runs-on: ubuntu-latest

1
.jest.image.js
View File

@ -13,7 +13,6 @@ module.exports = {
},
testRegex: 'image\\.test\\.(j|t)s$',
transformIgnorePatterns,
snapshotSerializers: ['enzyme-to-json/serializer'],
globals: {
'ts-jest': {
tsConfigFile: './tsconfig.test.json',

12
.jest.js
View File

@ -1,13 +1,12 @@
const transformIgnorePatterns = [
'/dist/',
// Ignore modules without es dir.
// Update: @babel/runtime should also be transformed
'node_modules/(?!.*@(babel|ant-design))(?!array-move)[^/]+?/(?!(es|node_modules)/)',
'/node_modules/(?!array-move|react-dnd|react-dnd-html5-backend|@react-dnd|dnd-core|tween-one|@babel|@ant-design)[^/]+?/(?!(es)/)',
];
function getTestRegex(libDir) {
if (libDir === 'dist') {
return 'demo\\.test\\.js$';
return 'demo\\.test\\.(j|t)s$';
}
return '.*\\.test\\.(j|t)sx?$';
}
@ -20,12 +19,6 @@ module.exports = {
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'md'],
modulePathIgnorePatterns: ['/_site/'],
moduleNameMapper: {
'/^dnd-core$/': 'dnd-core/dist/cjs',
'/^react-dnd$/': 'react-dnd/dist/cjs',
'/^react-dnd-html5-backend$/': 'react-dnd-html5-backend/dist/cjs',
'/^react-dnd-touch-backend$/': 'react-dnd-touch-backend/dist/cjs',
'/^react-dnd-test-backend$/': 'react-dnd-test-backend/dist/cjs',
'/^react-dnd-test-utils$/': 'react-dnd-test-utils/dist/cjs',
'/\\.(css|less)$/': 'identity-obj-proxy',
},
testPathIgnorePatterns: ['/node_modules/', 'dekko', 'node', 'image.test.js', 'image.test.ts'],
@ -47,7 +40,6 @@ module.exports = {
'!components/__tests__/node.test.tsx',
],
transformIgnorePatterns,
snapshotSerializers: ['enzyme-to-json/serializer'],
globals: {
'ts-jest': {
tsConfig: './tsconfig.test.json',

3
.jest.site.js
View File

@ -10,10 +10,9 @@ module.exports = {
'\\.md$': './node_modules/@ant-design/tools/lib/jest/demoPreprocessor',
'\\.(jpg|png|gif|svg)$': './node_modules/@ant-design/tools/lib/jest/imagePreprocessor',
},
testRegex: 'check-site\\.js$',
testRegex: 'check-site\\.(j|t)s$',
testEnvironment: 'node',
transformIgnorePatterns,
snapshotSerializers: ['enzyme-to-json/serializer'],
globals: {
'ts-jest': {
tsConfigFile: './tsconfig.test.json',

33
CHANGELOG.en-US.md
View File

@ -15,6 +15,27 @@ timeline: true
---
## 4.23.5
`2022-10-10`
- 🐞 Fix Textarea with `autoSize` blink on the fist mount. [#37847](https://github.com/ant-design/ant-design/pull/37847)
- 💄 Fix Input.Password `style={{ fontSize }}`not working. [#37898](https://github.com/ant-design/ant-design/pull/37898)
- 💄 Fix Input.Textarea `style={{ resize: 'none' }}` is not working when `showCount` is applied. [#37855](https://github.com/ant-design/ant-design/pull/37855) [@kiner-tang](https://github.com/kiner-tang)
- 💄 Fix Input.Search border style in RTL. [#37865](https://github.com/ant-design/ant-design/pull/37865) [@foryuki](https://github.com/foryuki)
- 🇷🇺 Fix Russian translation for Transfer.selectInvert. [#37858](https://github.com/ant-design/ant-design/pull/37858) [@svtslav](https://github.com/svtslav)
- 🇵🇹 Add missing Portuguese translations. [#37857](https://github.com/ant-design/ant-design/pull/37857) [@ernestfolch](https://github.com/ernestfolch)
- ⚡️ Update Table and Tree for improve state performance. [#37875](https://github.com/ant-design/ant-design/pull/37875) [@sunteago](https://github.com/sunteago)
- TypeScript
- 🤖 Update type definition for a part of components. [#37861](https://github.com/ant-design/ant-design/pull/37861) [@zheeeng](https://github.com/zheeeng)
## 4.23.4
`2022-10-01`
- 🐞 Fix Typography ellipsis percision bug. [#37802](https://github.com/ant-design/ant-design/pull/37802) [@zheeeng](https://github.com/zheeeng)
- 🐞 Fix Input.Password that should not have value prop on input when inputing. [#37801](https://github.com/ant-design/ant-design/pull/37801) [@MadCcc](https://github.com/MadCcc)
## 4.23.3
`2022-09-27`
@ -316,7 +337,7 @@ timeline: true
- 🐞 Fix Drawer close twice `children` will undefined. [#35853](https://github.com/ant-design/ant-design/pull/35853) [@crazyair](https://github.com/crazyair)
- Skeleton
- 💄 Remove Skeleton default `margin-top` style. [#35848](https://github.com/ant-design/ant-design/pull/35848)
- 💄 Optimize Skeleton `active` animation perfermance. [#35836](https://github.com/ant-design/ant-design/pull/35836) [@slotDumpling](https://github.com/slotDumpling)
- 💄 Optimize Skeleton `active` animation performance. [#35836](https://github.com/ant-design/ant-design/pull/35836) [@slotDumpling](https://github.com/slotDumpling)
- 💄 Remove `!important` in Radio style with `disabled`. [#35920](https://github.com/ant-design/ant-design/pull/35920)
- TypeScript
- 🤖 Fix Form.List type `FormListFieldData` missing property `fieldKey`. [#35884](https://github.com/ant-design/ant-design/pull/35884) [@nanianlisao](https://github.com/nanianlisao)
@ -671,7 +692,7 @@ timeline: true
- 🆕 Menu support `home` and `end` keyboard navigate. [#33642](https://github.com/ant-design/ant-design/pull/33642) [@dartamonov-vertex](https://github.com/dartamonov-vertex)
- Table
- ⚡️ Improve Table perfermance significantly when mount and unmount. [#33554](https://github.com/ant-design/ant-design/pull/33554)
- ⚡️ Improve Table performance significantly when mount and unmount. [#33554](https://github.com/ant-design/ant-design/pull/33554)
- 🐞 Fix Table emptynode fixed display. [#33610](https://github.com/ant-design/ant-design/pull/33610) [@hemengke1997](https://github.com/hemengke1997)
- 🐞 Fix Table tree data hover error. [#33638](https://github.com/ant-design/ant-design/pull/33638) [@LongHaoo](https://github.com/LongHaoo)
- Form
@ -1426,7 +1447,7 @@ Wrong release is the same as `4.12.0`, if you need to lock the version, you need
- 🐞 Fix multiple Image.PreviewGroup contain same image. [#28881](https://github.com/ant-design/ant-design/issues/28881)
- ConfigProvider
- 🆕 ConfigProvider supports `iconPrefixCls`. [#28924](https://github.com/ant-design/ant-design/pull/28924)
- ⚡️ Optimize ConfigProvider props updating perfermance. [#28792](https://github.com/ant-design/ant-design/pull/28792) [@zxc0328](https://github.com/zxc0328)
- ⚡️ Optimize ConfigProvider props updating performance. [#28792](https://github.com/ant-design/ant-design/pull/28792) [@zxc0328](https://github.com/zxc0328)
- 💄 Tweak TreeSelect filter highlight color. [#28984](https://github.com/ant-design/ant-design/pull/28984)
- 💄 Fix Select item align style with custom `tagRender`. [#28962](https://github.com/ant-design/ant-design/pull/28962)
- Form
@ -2461,7 +2482,7 @@ It is a wrong release which same as `4.10.3`, don't use it.
- 💄 Add Menu default `text-align` style. [#24253](https://github.com/ant-design/ant-design/pull/24253)
- 🛠 Refactor List code. [#24280](https://github.com/ant-design/ant-design/pull/24280) [@hengkx](https://github.com/hengkx)
- 🛠 Modify the Alert with hooks to support strict mode. [#24236](https://github.com/ant-design/ant-design/pull/24236) [@hengkx](https://github.com/hengkx)
- 🐞Fix Card perfermance bug when use with `react-split`. [#24425](https://github.com/ant-design/ant-design/pull/24425)
- 🐞Fix Card performance bug when use with `react-split`. [#24425](https://github.com/ant-design/ant-design/pull/24425)
- TypeScript
- 🛠Cascader ts definition update. [#24393](https://github.com/ant-design/ant-design/pull/24393) [@zhangyu1818](https://github.com/zhangyu1818)
- 🐞 Fix TS error of `Could not find a declaration rc-upload`. [#24325](https://github.com/ant-design/ant-design/pull/24325)
@ -2751,7 +2772,7 @@ It is a wrong release which same as `4.10.3`, don't use it.
- 💄 Adjust RangePicker arrow style. [#22847](https://github.com/ant-design/ant-design/pull/22847)
- 🐞 Fix Text with `ellipsis` align issue. [#22836](https://github.com/ant-design/ant-design/pull/22836)
- 💄 Tweak `@info-color` should be `@primary-color` defaultly. [#22723](https://github.com/ant-design/ant-design/pull/22723)
- 🐞 Fix BackTop not working in iframe and improve it's perfermance. [#22788](https://github.com/ant-design/ant-design/pull/22788)
- 🐞 Fix BackTop not working in iframe and improve it's performance. [#22788](https://github.com/ant-design/ant-design/pull/22788)
- 🐞 Fix Select inconsistent height when `mode="multiple"` and `size="large" />`. [#22904](https://github.com/ant-design/ant-design/pull/22904)
- 🐞 Fix Radio less variable. [#22803](https://github.com/ant-design/ant-design/pull/22803) [@yoyo837](https://github.com/yoyo837)
- 🐞 Fix Card Tabs do not support small size. [#22666](https://github.com/ant-design/ant-design/pull/22666) [@MrHeer](https://github.com/MrHeer)
@ -2932,7 +2953,7 @@ It is a wrong release which same as `4.10.3`, don't use it.
- Form
- 🐞 Fix nest Form.Item dynamic remove will warning in React. [#21896](https://github.com/ant-design/ant-design/pull/21896)
- ⚡️ Form `useForm` now return same instance for perfermance. [#21927](https://github.com/ant-design/ant-design/pull/21927)
- ⚡️ Form `useForm` now return same instance for performance. [#21927](https://github.com/ant-design/ant-design/pull/21927)
- ⚡️ Refactor Form.Item render logic that will only render once when children is a pure component. [#21991](https://github.com/ant-design/ant-design/pull/21991)
- ⚡️ FormContext use a memoized value to avoid trigger FormItem's unintentional renders. [#21980](https://github.com/ant-design/ant-design/pull/21980) [@qiqiboy](https://github.com/qiqiboy)
- Table

21
CHANGELOG.zh-CN.md
View File

@ -15,6 +15,27 @@ timeline: true
---
## 4.23.5
`2022-10-10`
- 🐞 修复 Textarea 配置 `autoSize` 在第一次渲染时闪烁的问题。[#37847](https://github.com/ant-design/ant-design/pull/37847)
- 💄 修复 Input.Password 不支持 `style={{ fontSize }}` 的问题。[#37898](https://github.com/ant-design/ant-design/pull/37898)
- 💄 修复 Input.Textarea 当指定 `showCount` 时 `style={{ resize: 'none' }}` 样式设定失效的问题。[#37855](https://github.com/ant-design/ant-design/pull/37855) [@kiner-tang](https://github.com/kiner-tang)
- 💄 修复 RTL 排版中 Input.Search 边框样式问题。[#37865](https://github.com/ant-design/ant-design/pull/37865) [@foryuki](https://github.com/foryuki)
- 🇷🇺 修复 Transfer.selectInvert 的俄语翻译。[#37858](https://github.com/ant-design/ant-design/pull/37858) [@svtslav](https://github.com/svtslav)
- 🇵🇹 添加缺失的葡萄牙语翻译。[#37857](https://github.com/ant-design/ant-design/pull/37857) [@ernestfolch](https://github.com/ernestfolch)
- ⚡️ 提升 Table 及 Tree 的 State 性能。[#37875](https://github.com/ant-design/ant-design/pull/37875) [@sunteago](https://github.com/sunteago)
- TypeScript
- 🤖 更新部分组件的类型声明。[#37861](https://github.com/ant-design/ant-design/pull/37861) [@zheeeng](https://github.com/zheeeng)
## 4.23.4
`2022-10-01`
- 🐞 修复 Typography `ellipsis` 精度问题。[#37802](https://github.com/ant-design/ant-design/pull/37802) [@zheeeng](https://github.com/zheeeng)
- 🐞 修复 Input.Password 在输入时 input 上会有 `value` 属性的问题。[#37801](https://github.com/ant-design/ant-design/pull/37801) [@MadCcc](https://github.com/MadCcc)
## 4.23.3
`2022-09-27`

4
components/affix/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -36,7 +36,7 @@ Array [
exports[`renders ./components/affix/demo/debug.md extend context correctly 1`] = `
<div
style="height: 10000px;"
style="height:10000px"
>
<div>
Top
@ -46,7 +46,7 @@ exports[`renders ./components/affix/demo/debug.md extend context correctly 1`] =
class=""
>
<div
style="background: red;"
style="background:red"
>
<button
class="ant-btn ant-btn-primary"

4
components/affix/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -36,7 +36,7 @@ Array [
exports[`renders ./components/affix/demo/debug.md correctly 1`] = `
<div
style="height: 10000px;"
style="height:10000px"
>
<div>
Top
@ -46,7 +46,7 @@ exports[`renders ./components/affix/demo/debug.md correctly 1`] = `
class=""
>
<div
style="background: red;"
style="background:red"
>
<button
class="ant-btn ant-btn-primary"

2
components/affix/index.tsx
View File

@ -77,7 +77,7 @@ class Affix extends React.Component<InternalAffixProps, AffixState> {
return target;
}
return getTargetContainer || getDefaultTarget;
return getTargetContainer ?? getDefaultTarget;
}
// Event handler

2
components/alert/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -214,7 +214,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm"

2
components/alert/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -214,7 +214,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm"

2
components/alert/index.tsx
View File

@ -40,7 +40,7 @@ export interface AlertProps {
className?: string;
banner?: boolean;
icon?: React.ReactNode;
/** Custome closeIcon */
/** Custom closeIcon */
closeIcon?: React.ReactNode;
action?: React.ReactNode;
onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;

2
components/anchor/Anchor.tsx
View File

@ -135,7 +135,7 @@ class Anchor extends React.Component<InternalAnchorProps, AnchorState, ConfigCon
const { getTargetContainer } = this.context;
const { getContainer } = this.props;
const getFunc = getContainer || getTargetContainer || getDefaultContainer;
const getFunc = getContainer ?? getTargetContainer ?? getDefaultContainer;
return getFunc();
};

19
components/anchor/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -7,7 +7,7 @@ exports[`renders ./components/anchor/demo/basic.md extend context correctly 1`]
>
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor"
@ -83,7 +83,7 @@ exports[`renders ./components/anchor/demo/basic.md extend context correctly 1`]
exports[`renders ./components/anchor/demo/customizeHighlight.md extend context correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -92,8 +92,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.md extend context c
class="ant-anchor-ink"
>
<span
class="ant-anchor-ink-ball visible"
style="top: -4.5px;"
class="ant-anchor-ink-ball"
/>
</div>
<div
@ -108,10 +107,10 @@ exports[`renders ./components/anchor/demo/customizeHighlight.md extend context c
</a>
</div>
<div
class="ant-anchor-link ant-anchor-link-active"
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title ant-anchor-link-title-active"
class="ant-anchor-link-title"
href="#components-anchor-demo-static"
title="Static demo"
>
@ -158,7 +157,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.md extend context c
exports[`renders ./components/anchor/demo/onChange.md extend context correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -232,7 +231,7 @@ exports[`renders ./components/anchor/demo/onChange.md extend context correctly 1
exports[`renders ./components/anchor/demo/onClick.md extend context correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -306,7 +305,7 @@ exports[`renders ./components/anchor/demo/onClick.md extend context correctly 1`
exports[`renders ./components/anchor/demo/static.md extend context correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -384,7 +383,7 @@ exports[`renders ./components/anchor/demo/targetOffset.md extend context correct
>
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor"

19
components/anchor/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -7,7 +7,7 @@ exports[`renders ./components/anchor/demo/basic.md correctly 1`] = `
>
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor"
@ -83,7 +83,7 @@ exports[`renders ./components/anchor/demo/basic.md correctly 1`] = `
exports[`renders ./components/anchor/demo/customizeHighlight.md correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -92,8 +92,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.md correctly 1`] =
class="ant-anchor-ink"
>
<span
class="ant-anchor-ink-ball visible"
style="top: -4.5px;"
class="ant-anchor-ink-ball"
/>
</div>
<div
@ -108,10 +107,10 @@ exports[`renders ./components/anchor/demo/customizeHighlight.md correctly 1`] =
</a>
</div>
<div
class="ant-anchor-link ant-anchor-link-active"
class="ant-anchor-link"
>
<a
class="ant-anchor-link-title ant-anchor-link-title-active"
class="ant-anchor-link-title"
href="#components-anchor-demo-static"
title="Static demo"
>
@ -158,7 +157,7 @@ exports[`renders ./components/anchor/demo/customizeHighlight.md correctly 1`] =
exports[`renders ./components/anchor/demo/onChange.md correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -232,7 +231,7 @@ exports[`renders ./components/anchor/demo/onChange.md correctly 1`] = `
exports[`renders ./components/anchor/demo/onClick.md correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -306,7 +305,7 @@ exports[`renders ./components/anchor/demo/onClick.md correctly 1`] = `
exports[`renders ./components/anchor/demo/static.md correctly 1`] = `
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor ant-anchor-fixed"
@ -384,7 +383,7 @@ exports[`renders ./components/anchor/demo/targetOffset.md correctly 1`] = `
>
<div
class="ant-anchor-wrapper"
style="max-height: 100vh;"
style="max-height:100vh"
>
<div
class="ant-anchor"

376
components/auto-complete/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

184
components/auto-complete/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -4,7 +4,7 @@ exports[`renders ./components/auto-complete/demo/basic.md correctly 1`] = `
Array [
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -13,14 +13,13 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -37,7 +36,7 @@ Array [
<br />,
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -46,14 +45,13 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -72,7 +70,7 @@ Array [
exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1`] = `
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
style="width: 250px;"
style="width:250px"
>
<div
class="ant-select-selector"
@ -87,14 +85,13 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
class="ant-input-wrapper ant-input-group"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input ant-input-lg"
id="rc_select_test"
placeholder="input here"
role="combobox"
type="search"
@ -141,7 +138,7 @@ exports[`renders ./components/auto-complete/demo/certain-category.md correctly 1
exports[`renders ./components/auto-complete/demo/custom.md correctly 1`] = `
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -150,17 +147,16 @@ exports[`renders ./components/auto-complete/demo/custom.md correctly 1`] = `
class="ant-select-selection-search"
>
<textarea
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input ant-select-selection-search-input custom"
id="rc_select_test"
placeholder="input here"
role="combobox"
style="height: 50px;"
style="height:50px"
type="search"
/>
</span>
@ -174,7 +170,7 @@ exports[`renders ./components/auto-complete/demo/custom.md correctly 1`] = `
exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
<form
class="ant-form ant-form-horizontal"
style="margin: 0px auto;"
style="margin:0 auto"
>
<div
class="ant-form-item"
@ -211,14 +207,13 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -270,15 +265,14 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -291,7 +285,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -350,7 +344,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
style="width: 30%;"
style="width:30%"
>
<div
class="ant-select-selector"
@ -360,15 +354,14 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -381,7 +374,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -415,14 +408,13 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -477,14 +469,13 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
class="ant-input-affix-wrapper ant-select-selection-search-input"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -554,7 +545,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
style="width: 30%;"
style="width:30%"
>
<div
class="ant-select-selector"
@ -564,15 +555,14 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -585,7 +575,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -622,14 +612,13 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
class="ant-input-affix-wrapper ant-select-selection-search-input"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -700,7 +689,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
style="width: 30%;"
style="width:30%"
>
<div
class="ant-select-selector"
@ -710,15 +699,14 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -731,7 +719,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -771,14 +759,13 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
class="ant-input-wrapper ant-input-group"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -855,7 +842,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
style="width: 20%;"
style="width:20%"
>
<div
class="ant-select-selector"
@ -865,15 +852,14 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -886,7 +872,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -926,14 +912,13 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
class="ant-input-wrapper ant-input-group"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -1013,7 +998,7 @@ exports[`renders ./components/auto-complete/demo/form-debug.md correctly 1`] = `
exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly 1`] = `
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -1022,14 +1007,13 @@ exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -1047,7 +1031,7 @@ exports[`renders ./components/auto-complete/demo/non-case-sensitive.md correctly
exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -1056,14 +1040,13 @@ exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -1081,15 +1064,15 @@ exports[`renders ./components/auto-complete/demo/options.md correctly 1`] = `
exports[`renders ./components/auto-complete/demo/status.md correctly 1`] = `
<div
class="ant-space ant-space-vertical"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-select ant-select-status-error ant-select-auto-complete ant-select-single ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -1098,14 +1081,13 @@ exports[`renders ./components/auto-complete/demo/status.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -1122,7 +1104,7 @@ exports[`renders ./components/auto-complete/demo/status.md correctly 1`] = `
>
<div
class="ant-select ant-select-status-warning ant-select-auto-complete ant-select-single ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -1131,14 +1113,13 @@ exports[`renders ./components/auto-complete/demo/status.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -1156,7 +1137,7 @@ exports[`renders ./components/auto-complete/demo/status.md correctly 1`] = `
exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly 1`] = `
<div
class="ant-select ant-select-auto-complete ant-select-single ant-select-customize-input ant-select-show-search"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-select-selector"
@ -1171,14 +1152,13 @@ exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly
class="ant-input-wrapper ant-input-group"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-input ant-input-lg"
id="rc_select_test"
placeholder="input here"
role="combobox"
type="search"

117
components/avatar/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -38,7 +38,7 @@ Array [
>
<span
class="ant-scroll-number-only"
style="transition: none;"
style="transition:none"
>
<span
class="ant-scroll-number-only-unit current"
@ -90,7 +90,7 @@ Array [
<div>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="width: 64px; height: 64px; line-height: 64px; font-size: 32px;"
style="width:64px;height:64px;line-height:64px;font-size:32px"
>
<span
aria-label="user"
@ -185,7 +185,7 @@ Array [
<div>
<span
class="ant-avatar ant-avatar-square ant-avatar-icon"
style="width: 64px; height: 64px; line-height: 64px; font-size: 32px;"
style="width:64px;height:64px;line-height:64px;font-size:32px"
>
<span
aria-label="user"
@ -284,18 +284,18 @@ exports[`renders ./components/avatar/demo/dynamic.md extend context correctly 1`
Array [
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color: rgb(245, 106, 0); vertical-align: middle;"
style="background-color:#f56a00;vertical-align:middle"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
U
</span>
</span>,
<button
class="ant-btn ant-btn-default ant-btn-sm"
style="margin: 0px 16px; vertical-align: middle;"
style="margin:0 16px;vertical-align:middle"
type="button"
>
<span>
@ -304,7 +304,7 @@ Array [
</button>,
<button
class="ant-btn ant-btn-default ant-btn-sm"
style="vertical-align: middle;"
style="vertical-align:middle"
type="button"
>
<span>
@ -347,18 +347,18 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"
@ -382,8 +382,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -406,7 +406,7 @@ Array [
</div>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(24, 144, 255);"
style="background-color:#1890ff"
>
<span
aria-label="ant-design"
@ -445,30 +445,30 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"
style="color:#f56a00;background-color:#fde3cf"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
+2
</span>
</span>
<div>
<div
class="ant-popover ant-avatar-group-popover ant-zoom-big-appear ant-zoom-big-appear-prepare ant-zoom-big"
style="opacity: 0;"
class="ant-popover ant-avatar-group-popover"
style="opacity:0"
>
<div
class="ant-popover-content"
@ -489,7 +489,7 @@ Array [
>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"
@ -513,8 +513,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -537,7 +537,7 @@ Array [
</div>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(24, 144, 255);"
style="background-color:#1890ff"
>
<span
aria-label="ant-design"
@ -581,30 +581,30 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"
style="color:#f56a00;background-color:#fde3cf"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
+2
</span>
</span>
<div>
<div
class="ant-popover ant-avatar-group-popover ant-zoom-big-appear ant-zoom-big-appear-prepare ant-zoom-big"
style="opacity: 0;"
class="ant-popover ant-avatar-group-popover"
style="opacity:0"
>
<div
class="ant-popover-content"
@ -625,7 +625,7 @@ Array [
>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"
@ -649,8 +649,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -673,7 +673,7 @@ Array [
</div>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(24, 144, 255);"
style="background-color:#1890ff"
>
<span
aria-label="ant-design"
@ -717,30 +717,30 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207); cursor: pointer;"
style="color:#f56a00;background-color:#fde3cf;cursor:pointer"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
+2
</span>
</span>
<div>
<div
class="ant-popover ant-avatar-group-popover ant-zoom-big-appear ant-zoom-big-appear-prepare ant-zoom-big"
style="opacity: 0;"
class="ant-popover ant-avatar-group-popover"
style="opacity:0"
>
<div
class="ant-popover-content"
@ -761,7 +761,7 @@ Array [
>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"
@ -785,8 +785,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -809,7 +809,7 @@ Array [
</div>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(24, 144, 255);"
style="background-color:#1890ff"
>
<span
aria-label="ant-design"
@ -843,7 +843,6 @@ Array [
exports[`renders ./components/avatar/demo/responsive.md extend context correctly 1`] = `
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="width: 24px; height: 24px; line-height: 24px; font-size: 12px;"
>
<span
aria-label="ant-design"
@ -896,44 +895,44 @@ Array [
<br />,
<br />,
<div
style="text-align: center; transform: scale(1); margin-top: 24px;"
style="text-align:center;transform:scale(1);margin-top:24px"
>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background: rgb(114, 101, 230); display: none;"
style="background:#7265e6;display:none"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
Avatar
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
style="background: rgb(0, 162, 174); display: none;"
style="background:#00a2ae;display:none"
>
<img
src="invalid"
/>
</span>
<div
style="display: none;"
style="display:none"
>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background: rgb(114, 101, 230);"
style="background:#7265e6"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
Avatar
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
style="background: rgb(0, 162, 174);"
style="background:#00a2ae"
>
<img
src="invalid"
@ -974,18 +973,18 @@ Array [
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
U
</span>
</span>,
<span
class="ant-avatar ant-avatar-circle"
style="width: 40px; height: 40px; line-height: 40px; font-size: 18px;"
style="width:40px;height:40px;line-height:40px;font-size:18px"
>
<span
class="ant-avatar-string"
style="line-height: 40px; transform: scale(1) translateX(-50%);"
style="opacity:0"
>
USER
</span>
@ -1006,7 +1005,7 @@ Array [
<img
class="ant-image-img"
src="https://joeschmoe.io/api/v1/random"
style="width: 32px;"
style="width:32px"
/>
<div
class="ant-image-mask"
@ -1040,18 +1039,18 @@ Array [
</span>,
<span
class="ant-avatar ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"
style="color:#f56a00;background-color:#fde3cf"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
U
</span>
</span>,
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"

77
components/avatar/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -38,7 +38,7 @@ Array [
>
<span
class="ant-scroll-number-only"
style="transition: none;"
style="transition:none"
>
<span
class="ant-scroll-number-only-unit current"
@ -90,7 +90,7 @@ Array [
<div>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="width: 64px; height: 64px; line-height: 64px; font-size: 32px;"
style="width:64px;height:64px;line-height:64px;font-size:32px"
>
<span
aria-label="user"
@ -185,7 +185,7 @@ Array [
<div>
<span
class="ant-avatar ant-avatar-square ant-avatar-icon"
style="width: 64px; height: 64px; line-height: 64px; font-size: 32px;"
style="width:64px;height:64px;line-height:64px;font-size:32px"
>
<span
aria-label="user"
@ -284,18 +284,18 @@ exports[`renders ./components/avatar/demo/dynamic.md correctly 1`] = `
Array [
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color: rgb(245, 106, 0); vertical-align: middle;"
style="background-color:#f56a00;vertical-align:middle"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
U
</span>
</span>,
<button
class="ant-btn ant-btn-default ant-btn-sm"
style="margin: 0px 16px; vertical-align: middle;"
style="margin:0 16px;vertical-align:middle"
type="button"
>
<span>
@ -304,7 +304,7 @@ Array [
</button>,
<button
class="ant-btn ant-btn-default ant-btn-sm"
style="vertical-align: middle;"
style="vertical-align:middle"
type="button"
>
<span>
@ -347,18 +347,18 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"
@ -382,7 +382,7 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(24, 144, 255);"
style="background-color:#1890ff"
>
<span
aria-label="ant-design"
@ -421,22 +421,22 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"
style="color:#f56a00;background-color:#fde3cf"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
+2
</span>
@ -458,22 +458,22 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"
style="color:#f56a00;background-color:#fde3cf"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
+2
</span>
@ -495,22 +495,22 @@ Array [
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background-color: rgb(245, 106, 0);"
style="background-color:#f56a00"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
K
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207); cursor: pointer;"
style="color:#f56a00;background-color:#fde3cf;cursor:pointer"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
+2
</span>
@ -522,7 +522,6 @@ Array [
exports[`renders ./components/avatar/demo/responsive.md correctly 1`] = `
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="width: 24px; height: 24px; line-height: 24px; font-size: 12px;"
>
<span
aria-label="ant-design"
@ -575,44 +574,44 @@ Array [
<br />,
<br />,
<div
style="text-align: center; transform: scale(1); margin-top: 24px;"
style="text-align:center;transform:scale(1);margin-top:24px"
>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background: rgb(114, 101, 230); display: none;"
style="background:#7265e6;display:none"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
Avatar
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
style="background: rgb(0, 162, 174); display: none;"
style="background:#00a2ae;display:none"
>
<img
src="invalid"
/>
</span>
<div
style="display: none;"
style="display:none"
>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle"
style="background: rgb(114, 101, 230);"
style="background:#7265e6"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
Avatar
</span>
</span>
<span
class="ant-avatar ant-avatar-lg ant-avatar-circle ant-avatar-image"
style="background: rgb(0, 162, 174);"
style="background:#00a2ae"
>
<img
src="invalid"
@ -653,18 +652,18 @@ Array [
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
U
</span>
</span>,
<span
class="ant-avatar ant-avatar-circle"
style="width: 40px; height: 40px; line-height: 40px; font-size: 18px;"
style="width:40px;height:40px;line-height:40px;font-size:18px"
>
<span
class="ant-avatar-string"
style="line-height: 40px; transform: scale(1) translateX(-50%);"
style="opacity:0"
>
USER
</span>
@ -685,7 +684,7 @@ Array [
<img
class="ant-image-img"
src="https://joeschmoe.io/api/v1/random"
style="width: 32px;"
style="width:32px"
/>
<div
class="ant-image-mask"
@ -719,18 +718,18 @@ Array [
</span>,
<span
class="ant-avatar ant-avatar-circle"
style="color: rgb(245, 106, 0); background-color: rgb(253, 227, 207);"
style="color:#f56a00;background-color:#fde3cf"
>
<span
class="ant-avatar-string"
style="transform: scale(1) translateX(-50%);"
style="opacity:0"
>
U
</span>
</span>,
<span
class="ant-avatar ant-avatar-circle ant-avatar-icon"
style="background-color: rgb(135, 208, 104);"
style="background-color:#87d068"
>
<span
aria-label="user"

40
components/avatar/avatar.tsx
View File

@ -38,17 +38,19 @@ export interface AvatarProps {
onError?: () => boolean;
}
const InternalAvatar: React.ForwardRefRenderFunction<unknown, AvatarProps> = (props, ref) => {
const InternalAvatar: React.ForwardRefRenderFunction<HTMLSpanElement, AvatarProps> = (
props,
ref,
) => {
const groupSize = React.useContext(SizeContext);
const [scale, setScale] = React.useState(1);
const [mounted, setMounted] = React.useState(false);
const [isImgExist, setIsImgExist] = React.useState(true);
const avatarNodeRef = React.useRef<HTMLElement>();
const avatarChildrenRef = React.useRef<HTMLElement>();
const avatarNodeMergeRef = composeRef(ref, avatarNodeRef);
const avatarNodeRef = React.useRef<HTMLSpanElement>(null);
const avatarChildrenRef = React.useRef<HTMLSpanElement>(null);
const avatarNodeMergeRef = composeRef<HTMLSpanElement>(ref, avatarNodeRef);
const { getPrefixCls } = React.useContext(ConfigContext);
@ -90,8 +92,8 @@ const InternalAvatar: React.ForwardRefRenderFunction<unknown, AvatarProps> = (pr
const {
prefixCls: customizePrefixCls,
shape,
size: customSize,
shape = 'circle',
size: customSize = 'default',
src,
srcSet,
icon,
@ -163,7 +165,7 @@ const InternalAvatar: React.ForwardRefRenderFunction<unknown, AvatarProps> = (pr
}
: {};
let childrenToRender;
let childrenToRender: React.ReactNode;
if (typeof src === 'string' && isImgExist) {
childrenToRender = (
<img
@ -198,9 +200,7 @@ const InternalAvatar: React.ForwardRefRenderFunction<unknown, AvatarProps> = (pr
<ResizeObserver onResize={setScaleParam}>
<span
className={`${prefixCls}-string`}
ref={(node: HTMLElement) => {
avatarChildrenRef.current = node;
}}
ref={avatarChildrenRef}
style={{ ...sizeChildrenStyle, ...childrenStyle }}
>
{children}
@ -209,13 +209,7 @@ const InternalAvatar: React.ForwardRefRenderFunction<unknown, AvatarProps> = (pr
);
} else {
childrenToRender = (
<span
className={`${prefixCls}-string`}
style={{ opacity: 0 }}
ref={(node: HTMLElement) => {
avatarChildrenRef.current = node;
}}
>
<span className={`${prefixCls}-string`} style={{ opacity: 0 }} ref={avatarChildrenRef}>
{children}
</span>
);
@ -231,21 +225,17 @@ const InternalAvatar: React.ForwardRefRenderFunction<unknown, AvatarProps> = (pr
{...others}
style={{ ...sizeStyle, ...responsiveSizeStyle, ...others.style }}
className={classString}
ref={avatarNodeMergeRef as any}
ref={avatarNodeMergeRef}
>
{childrenToRender}
</span>
);
};
const Avatar = React.forwardRef<unknown, AvatarProps>(InternalAvatar);
const Avatar = React.forwardRef<HTMLSpanElement, AvatarProps>(InternalAvatar);
if (process.env.NODE_ENV !== 'production') {
Avatar.displayName = 'Avatar';
}
Avatar.defaultProps = {
shape: 'circle' as AvatarProps['shape'],
size: 'default' as AvatarProps['size'],
};
export default Avatar;

8
components/avatar/index.tsx
View File

@ -7,12 +7,14 @@ export { AvatarProps } from './avatar';
export { GroupProps } from './group';
export { Group };
interface CompoundedComponent
extends ForwardRefExoticComponent<AvatarProps & RefAttributes<HTMLElement>> {
type CompoundedComponent = ForwardRefExoticComponent<
AvatarProps & RefAttributes<HTMLSpanElement>
> & {
Group: typeof Group;
}
};
const Avatar = InternalAvatar as CompoundedComponent;
Avatar.Group = Group;
export default Avatar;

4
components/back-top/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -5,17 +5,19 @@ Array [
<div
class="ant-back-top"
/>,
Scroll down to see the bottom-right,
<strong
class="site-back-top-basic"
>
gray
</strong>,
button.,
]
`;
exports[`renders ./components/back-top/demo/custom.md extend context correctly 1`] = `
<div
style="height: 600vh; padding: 8px;"
style="height:600vh;padding:8px"
>
<div>
Scroll to bottom

4
components/back-top/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -5,17 +5,19 @@ Array [
<div
class="ant-back-top"
/>,
Scroll down to see the bottom-right,
<strong
class="site-back-top-basic"
>
gray
</strong>,
button.,
]
`;
exports[`renders ./components/back-top/demo/custom.md correctly 1`] = `
<div
style="height: 600vh; padding: 8px;"
style="height:600vh;padding:8px"
>
<div>
Scroll to bottom

279
components/badge/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

279
components/badge/__tests__/__snapshots__/demo.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

1
components/breadcrumb/BreadcrumbSeparator.tsx
View File

@ -2,6 +2,7 @@ import * as React from 'react';
import { ConfigContext } from '../config-provider';
interface BreadcrumbSeparatorInterface extends React.FC<{ children?: React.ReactNode }> {
/** @internal */
__ANT_BREADCRUMB_SEPARATOR: boolean;
}

1
components/breadcrumb/__tests__/Breadcrumb.test.tsx
View File

@ -21,7 +21,6 @@ describe('Breadcrumb', () => {
errorSpy.mockRestore();
});
// https://github.com/airbnb/enzyme/issues/875
it('warns on non-Breadcrumb.Item and non-Breadcrumb.Separator children', () => {
const MyCom: React.FC = () => <div>foo</div>;
render(

33
components/breadcrumb/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -133,8 +133,8 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</span>
<div>
<div
class="ant-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-dropdown"
style="opacity:0"
>
<ul
class="ant-dropdown-menu ant-dropdown-menu-root ant-dropdown-menu-vertical ant-dropdown-menu-light"
@ -144,7 +144,6 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-1"
role="menuitem"
tabindex="-1"
>
@ -162,8 +161,8 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -184,7 +183,6 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</div>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-2"
role="menuitem"
tabindex="-1"
>
@ -202,8 +200,8 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -224,7 +222,6 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</div>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-3"
role="menuitem"
tabindex="-1"
>
@ -242,8 +239,8 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -265,12 +262,12 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</ul>
<div
aria-hidden="true"
style="display: none;"
style="display:none"
>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -291,8 +288,8 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</div>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -313,8 +310,8 @@ exports[`renders ./components/breadcrumb/demo/overlay.md extend context correctl
</div>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"

1
components/breadcrumb/__tests__/router.test.tsx
View File

@ -32,7 +32,6 @@ describe('react router', () => {
jest.useRealTimers();
});
// https://github.com/airbnb/enzyme/issues/875
it('react router 6', () => {
const Home: React.FC = () => {
const location = useLocation();

134
components/button/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -91,11 +91,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -123,11 +122,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -153,11 +151,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -185,11 +182,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -244,11 +240,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -554,8 +549,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -637,8 +632,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -713,8 +708,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -788,8 +783,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -889,8 +884,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -972,8 +967,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1048,8 +1043,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1123,8 +1118,8 @@ Array [
</button>,
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1223,12 +1218,12 @@ Array [
</button>
<span
class="ant-tooltip-disabled-compatible-wrapper"
style="display: inline-block; cursor: not-allowed;"
style="display:inline-block;cursor:not-allowed"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
disabled=""
style="pointer-events: none;"
style="pointer-events:none"
type="button"
>
<span
@ -1254,8 +1249,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1302,8 +1297,8 @@ Array [
</button>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1349,12 +1344,12 @@ Array [
</button>
<span
class="ant-tooltip-disabled-compatible-wrapper"
style="display: inline-block; cursor: not-allowed;"
style="display:inline-block;cursor:not-allowed"
>
<button
class="ant-btn ant-btn-primary ant-btn-icon-only"
disabled=""
style="pointer-events: none;"
style="pointer-events:none"
type="button"
>
<span
@ -1380,8 +1375,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1428,8 +1423,8 @@ Array [
</button>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1475,12 +1470,12 @@ Array [
</button>
<span
class="ant-tooltip-disabled-compatible-wrapper"
style="display: inline-block; cursor: not-allowed;"
style="display:inline-block;cursor:not-allowed"
>
<button
class="ant-btn ant-btn-primary ant-btn-lg ant-btn-icon-only"
disabled=""
style="pointer-events: none;"
style="pointer-events:none"
type="button"
>
<span
@ -1506,8 +1501,8 @@ Array [
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1554,8 +1549,8 @@ Array [
</button>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1585,11 +1580,11 @@ exports[`renders ./components/button/demo/loading.md extend context correctly 1`
Array [
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary ant-btn-loading"
@ -1597,11 +1592,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -1626,7 +1620,7 @@ Array [
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm ant-btn-loading"
@ -1634,11 +1628,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -1696,11 +1689,11 @@ Array [
</div>,
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary"
@ -1713,7 +1706,7 @@ Array [
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary"
@ -1830,8 +1823,8 @@ Array [
</button>
<div>
<div
class="ant-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-dropdown"
style="opacity:0"
>
<ul
class="ant-dropdown-menu ant-dropdown-menu-root ant-dropdown-menu-vertical ant-dropdown-menu-light"
@ -1841,7 +1834,6 @@ Array [
>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-1"
role="menuitem"
tabindex="-1"
>
@ -1853,8 +1845,8 @@ Array [
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1875,7 +1867,6 @@ Array [
</div>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-2"
role="menuitem"
tabindex="-1"
>
@ -1887,8 +1878,8 @@ Array [
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1909,7 +1900,6 @@ Array [
</div>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-3"
role="menuitem"
tabindex="-1"
>
@ -1921,8 +1911,8 @@ Array [
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1944,12 +1934,12 @@ Array [
</ul>
<div
aria-hidden="true"
style="display: none;"
style="display:none"
>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1970,8 +1960,8 @@ Array [
</div>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1992,8 +1982,8 @@ Array [
</div>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"

45
components/button/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -91,11 +91,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -123,11 +122,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -153,11 +151,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -185,11 +182,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -244,11 +240,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -1031,12 +1026,12 @@ Array [
</button>
<span
class="ant-tooltip-disabled-compatible-wrapper"
style="display: inline-block; cursor: not-allowed;"
style="display:inline-block;cursor:not-allowed"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm ant-btn-icon-only"
disabled=""
style="pointer-events: none;"
style="pointer-events:none"
type="button"
>
<span
@ -1109,12 +1104,12 @@ Array [
</button>
<span
class="ant-tooltip-disabled-compatible-wrapper"
style="display: inline-block; cursor: not-allowed;"
style="display:inline-block;cursor:not-allowed"
>
<button
class="ant-btn ant-btn-primary ant-btn-icon-only"
disabled=""
style="pointer-events: none;"
style="pointer-events:none"
type="button"
>
<span
@ -1187,12 +1182,12 @@ Array [
</button>
<span
class="ant-tooltip-disabled-compatible-wrapper"
style="display: inline-block; cursor: not-allowed;"
style="display:inline-block;cursor:not-allowed"
>
<button
class="ant-btn ant-btn-primary ant-btn-lg ant-btn-icon-only"
disabled=""
style="pointer-events: none;"
style="pointer-events:none"
type="button"
>
<span
@ -1249,11 +1244,11 @@ exports[`renders ./components/button/demo/loading.md correctly 1`] = `
Array [
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary ant-btn-loading"
@ -1261,11 +1256,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -1290,7 +1284,7 @@ Array [
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary ant-btn-sm ant-btn-loading"
@ -1298,11 +1292,10 @@ Array [
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -1360,11 +1353,11 @@ Array [
</div>,
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary"
@ -1377,7 +1370,7 @@ Array [
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary"

1
components/button/button.tsx
View File

@ -134,6 +134,7 @@ export type ButtonProps = Partial<AnchorButtonProps & NativeButtonProps>;
interface CompoundedComponent
extends React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLElement>> {
Group: typeof Group;
/** @internal */
__ANT_BUTTON: boolean;
}

644
components/calendar/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

120
components/calendar/__tests__/__snapshots__/demo.test.js.snap → components/calendar/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -17,17 +17,16 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -43,7 +42,7 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -77,17 +76,16 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -103,7 +101,7 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -964,17 +962,16 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -990,7 +987,7 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1024,17 +1021,16 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1050,7 +1046,7 @@ exports[`renders ./components/calendar/demo/card.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1900,7 +1896,7 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
class="ant-picker-calendar ant-picker-calendar-mini"
>
<div
style="padding: 8px;"
style="padding:8px"
>
<h4
class="ant-typography"
@ -1909,11 +1905,11 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
</h4>
<div
class="ant-row"
style="margin-left: -4px; margin-right: -4px;"
style="margin-left:-4px;margin-right:-4px"
>
<div
class="ant-col"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:4px;padding-right:4px"
>
<div
class="ant-radio-group ant-radio-group-outline ant-radio-group-small"
@ -1961,7 +1957,7 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
</div>
<div
class="ant-col"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:4px;padding-right:4px"
>
<div
class="ant-select ant-select-sm my-year-select ant-select-single ant-select-show-arrow"
@ -1973,17 +1969,16 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1999,7 +1994,7 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2026,7 +2021,7 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
</div>
<div
class="ant-col"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:4px;padding-right:4px"
>
<div
class="ant-select ant-select-sm ant-select-single ant-select-show-arrow"
@ -2038,17 +2033,16 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2064,7 +2058,7 @@ exports[`renders ./components/calendar/demo/customize-header.md correctly 1`] =
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2882,17 +2876,16 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2908,7 +2901,7 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2942,17 +2935,16 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2968,7 +2960,7 @@ exports[`renders ./components/calendar/demo/notice-calendar.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -4239,17 +4231,16 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -4265,7 +4256,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -4299,17 +4290,16 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -4325,7 +4315,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span

2833
components/calendar/__tests__/__snapshots__/index.test.js.snap
View File

File diff suppressed because it is too large Load Diff

0
components/calendar/__tests__/demo.test.js → components/calendar/__tests__/demo.test.ts
View File

430
components/calendar/__tests__/index.test.js
View File

@ -1,430 +0,0 @@
import { mount } from 'enzyme';
import MockDate from 'mockdate';
import Moment from 'moment';
import momentGenerateConfig from 'rc-picker/lib/generate/moment';
import React from 'react';
import Calendar from '..';
import mountTest from '../../../tests/shared/mountTest';
import rtlTest from '../../../tests/shared/rtlTest';
import { fireEvent, render } from '../../../tests/utils';
import Group from '../../radio/group';
import Button from '../../radio/radioButton';
import Select from '../../select';
import Header from '../Header';
describe('Calendar', () => {
mountTest(Calendar);
rtlTest(Calendar, { mockDate: true });
function openSelect(wrapper, className) {
wrapper.find(className).find('.ant-select-selector').simulate('mousedown');
}
function findSelectItem(wrapper) {
return wrapper.find('.ant-select-item-option');
}
function clickSelectItem(wrapper, index = 0) {
findSelectItem(wrapper).at(index).simulate('click');
}
// https://github.com/ant-design/ant-design/issues/30392
it('should be able to set undefined or null', () => {
expect(() => {
const wrapper = mount(<Calendar />);
wrapper.setProps({ value: null });
}).not.toThrow();
expect(() => {
const wrapper = mount(<Calendar />);
wrapper.setProps({ value: undefined });
}).not.toThrow();
});
it('Calendar should be selectable', () => {
MockDate.set(Moment('2000-01-01').valueOf());
const onSelect = jest.fn();
const onChange = jest.fn();
const { container } = render(<Calendar onSelect={onSelect} onChange={onChange} />);
fireEvent.click(container.querySelector('.ant-picker-cell'));
expect(onSelect).toHaveBeenCalledWith(expect.anything());
const value = onSelect.mock.calls[0][0];
expect(Moment.isMoment(value)).toBe(true);
expect(onChange).toHaveBeenCalled();
MockDate.reset();
});
it('only Valid range should be selectable', () => {
const onSelect = jest.fn();
const validRange = [Moment('2018-02-02'), Moment('2018-02-18')];
const wrapper = mount(
<Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} />,
);
wrapper.find('[title="2018-02-01"]').at(0).simulate('click');
wrapper.find('[title="2018-02-02"]').at(0).simulate('click');
expect(onSelect.mock.calls.length).toBe(1);
});
it('dates other than in valid range should be disabled', () => {
const onSelect = jest.fn();
const validRange = [Moment('2018-02-02'), Moment('2018-02-18')];
const wrapper = mount(
<Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} />,
);
wrapper.find('[title="2018-02-20"]').at(0).simulate('click');
const elem = wrapper.find('[title="2018-02-20"]').hasClass('ant-picker-cell-disabled');
expect(elem).toEqual(true);
expect(onSelect.mock.calls.length).toBe(0);
});
it('months other than in valid range should be disabled', () => {
const onSelect = jest.fn();
const validRange = [Moment('2018-02-02'), Moment('2018-05-18')];
const wrapper = mount(
<Calendar
onSelect={onSelect}
validRange={validRange}
defaultValue={Moment('2018-02-02')}
mode="year"
/>,
);
expect(wrapper.find('[title="2018-01"]').at(0).hasClass('ant-picker-cell-disabled')).toBe(true);
expect(wrapper.find('[title="2018-02"]').at(0).hasClass('ant-picker-cell-disabled')).toBe(
false,
);
expect(wrapper.find('[title="2018-06"]').at(0).hasClass('ant-picker-cell-disabled')).toBe(true);
wrapper.find('[title="2018-01"]').at(0).simulate('click');
wrapper.find('[title="2018-03"]').at(0).simulate('click');
expect(onSelect.mock.calls.length).toBe(1);
});
it('months other than in valid range should not be shown in header', () => {
const validRange = [Moment('2017-02-02'), Moment('2018-05-18')];
const wrapper = mount(<Calendar validRange={validRange} />);
openSelect(wrapper, '.ant-picker-calendar-year-select');
clickSelectItem(wrapper);
openSelect(wrapper, '.ant-picker-calendar-month-select');
// 2 years and 11 months
expect(wrapper.find('.ant-select-item-option').length).toBe(13);
});
it('getDateRange should returns a disabledDate function', () => {
const validRange = [Moment('2018-02-02'), Moment('2018-05-18')];
const wrapper = mount(<Calendar validRange={validRange} defaultValue={Moment('2018-02-02')} />);
const { disabledDate } = wrapper.find('PickerPanel').props();
expect(disabledDate(Moment('2018-06-02'))).toBe(true);
expect(disabledDate(Moment('2018-04-02'))).toBe(false);
});
it('validRange should work with disabledDate function', () => {
const validRange = [Moment('2018-02-02'), Moment('2018-05-18')];
const wrapper = mount(
<Calendar validRange={validRange} disabledDate={data => data.isSame(Moment('2018-02-03'))} />,
);
const { disabledDate } = wrapper.find('PickerPanel').props();
expect(disabledDate(Moment('2018-02-01'))).toBe(true);
expect(disabledDate(Moment('2018-02-02'))).toBe(false);
expect(disabledDate(Moment('2018-02-03'))).toBe(true);
expect(disabledDate(Moment('2018-02-04'))).toBe(false);
expect(disabledDate(Moment('2018-06-01'))).toBe(true);
});
it('Calendar MonthSelect should display correct label', () => {
const validRange = [Moment('2018-02-02'), Moment('2019-06-1')];
const wrapper = mount(<Calendar validRange={validRange} defaultValue={Moment('2019-01-01')} />);
expect(wrapper.render()).toMatchSnapshot();
});
it('Calendar should change mode by prop', () => {
const monthMode = 'month';
const yearMode = 'year';
const wrapper = mount(<Calendar />);
expect(wrapper.find('CalendarHeader').props().mode).toEqual(monthMode);
wrapper.setProps({ mode: yearMode });
expect(wrapper.find('CalendarHeader').props().mode).toEqual(yearMode);
});
it('Calendar should switch mode', () => {
const monthMode = 'month';
const yearMode = 'year';
const onPanelChangeStub = jest.fn();
const wrapper = mount(<Calendar mode={yearMode} onPanelChange={onPanelChangeStub} />);
expect(wrapper.find('CalendarHeader').props().mode).toEqual(yearMode);
wrapper.setProps({ mode: monthMode });
expect(wrapper.find('CalendarHeader').props().mode).toEqual(monthMode);
expect(onPanelChangeStub).toHaveBeenCalledTimes(0);
});
it('Calendar should support locale', () => {
MockDate.set(Moment('2018-10-19').valueOf());
// eslint-disable-next-line global-require
const zhCN = require('../locale/zh_CN').default;
const wrapper = mount(<Calendar locale={zhCN} />);
expect(wrapper.render()).toMatchSnapshot();
MockDate.reset();
});
describe('onPanelChange', () => {
it('trigger when click last month of date', () => {
const onPanelChange = jest.fn();
const date = new Moment('1990-09-03');
const wrapper = mount(<Calendar onPanelChange={onPanelChange} value={date} />);
wrapper.find('.ant-picker-cell').at(0).simulate('click');
expect(onPanelChange).toHaveBeenCalled();
expect(onPanelChange.mock.calls[0][0].month()).toEqual(date.month() - 1);
});
it('not trigger when in same month', () => {
const onPanelChange = jest.fn();
const date = new Moment('1990-09-03');
const wrapper = mount(<Calendar onPanelChange={onPanelChange} value={date} />);
wrapper.find('.ant-picker-cell').at(10).simulate('click');
expect(onPanelChange).not.toHaveBeenCalled();
});
});
it('switch should work correctly without prop mode', async () => {
const onPanelChange = jest.fn();
const date = new Moment(new Date(Date.UTC(2017, 7, 9, 8)));
const wrapper = mount(<Calendar onPanelChange={onPanelChange} value={date} />);
expect(wrapper.find('CalendarHeader').props().mode).toBe('month');
expect(wrapper.find('.ant-picker-date-panel').length).toBe(1);
expect(wrapper.find('.ant-picker-month-panel').length).toBe(0);
wrapper.find('.ant-radio-button-input[value="year"]').simulate('change');
expect(wrapper.find('.ant-picker-date-panel').length).toBe(0);
expect(wrapper.find('.ant-picker-month-panel').length).toBe(1);
expect(onPanelChange).toHaveBeenCalled();
expect(onPanelChange.mock.calls[0][1]).toEqual('year');
});
const createWrapper = (start, end, value, onValueChange) => {
const wrapper = mount(
<Header
prefixCls="ant-picker-calendar"
generateConfig={momentGenerateConfig}
onChange={onValueChange}
value={value}
validRange={[start, end]}
locale={{ year: '年' }}
/>,
);
openSelect(wrapper, '.ant-picker-calendar-year-select');
clickSelectItem(wrapper);
};
it('if value.month > end.month, set value.month to end.month', () => {
const value = new Moment('1990-01-03');
const start = new Moment('2019-04-01');
const end = new Moment('2019-11-01');
const onValueChange = jest.fn();
createWrapper(start, end, value, onValueChange);
expect(onValueChange).toHaveBeenCalledWith(value.year('2019').month('3'));
});
it('if start.month > value.month, set value.month to start.month', () => {
const value = new Moment('1990-01-03');
const start = new Moment('2019-11-01');
const end = new Moment('2019-03-01');
const onValueChange = jest.fn();
createWrapper(start, end, value, onValueChange);
expect(onValueChange).toHaveBeenCalledWith(value.year('2019').month('10'));
});
it('if change year and new month > end month, set value.month to end.month', () => {
const value = new Moment('2018-11-03');
const start = new Moment('2000-01-01');
const end = new Moment('2019-03-01');
const onValueChange = jest.fn();
const wrapper = mount(
<Header
prefixCls="ant-picker-calendar"
generateConfig={momentGenerateConfig}
onChange={onValueChange}
value={value}
validRange={[start, end]}
locale={{ year: '年' }}
/>,
);
openSelect(wrapper, '.ant-picker-calendar-year-select');
wrapper.find('.ant-select-item-option').last().simulate('click');
expect(onValueChange).toHaveBeenCalledWith(value.year('2019').month('2'));
});
it('onMonthChange should work correctly', () => {
const start = new Moment('2018-11-01');
const end = new Moment('2019-03-01');
const value = new Moment('2018-12-03');
const onValueChange = jest.fn();
const wrapper = mount(
<Header
prefixCls="ant-picker-calendar"
generateConfig={momentGenerateConfig}
onChange={onValueChange}
value={value}
validRange={[start, end]}
locale={{ year: '年', locale: 'zh_CN' }}
mode="month"
/>,
);
openSelect(wrapper, '.ant-picker-calendar-month-select');
clickSelectItem(wrapper);
expect(onValueChange).toHaveBeenCalledWith(value.month(10));
});
it('onTypeChange should work correctly', () => {
const onTypeChange = jest.fn();
const value = new Moment('2018-12-03');
const wrapper = mount(
<Header
prefixCls="ant-picker-calendar"
generateConfig={momentGenerateConfig}
onModeChange={onTypeChange}
locale={{ year: '年', month: '月', locale: 'zh_CN' }}
value={value}
type="date"
/>,
);
wrapper.find('input[type="radio"]').at(1).simulate('change');
expect(onTypeChange).toHaveBeenCalledWith('year');
});
it('headerRender should work correctly', () => {
const onMonthChange = jest.fn();
const onYearChange = jest.fn();
const onTypeChange = jest.fn();
// Year
const headerRender = jest.fn(({ value }) => {
const year = value.year();
const options = [];
for (let i = year - 100; i < year + 100; i += 1) {
options.push(
<Select.Option className="year-item" key={i} value={i}>
{i}
</Select.Option>,
);
}
return (
<Select
size="small"
dropdownMatchSelectWidth={false}
className="my-year-select"
onChange={onYearChange}
value={String(year)}
>
{options}
</Select>
);
});
const wrapperWithYear = mount(<Calendar fullscreen={false} headerRender={headerRender} />);
openSelect(wrapperWithYear, '.ant-select');
wrapperWithYear.update();
findSelectItem(wrapperWithYear).last().simulate('click');
expect(onYearChange).toHaveBeenCalled();
// Month
const headerRenderWithMonth = jest.fn(({ value }) => {
const start = 0;
const end = 12;
const monthOptions = [];
const current = value.clone();
const localeData = value.localeData();
const months = [];
for (let i = 0; i < 12; i += 1) {
current.month(i);
months.push(localeData.monthsShort(current));
}
for (let index = start; index < end; index += 1) {
monthOptions.push(
<Select.Option className="month-item" key={`${index}`} value={index}>
{months[index]}
</Select.Option>,
);
}
const month = value.month();
return (
<Select
size="small"
dropdownMatchSelectWidth={false}
className="my-month-select"
onChange={onMonthChange}
value={String(month)}
>
{monthOptions}
</Select>
);
});
const wrapperWithMonth = mount(
<Calendar fullscreen={false} headerRender={headerRenderWithMonth} />,
);
openSelect(wrapperWithMonth, '.ant-select');
wrapperWithMonth.update();
findSelectItem(wrapperWithMonth).last().simulate('click');
expect(onMonthChange).toHaveBeenCalled();
// Type
const headerRenderWithTypeChange = jest.fn(({ type }) => (
<Group size="small" onChange={onTypeChange} value={type}>
<Button value="month">Month</Button>
<Button value="year">Year</Button>
</Group>
));
const wrapperWithTypeChange = mount(
<Calendar fullscreen={false} headerRender={headerRenderWithTypeChange} />,
);
wrapperWithTypeChange.find('.ant-radio-button-input').last().simulate('change');
expect(onTypeChange).toHaveBeenCalled();
});
it('dateFullCellRender', () => {
const wrapper = mount(
<Calendar dateFullCellRender={() => <div className="light">Bamboo</div>} />,
);
expect(wrapper.find('.light').first().text()).toEqual('Bamboo');
});
it('monthFullCellRender', () => {
const wrapper = mount(
<Calendar mode="year" monthFullCellRender={() => <div className="bamboo">Light</div>} />,
);
expect(wrapper.find('.bamboo').first().text()).toEqual('Light');
});
it('when fullscreen is false, the element returned by dateFullCellRender should be interactive', () => {
const onClick = jest.fn();
const wrapper = mount(
<Calendar
fullscreen={false}
dateFullCellRender={() => (
<div className="bamboo" onClick={onClick}>
Light
</div>
)}
/>,
);
wrapper.find('.bamboo').first().simulate('click');
expect(onClick).toHaveBeenCalled();
});
});

120
components/calendar/__tests__/index.test.tsx
View File

@ -1,8 +1,8 @@
import { mount } from 'enzyme';
import MockDate from 'mockdate';
import Moment from 'moment';
import momentGenerateConfig from 'rc-picker/lib/generate/moment';
import type { Locale } from 'rc-picker/lib/interface';
import { type PickerPanelProps } from 'rc-picker';
import React from 'react';
import Calendar from '..';
import mountTest from '../../../tests/shared/mountTest';
@ -11,7 +11,36 @@ import { fireEvent, render } from '../../../tests/utils';
import Group from '../../radio/group';
import Button from '../../radio/radioButton';
import Select from '../../select';
import Header from '../Header';
import Header, { type CalendarHeaderProps } from '../Header';
function calendarProps(): PickerPanelProps<any> {
return (global as any).calendarProps;
}
function calendarHeaderProps(): CalendarHeaderProps<any> {
return (global as any).calendarHeaderProps;
}
jest.mock('../Header', () => {
const HeaderModule = jest.requireActual('../Header');
const HeaderComponent = HeaderModule.default;
return (props: CalendarHeaderProps<any>) => {
(global as any).calendarHeaderProps = props;
return <HeaderComponent {...props} />;
};
});
jest.mock('rc-picker', () => {
const RcPicker = jest.requireActual('rc-picker');
const PickerPanelComponent = RcPicker.PickerPanel;
return {
...RcPicker,
PickerPanel: (props: PickerPanelProps<any>) => {
(global as any).calendarProps = props;
return <PickerPanelComponent {...props} />;
},
};
});
describe('Calendar', () => {
mountTest(Calendar);
@ -32,12 +61,11 @@ describe('Calendar', () => {
// https://github.com/ant-design/ant-design/issues/30392
it('should be able to set undefined or null', () => {
expect(() => {
const wrapper = mount(<Calendar />);
wrapper.setProps({ value: null });
render(<Calendar value={null as any} />);
}).not.toThrow();
expect(() => {
const wrapper = mount(<Calendar />);
wrapper.setProps({ value: undefined });
render(<Calendar value={undefined} />);
}).not.toThrow();
});
@ -62,19 +90,21 @@ describe('Calendar', () => {
it('only Valid range should be selectable', () => {
const onSelect = jest.fn();
const validRange: [Moment.Moment, Moment.Moment] = [Moment('2018-02-02'), Moment('2018-02-18')];
const wrapper = mount(
<Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} />,
const defaultValue = Moment('2018-02-02');
const wrapper = render(
<Calendar onSelect={onSelect} validRange={validRange} defaultValue={defaultValue} />,
);
wrapper.find('[title="2018-02-01"]').at(0).simulate('click');
wrapper.find('[title="2018-02-02"]').at(0).simulate('click');
fireEvent.click(wrapper.container.querySelectorAll('[title="2018-02-01"]')[0]);
fireEvent.click(wrapper.container.querySelectorAll('[title="2018-02-02"]')[0]);
expect(onSelect.mock.calls.length).toBe(1);
});
it('dates other than in valid range should be disabled', () => {
const onSelect = jest.fn();
const validRange: [Moment.Moment, Moment.Moment] = [Moment('2018-02-02'), Moment('2018-02-18')];
const defaultValue = Moment('2018-02-02');
const { container } = render(
<Calendar onSelect={onSelect} validRange={validRange} defaultValue={Moment('2018-02-02')} />,
<Calendar onSelect={onSelect} validRange={validRange} defaultValue={defaultValue} />,
);
fireEvent.click(container.querySelector('[title="2018-02-20"]')!);
const elem = container
@ -121,49 +151,49 @@ describe('Calendar', () => {
it('getDateRange should returns a disabledDate function', () => {
const validRange: [Moment.Moment, Moment.Moment] = [Moment('2018-02-02'), Moment('2018-05-18')];
const wrapper = mount(<Calendar validRange={validRange} defaultValue={Moment('2018-02-02')} />);
const { disabledDate } = wrapper.find('PickerPanel').props() as any;
expect(disabledDate(Moment('2018-06-02'))).toBe(true);
expect(disabledDate(Moment('2018-04-02'))).toBe(false);
render(<Calendar validRange={validRange} defaultValue={Moment('2018-02-02')} />);
expect(calendarProps().disabledDate?.(Moment('2018-06-02'))).toBe(true);
expect(calendarProps().disabledDate?.(Moment('2018-04-02'))).toBe(false);
});
it('validRange should work with disabledDate function', () => {
const validRange: [Moment.Moment, Moment.Moment] = [Moment('2018-02-02'), Moment('2018-05-18')];
const wrapper = mount(
render(
<Calendar validRange={validRange} disabledDate={data => data.isSame(Moment('2018-02-03'))} />,
);
const { disabledDate } = wrapper.find('PickerPanel').props() as any;
expect(disabledDate(Moment('2018-02-01'))).toBe(true);
expect(disabledDate(Moment('2018-02-02'))).toBe(false);
expect(disabledDate(Moment('2018-02-03'))).toBe(true);
expect(disabledDate(Moment('2018-02-04'))).toBe(false);
expect(disabledDate(Moment('2018-06-01'))).toBe(true);
expect(calendarProps().disabledDate?.(Moment('2018-02-01'))).toBe(true);
expect(calendarProps().disabledDate?.(Moment('2018-02-02'))).toBe(false);
expect(calendarProps().disabledDate?.(Moment('2018-02-03'))).toBe(true);
expect(calendarProps().disabledDate?.(Moment('2018-02-04'))).toBe(false);
expect(calendarProps().disabledDate?.(Moment('2018-06-01'))).toBe(true);
});
it('Calendar MonthSelect should display correct label', () => {
const validRange: [Moment.Moment, Moment.Moment] = [Moment('2018-02-02'), Moment('2019-06-1')];
const wrapper = mount(<Calendar validRange={validRange} defaultValue={Moment('2019-01-01')} />);
expect(wrapper.render()).toMatchSnapshot();
const wrapper = render(
<Calendar validRange={validRange} defaultValue={Moment('2019-01-01')} />,
);
expect(wrapper.container.children[0]).toMatchSnapshot();
});
it('Calendar should change mode by prop', () => {
const monthMode = 'month';
const yearMode = 'year';
const wrapper = mount(<Calendar />);
expect(wrapper.find('CalendarHeader').props().mode).toEqual(monthMode);
wrapper.setProps({ mode: yearMode });
expect(wrapper.find('CalendarHeader').props().mode).toEqual(yearMode);
const wrapper = render(<Calendar />);
expect(calendarHeaderProps().mode).toEqual(monthMode);
wrapper.rerender(<Calendar mode={yearMode} />);
expect(calendarHeaderProps().mode).toEqual(yearMode);
});
it('Calendar should switch mode', () => {
const monthMode = 'month';
const yearMode = 'year';
const onPanelChangeStub = jest.fn();
const wrapper = mount(<Calendar mode={yearMode} onPanelChange={onPanelChangeStub} />);
expect(wrapper.find('CalendarHeader').props().mode).toEqual(yearMode);
wrapper.setProps({ mode: monthMode });
expect(wrapper.find('CalendarHeader').props().mode).toEqual(monthMode);
const wrapper = render(<Calendar mode={yearMode} onPanelChange={onPanelChangeStub} />);
expect(calendarHeaderProps().mode).toEqual(yearMode);
wrapper.rerender(<Calendar mode={monthMode} onPanelChange={onPanelChangeStub} />);
expect(calendarHeaderProps().mode).toEqual(monthMode);
expect(onPanelChangeStub).toHaveBeenCalledTimes(0);
});
@ -171,8 +201,8 @@ describe('Calendar', () => {
MockDate.set(Moment('2018-10-19').valueOf());
// eslint-disable-next-line global-require
const zhCN = require('../locale/zh_CN').default;
const wrapper = mount(<Calendar locale={zhCN} />);
expect(wrapper.render()).toMatchSnapshot();
const wrapper = render(<Calendar locale={zhCN} />);
expect(wrapper.container.children[0]).toMatchSnapshot();
MockDate.reset();
});
@ -180,9 +210,9 @@ describe('Calendar', () => {
it('trigger when click last month of date', () => {
const onPanelChange = jest.fn();
const date = Moment('1990-09-03');
const wrapper = mount(<Calendar onPanelChange={onPanelChange} value={date} />);
const wrapper = render(<Calendar onPanelChange={onPanelChange} value={date} />);
wrapper.find('.ant-picker-cell').at(0).simulate('click');
fireEvent.click(Array.from(wrapper.container.querySelectorAll('.ant-picker-cell')).at(0)!);
expect(onPanelChange).toHaveBeenCalled();
expect(onPanelChange.mock.calls[0][0].month()).toEqual(date.month() - 1);
@ -191,9 +221,9 @@ describe('Calendar', () => {
it('not trigger when in same month', () => {
const onPanelChange = jest.fn();
const date = Moment('1990-09-03');
const wrapper = mount(<Calendar onPanelChange={onPanelChange} value={date} />);
const wrapper = render(<Calendar onPanelChange={onPanelChange} value={date} />);
wrapper.find('.ant-picker-cell').at(10).simulate('click');
fireEvent.click(Array.from(wrapper.container.querySelectorAll('.ant-picker-cell')).at(10)!);
expect(onPanelChange).not.toHaveBeenCalled();
});
@ -202,15 +232,15 @@ describe('Calendar', () => {
it('switch should work correctly without prop mode', async () => {
const onPanelChange = jest.fn();
const date = Moment(new Date(Date.UTC(2017, 7, 9, 8)));
const wrapper = mount(<Calendar onPanelChange={onPanelChange} value={date} />);
const wrapper = render(<Calendar onPanelChange={onPanelChange} value={date} />);
expect(wrapper.find('CalendarHeader').props().mode).toBe('month');
expect(wrapper.find('.ant-picker-date-panel').length).toBe(1);
expect(wrapper.find('.ant-picker-month-panel').length).toBe(0);
expect(calendarHeaderProps().mode).toBe('month');
expect(wrapper.container.querySelectorAll('.ant-picker-date-panel').length).toBe(1);
expect(wrapper.container.querySelectorAll('.ant-picker-month-panel').length).toBe(0);
fireEvent.click(wrapper.container.querySelector('.ant-radio-button-input[value="year"]')!);
expect(wrapper.container.querySelectorAll('.ant-picker-date-panel').length).toBe(0);
expect(wrapper.container.querySelectorAll('.ant-picker-month-panel').length).toBe(1);
wrapper.find('.ant-radio-button-input[value="year"]').simulate('change');
expect(wrapper.find('.ant-picker-date-panel').length).toBe(0);
expect(wrapper.find('.ant-picker-month-panel').length).toBe(1);
expect(onPanelChange).toHaveBeenCalled();
expect(onPanelChange.mock.calls[0][1]).toEqual('year');
});

4
components/calendar/demo/select.md
View File

@ -20,8 +20,8 @@ import moment from 'moment';
import React, { useState } from 'react';
const App: React.FC = () => {
const [value, setValue] = useState(moment('2017-01-25'));
const [selectedValue, setSelectedValue] = useState(moment('2017-01-25'));
const [value, setValue] = useState(() => moment('2017-01-25'));
const [selectedValue, setSelectedValue] = useState(() => moment('2017-01-25'));
const onSelect = (newValue: Moment) => {
setValue(newValue);

12
components/calendar/generateCalendar.tsx
View File

@ -174,7 +174,7 @@ function generateCalendar<DateType>(generateConfig: GenerateConfig<DateType>) {
};
result.lang = {
...result.lang,
...((locale || {}) as any).lang,
...(locale || {}).lang,
};
return result;
};
@ -232,7 +232,7 @@ function generateCalendar<DateType>(generateConfig: GenerateConfig<DateType>) {
return (
<LocaleReceiver componentName="Calendar" defaultLocale={getDefaultLocale}>
{(mergedLocale: any) => (
{contextLocale => (
<div
className={classNames(
calendarPrefixCls,
@ -259,7 +259,7 @@ function generateCalendar<DateType>(generateConfig: GenerateConfig<DateType>) {
generateConfig={generateConfig}
mode={mergedMode}
fullscreen={fullscreen}
locale={mergedLocale.lang}
locale={contextLocale.lang}
validRange={validRange}
onChange={onInternalSelect}
onModeChange={triggerModeChange}
@ -269,13 +269,13 @@ function generateCalendar<DateType>(generateConfig: GenerateConfig<DateType>) {
<RCPickerPanel
value={mergedValue}
prefixCls={prefixCls}
locale={mergedLocale.lang}
locale={contextLocale.lang}
generateConfig={generateConfig}
dateRender={dateRender}
monthCellRender={date => monthRender(date, mergedLocale.lang)}
monthCellRender={date => monthRender(date, contextLocale.lang)}
onSelect={onInternalSelect}
mode={panelMode}
picker={panelMode as any}
picker={panelMode}
disabledDate={mergedDisabledDate}
hideHeader
/>

106
components/card/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -4,7 +4,7 @@ exports[`renders ./components/card/demo/basic.md extend context correctly 1`] =
Array [
<div
class="ant-card ant-card-bordered"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-head"
@ -44,7 +44,7 @@ Array [
</div>,
<div
class="ant-card ant-card-bordered ant-card-small"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-head"
@ -91,7 +91,7 @@ exports[`renders ./components/card/demo/border-less.md extend context correctly
>
<div
class="ant-card"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-head"
@ -126,7 +126,7 @@ exports[`renders ./components/card/demo/border-less.md extend context correctly
exports[`renders ./components/card/demo/flexible-content.md extend context correctly 1`] = `
<div
class="ant-card ant-card-bordered ant-card-hoverable"
style="width: 240px;"
style="width:240px"
>
<div
class="ant-card-cover"
@ -183,43 +183,43 @@ exports[`renders ./components/card/demo/grid-card.md extend context correctly 1`
>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
@ -233,11 +233,11 @@ exports[`renders ./components/card/demo/in-column.md extend context correctly 1`
>
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-8"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-card"
@ -264,7 +264,7 @@ exports[`renders ./components/card/demo/in-column.md extend context correctly 1`
</div>
<div
class="ant-col ant-col-8"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-card"
@ -291,7 +291,7 @@ exports[`renders ./components/card/demo/in-column.md extend context correctly 1`
</div>
<div
class="ant-col ant-col-8"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-card"
@ -373,7 +373,7 @@ exports[`renders ./components/card/demo/inner.md extend context correctly 1`] =
</div>
<div
class="ant-card ant-card-bordered ant-card-type-inner"
style="margin-top: 16px;"
style="margin-top:16px"
>
<div
class="ant-card-head"
@ -424,7 +424,7 @@ Array [
</button>,
<div
class="ant-card ant-card-loading ant-card-bordered"
style="width: 300px; margin-top: 16px;"
style="width:300px;margin-top:16px"
>
<div
class="ant-card-body"
@ -442,7 +442,7 @@ Array [
<li />
<li />
<li
style="width: 61%;"
style="width:61%"
/>
</ul>
</div>
@ -451,7 +451,7 @@ Array [
</div>,
<div
class="ant-card ant-card-bordered"
style="width: 300px; margin-top: 16px;"
style="width:300px;margin-top:16px"
>
<div
class="ant-card-body"
@ -471,7 +471,7 @@ Array [
>
<h3
class="ant-skeleton-title"
style="width: 50%;"
style="width:50%"
/>
<ul
class="ant-skeleton-paragraph"
@ -486,7 +486,7 @@ Array [
class="ant-card-actions"
>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -511,7 +511,7 @@ Array [
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -536,7 +536,7 @@ Array [
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -568,7 +568,7 @@ Array [
exports[`renders ./components/card/demo/meta.md extend context correctly 1`] = `
<div
class="ant-card ant-card-bordered"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-cover"
@ -615,7 +615,7 @@ exports[`renders ./components/card/demo/meta.md extend context correctly 1`] = `
class="ant-card-actions"
>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -640,7 +640,7 @@ exports[`renders ./components/card/demo/meta.md extend context correctly 1`] = `
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -665,7 +665,7 @@ exports[`renders ./components/card/demo/meta.md extend context correctly 1`] = `
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -696,7 +696,7 @@ exports[`renders ./components/card/demo/meta.md extend context correctly 1`] = `
exports[`renders ./components/card/demo/simple.md extend context correctly 1`] = `
<div
class="ant-card ant-card-bordered"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-body"
@ -718,7 +718,7 @@ exports[`renders ./components/card/demo/tabs.md extend context correctly 1`] = `
Array [
<div
class="ant-card ant-card-bordered ant-card-contain-tabs"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-card-head"
@ -753,17 +753,15 @@ Array [
>
<div
class="ant-tabs-nav-list"
style="transform: translate(0px, 0px);"
style="transform:translate(0px, 0px)"
>
<div
class="ant-tabs-tab ant-tabs-tab-active"
>
<div
aria-controls="rc-tabs-test-panel-tabtest"
aria-disabled="false"
aria-selected="true"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-tabtest"
role="tab"
tabindex="0"
>
@ -774,11 +772,9 @@ Array [
class="ant-tabs-tab"
>
<div
aria-controls="rc-tabs-test-panel-tabtest"
aria-disabled="false"
aria-selected="false"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-tabtest"
role="tab"
tabindex="0"
>
@ -794,13 +790,13 @@ Array [
class="ant-tabs-nav-operations ant-tabs-nav-operations-hidden"
>
<button
aria-controls="rc-tabs-test-more-popup"
aria-controls="null-more-popup"
aria-expanded="false"
aria-haspopup="listbox"
aria-hidden="true"
class="ant-tabs-nav-more"
id="rc-tabs-test-more"
style="visibility: hidden; order: 1;"
id="null-more"
style="visibility:hidden;order:1"
tabindex="-1"
type="button"
>
@ -826,20 +822,20 @@ Array [
</button>
<div>
<div
class="ant-tabs-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-tabs-dropdown"
style="opacity:0"
>
<ul
aria-label="expanded dropdown"
class="ant-tabs-dropdown-menu ant-tabs-dropdown-menu-root ant-tabs-dropdown-menu-vertical"
data-menu-list="true"
id="rc-tabs-test-more-popup"
id="null-more-popup"
role="listbox"
tabindex="-1"
/>
<div
aria-hidden="true"
style="display: none;"
style="display:none"
/>
</div>
</div>
@ -853,9 +849,7 @@ Array [
>
<div
aria-hidden="false"
aria-labelledby="rc-tabs-test-tab-tabtest"
class="ant-tabs-tabpane ant-tabs-tabpane-active"
id="rc-tabs-test-panel-tabtest"
role="tabpanel"
tabindex="0"
/>
@ -875,7 +869,7 @@ Array [
<br />,
<div
class="ant-card ant-card-bordered ant-card-contain-tabs"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-card-head"
@ -895,17 +889,15 @@ Array [
>
<div
class="ant-tabs-nav-list"
style="transform: translate(0px, 0px);"
style="transform:translate(0px, 0px)"
>
<div
class="ant-tabs-tab"
>
<div
aria-controls="rc-tabs-test-panel-article"
aria-disabled="false"
aria-selected="false"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-article"
role="tab"
tabindex="0"
>
@ -916,11 +908,9 @@ Array [
class="ant-tabs-tab ant-tabs-tab-active"
>
<div
aria-controls="rc-tabs-test-panel-app"
aria-disabled="false"
aria-selected="true"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-app"
role="tab"
tabindex="0"
>
@ -931,11 +921,9 @@ Array [
class="ant-tabs-tab"
>
<div
aria-controls="rc-tabs-test-panel-project"
aria-disabled="false"
aria-selected="false"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-project"
role="tab"
tabindex="0"
>
@ -951,13 +939,13 @@ Array [
class="ant-tabs-nav-operations ant-tabs-nav-operations-hidden"
>
<button
aria-controls="rc-tabs-test-more-popup"
aria-controls="null-more-popup"
aria-expanded="false"
aria-haspopup="listbox"
aria-hidden="true"
class="ant-tabs-nav-more"
id="rc-tabs-test-more"
style="visibility: hidden; order: 1;"
id="null-more"
style="visibility:hidden;order:1"
tabindex="-1"
type="button"
>
@ -983,20 +971,20 @@ Array [
</button>
<div>
<div
class="ant-tabs-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-tabs-dropdown"
style="opacity:0"
>
<ul
aria-label="expanded dropdown"
class="ant-tabs-dropdown-menu ant-tabs-dropdown-menu-root ant-tabs-dropdown-menu-vertical"
data-menu-list="true"
id="rc-tabs-test-more-popup"
id="null-more-popup"
role="listbox"
tabindex="-1"
/>
<div
aria-hidden="true"
style="display: none;"
style="display:none"
/>
</div>
</div>
@ -1019,9 +1007,7 @@ Array [
>
<div
aria-hidden="false"
aria-labelledby="rc-tabs-test-tab-app"
class="ant-tabs-tabpane ant-tabs-tabpane-active"
id="rc-tabs-test-panel-app"
role="tabpanel"
tabindex="0"
/>

90
components/card/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -4,7 +4,7 @@ exports[`renders ./components/card/demo/basic.md correctly 1`] = `
Array [
<div
class="ant-card ant-card-bordered"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-head"
@ -44,7 +44,7 @@ Array [
</div>,
<div
class="ant-card ant-card-bordered ant-card-small"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-head"
@ -91,7 +91,7 @@ exports[`renders ./components/card/demo/border-less.md correctly 1`] = `
>
<div
class="ant-card"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-head"
@ -126,7 +126,7 @@ exports[`renders ./components/card/demo/border-less.md correctly 1`] = `
exports[`renders ./components/card/demo/flexible-content.md correctly 1`] = `
<div
class="ant-card ant-card-bordered ant-card-hoverable"
style="width: 240px;"
style="width:240px"
>
<div
class="ant-card-cover"
@ -183,43 +183,43 @@ exports[`renders ./components/card/demo/grid-card.md correctly 1`] = `
>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
<div
class="ant-card-grid ant-card-grid-hoverable"
style="width: 25%; text-align: center;"
style="width:25%;text-align:center"
>
Content
</div>
@ -233,11 +233,11 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
>
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-8"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-card"
@ -264,7 +264,7 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
</div>
<div
class="ant-col ant-col-8"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-card"
@ -291,7 +291,7 @@ exports[`renders ./components/card/demo/in-column.md correctly 1`] = `
</div>
<div
class="ant-col ant-col-8"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-card"
@ -373,7 +373,7 @@ exports[`renders ./components/card/demo/inner.md correctly 1`] = `
</div>
<div
class="ant-card ant-card-bordered ant-card-type-inner"
style="margin-top: 16px;"
style="margin-top:16px"
>
<div
class="ant-card-head"
@ -424,7 +424,7 @@ Array [
</button>,
<div
class="ant-card ant-card-loading ant-card-bordered"
style="width: 300px; margin-top: 16px;"
style="width:300px;margin-top:16px"
>
<div
class="ant-card-body"
@ -442,7 +442,7 @@ Array [
<li />
<li />
<li
style="width: 61%;"
style="width:61%"
/>
</ul>
</div>
@ -451,7 +451,7 @@ Array [
</div>,
<div
class="ant-card ant-card-bordered"
style="width: 300px; margin-top: 16px;"
style="width:300px;margin-top:16px"
>
<div
class="ant-card-body"
@ -471,7 +471,7 @@ Array [
>
<h3
class="ant-skeleton-title"
style="width: 50%;"
style="width:50%"
/>
<ul
class="ant-skeleton-paragraph"
@ -486,7 +486,7 @@ Array [
class="ant-card-actions"
>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -511,7 +511,7 @@ Array [
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -536,7 +536,7 @@ Array [
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -568,7 +568,7 @@ Array [
exports[`renders ./components/card/demo/meta.md correctly 1`] = `
<div
class="ant-card ant-card-bordered"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-cover"
@ -615,7 +615,7 @@ exports[`renders ./components/card/demo/meta.md correctly 1`] = `
class="ant-card-actions"
>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -640,7 +640,7 @@ exports[`renders ./components/card/demo/meta.md correctly 1`] = `
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -665,7 +665,7 @@ exports[`renders ./components/card/demo/meta.md correctly 1`] = `
</span>
</li>
<li
style="width: 33.333333333333336%;"
style="width:33.333333333333336%"
>
<span>
<span
@ -696,7 +696,7 @@ exports[`renders ./components/card/demo/meta.md correctly 1`] = `
exports[`renders ./components/card/demo/simple.md correctly 1`] = `
<div
class="ant-card ant-card-bordered"
style="width: 300px;"
style="width:300px"
>
<div
class="ant-card-body"
@ -718,7 +718,7 @@ exports[`renders ./components/card/demo/tabs.md correctly 1`] = `
Array [
<div
class="ant-card ant-card-bordered ant-card-contain-tabs"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-card-head"
@ -753,17 +753,15 @@ Array [
>
<div
class="ant-tabs-nav-list"
style="transform: translate(0px, 0px);"
style="transform:translate(0px, 0px)"
>
<div
class="ant-tabs-tab ant-tabs-tab-active"
>
<div
aria-controls="rc-tabs-test-panel-tabtest"
aria-disabled="false"
aria-selected="true"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-tabtest"
role="tab"
tabindex="0"
>
@ -774,11 +772,9 @@ Array [
class="ant-tabs-tab"
>
<div
aria-controls="rc-tabs-test-panel-tabtest"
aria-disabled="false"
aria-selected="false"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-tabtest"
role="tab"
tabindex="0"
>
@ -794,13 +790,13 @@ Array [
class="ant-tabs-nav-operations ant-tabs-nav-operations-hidden"
>
<button
aria-controls="rc-tabs-test-more-popup"
aria-controls="null-more-popup"
aria-expanded="false"
aria-haspopup="listbox"
aria-hidden="true"
class="ant-tabs-nav-more"
id="rc-tabs-test-more"
style="visibility: hidden; order: 1;"
id="null-more"
style="visibility:hidden;order:1"
tabindex="-1"
type="button"
>
@ -834,9 +830,7 @@ Array [
>
<div
aria-hidden="false"
aria-labelledby="rc-tabs-test-tab-tabtest"
class="ant-tabs-tabpane ant-tabs-tabpane-active"
id="rc-tabs-test-panel-tabtest"
role="tabpanel"
tabindex="0"
/>
@ -856,7 +850,7 @@ Array [
<br />,
<div
class="ant-card ant-card-bordered ant-card-contain-tabs"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-card-head"
@ -876,17 +870,15 @@ Array [
>
<div
class="ant-tabs-nav-list"
style="transform: translate(0px, 0px);"
style="transform:translate(0px, 0px)"
>
<div
class="ant-tabs-tab"
>
<div
aria-controls="rc-tabs-test-panel-article"
aria-disabled="false"
aria-selected="false"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-article"
role="tab"
tabindex="0"
>
@ -897,11 +889,9 @@ Array [
class="ant-tabs-tab ant-tabs-tab-active"
>
<div
aria-controls="rc-tabs-test-panel-app"
aria-disabled="false"
aria-selected="true"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-app"
role="tab"
tabindex="0"
>
@ -912,11 +902,9 @@ Array [
class="ant-tabs-tab"
>
<div
aria-controls="rc-tabs-test-panel-project"
aria-disabled="false"
aria-selected="false"
class="ant-tabs-tab-btn"
id="rc-tabs-test-tab-project"
role="tab"
tabindex="0"
>
@ -932,13 +920,13 @@ Array [
class="ant-tabs-nav-operations ant-tabs-nav-operations-hidden"
>
<button
aria-controls="rc-tabs-test-more-popup"
aria-controls="null-more-popup"
aria-expanded="false"
aria-haspopup="listbox"
aria-hidden="true"
class="ant-tabs-nav-more"
id="rc-tabs-test-more"
style="visibility: hidden; order: 1;"
id="null-more"
style="visibility:hidden;order:1"
tabindex="-1"
type="button"
>
@ -981,9 +969,7 @@ Array [
>
<div
aria-hidden="false"
aria-labelledby="rc-tabs-test-tab-app"
class="ant-tabs-tabpane ant-tabs-tabpane-active"
id="rc-tabs-test-panel-app"
role="tabpanel"
tabindex="0"
/>

204
components/carousel/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -13,22 +13,22 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
>
<div
class="slick-track"
style="opacity: 1; transform: translate3d(0px, 0px, 0px);"
style="width:900%;left:-100%"
>
<div
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="-1"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -39,16 +39,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -59,16 +59,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -79,16 +79,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -99,16 +99,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -119,16 +119,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="4"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -139,16 +139,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="5"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -159,16 +159,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="6"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -179,16 +179,16 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="7"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -199,7 +199,7 @@ exports[`renders ./components/carousel/demo/autoplay.md extend context correctly
</div>
<ul
class="slick-dots slick-dots-bottom"
style="display: block;"
style="display:block"
>
<li
class="slick-active"
@ -247,22 +247,22 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
>
<div
class="slick-track"
style="opacity: 1; transform: translate3d(0px, 0px, 0px);"
style="width:900%;left:-100%"
>
<div
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="-1"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -273,16 +273,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -293,16 +293,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -313,16 +313,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -333,16 +333,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -353,16 +353,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="4"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -373,16 +373,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="5"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -393,16 +393,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="6"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -413,16 +413,16 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="7"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -433,7 +433,7 @@ exports[`renders ./components/carousel/demo/basic.md extend context correctly 1`
</div>
<ul
class="slick-dots slick-dots-bottom"
style="display: block;"
style="display:block"
>
<li
class="slick-active"
@ -481,22 +481,22 @@ exports[`renders ./components/carousel/demo/fade.md extend context correctly 1`]
>
<div
class="slick-track"
style="opacity: 1;"
style="width:900%;left:-100%"
>
<div
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 1; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:0;opacity:1;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -507,16 +507,16 @@ exports[`renders ./components/carousel/demo/fade.md extend context correctly 1`]
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:-11px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -527,16 +527,16 @@ exports[`renders ./components/carousel/demo/fade.md extend context correctly 1`]
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:-22px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -547,16 +547,16 @@ exports[`renders ./components/carousel/demo/fade.md extend context correctly 1`]
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:-33px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -567,7 +567,7 @@ exports[`renders ./components/carousel/demo/fade.md extend context correctly 1`]
</div>
<ul
class="slick-dots slick-dots-bottom"
style="display: block;"
style="display:block"
>
<li
class="slick-active"
@ -606,7 +606,7 @@ exports[`renders ./components/carousel/demo/position.md extend context correctly
Array [
<div
class="ant-radio-group ant-radio-group-outline"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
@ -698,22 +698,22 @@ Array [
>
<div
class="slick-track"
style="opacity: 1; transform: translate3d(0px, 0px, 0px);"
style="width:900%;left:-100%"
>
<div
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="-1"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -724,16 +724,16 @@ Array [
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -744,16 +744,16 @@ Array [
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -764,16 +764,16 @@ Array [
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -784,16 +784,16 @@ Array [
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -804,16 +804,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="4"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -824,16 +824,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="5"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -844,16 +844,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="6"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -864,16 +864,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="7"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -884,7 +884,7 @@ Array [
</div>
<ul
class="slick-dots slick-dots-top"
style="display: block;"
style="display:block"
>
<li
class="slick-active"

204
components/carousel/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -13,22 +13,22 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
>
<div
class="slick-track"
style="opacity: 1; transform: translate3d(0px, 0px, 0px);"
style="width:900%;left:-100%"
>
<div
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="-1"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -39,16 +39,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -59,16 +59,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -79,16 +79,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -99,16 +99,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -119,16 +119,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="4"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -139,16 +139,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="5"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -159,16 +159,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="6"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -179,16 +179,16 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="7"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -199,7 +199,7 @@ exports[`renders ./components/carousel/demo/autoplay.md correctly 1`] = `
</div>
<ul
class="slick-dots slick-dots-bottom"
style="display: block;"
style="display:block"
>
<li
class="slick-active"
@ -247,22 +247,22 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
>
<div
class="slick-track"
style="opacity: 1; transform: translate3d(0px, 0px, 0px);"
style="width:900%;left:-100%"
>
<div
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="-1"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -273,16 +273,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -293,16 +293,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -313,16 +313,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -333,16 +333,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -353,16 +353,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="4"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -373,16 +373,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="5"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -393,16 +393,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="6"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -413,16 +413,16 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="7"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -433,7 +433,7 @@ exports[`renders ./components/carousel/demo/basic.md correctly 1`] = `
</div>
<ul
class="slick-dots slick-dots-bottom"
style="display: block;"
style="display:block"
>
<li
class="slick-active"
@ -481,22 +481,22 @@ exports[`renders ./components/carousel/demo/fade.md correctly 1`] = `
>
<div
class="slick-track"
style="opacity: 1;"
style="width:900%;left:-100%"
>
<div
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 1; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:0;opacity:1;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -507,16 +507,16 @@ exports[`renders ./components/carousel/demo/fade.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:-11px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -527,16 +527,16 @@ exports[`renders ./components/carousel/demo/fade.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:-22px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -547,16 +547,16 @@ exports[`renders ./components/carousel/demo/fade.md correctly 1`] = `
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px; position: relative; left: 0px; opacity: 0; transition: opacity 500ms ease, visibility 500ms ease;"
style="outline:none;width:11.11111111111111%;position:relative;left:-33px;opacity:0;transition:opacity 500ms ease, visibility 500ms ease"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -567,7 +567,7 @@ exports[`renders ./components/carousel/demo/fade.md correctly 1`] = `
</div>
<ul
class="slick-dots slick-dots-bottom"
style="display: block;"
style="display:block"
>
<li
class="slick-active"
@ -606,7 +606,7 @@ exports[`renders ./components/carousel/demo/position.md correctly 1`] = `
Array [
<div
class="ant-radio-group ant-radio-group-outline"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<label
class="ant-radio-button-wrapper ant-radio-button-wrapper-checked"
@ -698,22 +698,22 @@ Array [
>
<div
class="slick-track"
style="opacity: 1; transform: translate3d(0px, 0px, 0px);"
style="width:900%;left:-100%"
>
<div
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="-1"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -724,16 +724,16 @@ Array [
aria-hidden="false"
class="slick-slide slick-active slick-current"
data-index="0"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -744,16 +744,16 @@ Array [
aria-hidden="true"
class="slick-slide"
data-index="1"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -764,16 +764,16 @@ Array [
aria-hidden="true"
class="slick-slide"
data-index="2"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -784,16 +784,16 @@ Array [
aria-hidden="true"
class="slick-slide"
data-index="3"
style="outline: none; width: 0px;"
style="outline:none;width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -804,16 +804,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="4"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
1
</h3>
@ -824,16 +824,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="5"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
2
</h3>
@ -844,16 +844,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="6"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
3
</h3>
@ -864,16 +864,16 @@ Array [
aria-hidden="true"
class="slick-slide slick-cloned"
data-index="7"
style="width: 0px;"
style="width:11.11111111111111%"
tabindex="-1"
>
<div>
<div
style="width: 100%; display: inline-block;"
style="width:100%;display:inline-block"
tabindex="-1"
>
<h3
style="height: 160px; color: rgb(255, 255, 255); line-height: 160px; text-align: center; background: rgb(54, 77, 121);"
style="height:160px;color:#fff;line-height:160px;text-align:center;background:#364d79"
>
4
</h3>
@ -884,7 +884,7 @@ Array [
</div>
<ul
class="slick-dots slick-dots-top"
style="display: block;"
style="display:block"
>
<li
class="slick-active"

339
components/cascader/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -12,15 +12,14 @@ exports[`renders ./components/cascader/demo/basic.md extend context correctly 1`
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -34,8 +33,8 @@ exports[`renders ./components/cascader/demo/basic.md extend context correctly 1`
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -125,7 +124,7 @@ exports[`renders ./components/cascader/demo/basic.md extend context correctly 1`
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -163,15 +162,14 @@ exports[`renders ./components/cascader/demo/change-on-select.md extend context c
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -183,8 +181,8 @@ exports[`renders ./components/cascader/demo/change-on-select.md extend context c
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -274,7 +272,7 @@ exports[`renders ./components/cascader/demo/change-on-select.md extend context c
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -312,15 +310,14 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md extend context co
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -334,8 +331,8 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md extend context co
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div>
@ -423,10 +420,10 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md extend context co
<div
class="ant-divider ant-divider-horizontal"
role="separator"
style="margin: 0px;"
style="margin:0"
/>
<div
style="padding: 8px;"
style="padding:8px"
>
The footer is not very short.
</div>
@ -437,7 +434,7 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md extend context co
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -466,7 +463,7 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md extend context co
exports[`renders ./components/cascader/demo/custom-render.md extend context correctly 1`] = `
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -476,15 +473,14 @@ exports[`renders ./components/cascader/demo/custom-render.md extend context corr
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -495,14 +491,17 @@ exports[`renders ./components/cascader/demo/custom-render.md extend context corr
>
<span>
Zhejiang
<!-- -->
/
</span>
<span>
Hangzhou
<!-- -->
/
</span>
<span>
West Lake
<!-- -->
(
<a>
752100
@ -513,8 +512,8 @@ exports[`renders ./components/cascader/demo/custom-render.md extend context corr
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -604,7 +603,7 @@ exports[`renders ./components/cascader/demo/custom-render.md extend context corr
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -630,7 +629,7 @@ exports[`renders ./components/cascader/demo/custom-render.md extend context corr
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -659,6 +658,7 @@ exports[`renders ./components/cascader/demo/custom-render.md extend context corr
exports[`renders ./components/cascader/demo/custom-trigger.md extend context correctly 1`] = `
<span>
Unselect
<!-- -->
<a
href="#"
>
@ -666,8 +666,8 @@ exports[`renders ./components/cascader/demo/custom-trigger.md extend context cor
</a>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -769,15 +769,14 @@ exports[`renders ./components/cascader/demo/default-value.md extend context corr
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -792,8 +791,8 @@ exports[`renders ./components/cascader/demo/default-value.md extend context corr
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -883,7 +882,7 @@ exports[`renders ./components/cascader/demo/default-value.md extend context corr
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -909,7 +908,7 @@ exports[`renders ./components/cascader/demo/default-value.md extend context corr
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -947,15 +946,14 @@ exports[`renders ./components/cascader/demo/disabled-option.md extend context co
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -967,8 +965,8 @@ exports[`renders ./components/cascader/demo/disabled-option.md extend context co
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -1058,7 +1056,7 @@ exports[`renders ./components/cascader/demo/disabled-option.md extend context co
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1096,15 +1094,14 @@ exports[`renders ./components/cascader/demo/fields-name.md extend context correc
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1118,8 +1115,8 @@ exports[`renders ./components/cascader/demo/fields-name.md extend context correc
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -1209,7 +1206,7 @@ exports[`renders ./components/cascader/demo/fields-name.md extend context correc
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1247,15 +1244,14 @@ exports[`renders ./components/cascader/demo/hover.md extend context correctly 1`
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1267,8 +1263,8 @@ exports[`renders ./components/cascader/demo/hover.md extend context correctly 1`
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -1358,7 +1354,7 @@ exports[`renders ./components/cascader/demo/hover.md extend context correctly 1`
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1396,15 +1392,14 @@ exports[`renders ./components/cascader/demo/lazy.md extend context correctly 1`]
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1416,8 +1411,8 @@ exports[`renders ./components/cascader/demo/lazy.md extend context correctly 1`]
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -1507,7 +1502,7 @@ exports[`renders ./components/cascader/demo/lazy.md extend context correctly 1`]
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1536,7 +1531,7 @@ exports[`renders ./components/cascader/demo/lazy.md extend context correctly 1`]
exports[`renders ./components/cascader/demo/multiple.md extend context correctly 1`] = `
<div
class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -1546,23 +1541,22 @@ exports[`renders ./components/cascader/demo/multiple.md extend context correctly
>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1; order: 0;"
style="opacity:1;order:0"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1581,8 +1575,8 @@ exports[`renders ./components/cascader/demo/multiple.md extend context correctly
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -1782,15 +1776,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1804,8 +1797,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-down-appear ant-slide-down-appear-prepare ant-slide-down"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -1895,7 +1888,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1934,12 +1927,11 @@ exports[`renders ./components/cascader/demo/search.md extend context correctly 1
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -1953,8 +1945,8 @@ exports[`renders ./components/cascader/demo/search.md extend context correctly 1
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -2044,7 +2036,7 @@ exports[`renders ./components/cascader/demo/search.md extend context correctly 1
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2074,7 +2066,7 @@ exports[`renders ./components/cascader/demo/showCheckedStrategy.md extend contex
Array [
<div
class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -2085,7 +2077,7 @@ Array [
<div
aria-hidden="true"
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-rest"
style="opacity: 0; height: 0px; overflow-y: hidden; order: 9007199254740991; pointer-events: none; position: absolute;"
style="opacity:0;height:0;overflow-y:hidden;order:9007199254740991;pointer-events:none;position:absolute"
>
<span
class="ant-select-selection-item"
@ -2100,23 +2092,22 @@ Array [
</div>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1; order: 0;"
style="opacity:1;order:0"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2132,8 +2123,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -2237,7 +2228,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2265,7 +2256,7 @@ Array [
<br />,
<div
class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -2276,7 +2267,7 @@ Array [
<div
aria-hidden="true"
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-rest"
style="opacity: 0; height: 0px; overflow-y: hidden; order: 9007199254740991; pointer-events: none; position: absolute;"
style="opacity:0;height:0;overflow-y:hidden;order:9007199254740991;pointer-events:none;position:absolute"
>
<span
class="ant-select-selection-item"
@ -2291,23 +2282,22 @@ Array [
</div>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1; order: 0;"
style="opacity:1;order:0"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2323,8 +2313,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -2428,7 +2418,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2468,15 +2458,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2488,8 +2477,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -2579,7 +2568,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2616,15 +2605,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2636,8 +2624,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -2727,7 +2715,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2764,15 +2752,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2784,8 +2771,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -2875,7 +2862,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -2910,7 +2897,7 @@ exports[`renders ./components/cascader/demo/status.md extend context correctly 1
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-select ant-cascader ant-select-status-error ant-select-single ant-select-allow-clear ant-select-show-arrow"
@ -2923,15 +2910,14 @@ exports[`renders ./components/cascader/demo/status.md extend context correctly 1
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -2945,8 +2931,8 @@ exports[`renders ./components/cascader/demo/status.md extend context correctly 1
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty"
style="opacity:0"
>
<div>
<div
@ -3021,7 +3007,7 @@ exports[`renders ./components/cascader/demo/status.md extend context correctly 1
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -3060,23 +3046,22 @@ exports[`renders ./components/cascader/demo/status.md extend context correctly 1
>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1;"
style="opacity:1"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -3097,8 +3082,8 @@ exports[`renders ./components/cascader/demo/status.md extend context correctly 1
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty"
style="opacity:0"
>
<div>
<div
@ -3188,15 +3173,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -3210,8 +3194,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -3301,7 +3285,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -3338,15 +3322,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -3360,8 +3343,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -3451,7 +3434,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
ab
@ -3470,15 +3453,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -3492,8 +3474,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -3583,7 +3565,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -3620,15 +3602,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -3642,8 +3623,8 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0; min-width: auto;"
class="ant-select-dropdown ant-cascader-dropdown"
style="opacity:0;min-width:auto"
>
<div>
<div
@ -3697,7 +3678,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span

239
components/cascader/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -12,15 +12,14 @@ exports[`renders ./components/cascader/demo/basic.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -35,7 +34,7 @@ exports[`renders ./components/cascader/demo/basic.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -73,15 +72,14 @@ exports[`renders ./components/cascader/demo/change-on-select.md correctly 1`] =
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -94,7 +92,7 @@ exports[`renders ./components/cascader/demo/change-on-select.md correctly 1`] =
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -132,15 +130,14 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -155,7 +152,7 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -184,7 +181,7 @@ exports[`renders ./components/cascader/demo/custom-dropdown.md correctly 1`] = `
exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -194,15 +191,14 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -213,14 +209,17 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
>
<span>
Zhejiang
<!-- -->
/
</span>
<span>
Hangzhou
<!-- -->
/
</span>
<span>
West Lake
<!-- -->
(
<a>
752100
@ -232,7 +231,7 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -258,7 +257,7 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -287,6 +286,7 @@ exports[`renders ./components/cascader/demo/custom-render.md correctly 1`] = `
exports[`renders ./components/cascader/demo/custom-trigger.md correctly 1`] = `
<span>
Unselect
<!-- -->
<a
href="#"
>
@ -307,15 +307,14 @@ exports[`renders ./components/cascader/demo/default-value.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -331,7 +330,7 @@ exports[`renders ./components/cascader/demo/default-value.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -357,7 +356,7 @@ exports[`renders ./components/cascader/demo/default-value.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -395,15 +394,14 @@ exports[`renders ./components/cascader/demo/disabled-option.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -416,7 +414,7 @@ exports[`renders ./components/cascader/demo/disabled-option.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -454,15 +452,14 @@ exports[`renders ./components/cascader/demo/fields-name.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -477,7 +474,7 @@ exports[`renders ./components/cascader/demo/fields-name.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -515,15 +512,14 @@ exports[`renders ./components/cascader/demo/hover.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -536,7 +532,7 @@ exports[`renders ./components/cascader/demo/hover.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -574,15 +570,14 @@ exports[`renders ./components/cascader/demo/lazy.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -595,7 +590,7 @@ exports[`renders ./components/cascader/demo/lazy.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -624,7 +619,7 @@ exports[`renders ./components/cascader/demo/lazy.md correctly 1`] = `
exports[`renders ./components/cascader/demo/multiple.md correctly 1`] = `
<div
class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -634,23 +629,22 @@ exports[`renders ./components/cascader/demo/multiple.md correctly 1`] = `
>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1; order: 0;"
style="opacity:1;order:0"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -766,15 +760,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -789,7 +782,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -828,12 +821,11 @@ exports[`renders ./components/cascader/demo/search.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -848,7 +840,7 @@ exports[`renders ./components/cascader/demo/search.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -878,7 +870,7 @@ exports[`renders ./components/cascader/demo/showCheckedStrategy.md correctly 1`]
Array [
<div
class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -889,7 +881,7 @@ Array [
<div
aria-hidden="true"
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-rest"
style="opacity: 0; height: 0px; overflow-y: hidden; order: 9007199254740991; pointer-events: none; position: absolute;"
style="opacity:0;height:0;overflow-y:hidden;order:9007199254740991;pointer-events:none;position:absolute"
>
<span
class="ant-select-selection-item"
@ -904,23 +896,22 @@ Array [
</div>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1; order: 0;"
style="opacity:1;order:0"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -937,7 +928,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -965,7 +956,7 @@ Array [
<br />,
<div
class="ant-select ant-cascader ant-select-multiple ant-select-allow-clear"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-select-selector"
@ -976,7 +967,7 @@ Array [
<div
aria-hidden="true"
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-rest"
style="opacity: 0; height: 0px; overflow-y: hidden; order: 9007199254740991; pointer-events: none; position: absolute;"
style="opacity:0;height:0;overflow-y:hidden;order:9007199254740991;pointer-events:none;position:absolute"
>
<span
class="ant-select-selection-item"
@ -991,23 +982,22 @@ Array [
</div>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1; order: 0;"
style="opacity:1;order:0"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1024,7 +1014,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-clear"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1064,15 +1054,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1085,7 +1074,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1122,15 +1111,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1143,7 +1131,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1180,15 +1168,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1201,7 +1188,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1236,7 +1223,7 @@ exports[`renders ./components/cascader/demo/status.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-select ant-cascader ant-select-status-error ant-select-single ant-select-allow-clear ant-select-show-arrow"
@ -1249,15 +1236,14 @@ exports[`renders ./components/cascader/demo/status.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1272,7 +1258,7 @@ exports[`renders ./components/cascader/demo/status.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1311,23 +1297,22 @@ exports[`renders ./components/cascader/demo/status.md correctly 1`] = `
>
<div
class="ant-select-selection-overflow-item ant-select-selection-overflow-item-suffix"
style="opacity: 1;"
style="opacity:1"
>
<div
class="ant-select-selection-search"
style="width: 0px;"
style="width:0"
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1364,15 +1349,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1387,7 +1371,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1424,15 +1408,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1447,7 +1430,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
ab
@ -1466,15 +1449,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1489,7 +1471,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1526,15 +1508,14 @@ Array [
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1549,7 +1530,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span

11
components/cascader/__tests__/index.test.tsx
View File

@ -251,7 +251,7 @@ describe('Cascader', () => {
});
it('can use fieldNames', () => {
const customerOptions = [
const customOptions = [
{
code: 'zhejiang',
name: 'Zhejiang',
@ -290,7 +290,7 @@ describe('Cascader', () => {
const { container } = render(
<Cascader
options={customerOptions}
options={customOptions}
onChange={onChange}
fieldNames={{
children: 'items',
@ -311,8 +311,7 @@ describe('Cascader', () => {
});
it('should show not found content when options.length is 0', () => {
const customerOptions: any[] = [];
const { container } = render(<Cascader options={customerOptions} />);
const { container } = render(<Cascader options={[]} />);
toggleOpen(container);
expect(getDropdown(container)).toMatchSnapshot();
});
@ -398,7 +397,7 @@ describe('Cascader', () => {
});
it('placement work correctly', async () => {
const customerOptions = [
const customOptions = [
{
value: 'zhejiang',
label: 'Zhejiang',
@ -410,7 +409,7 @@ describe('Cascader', () => {
],
},
];
const { container } = render(<Cascader options={customerOptions} placement="topRight" />);
const { container } = render(<Cascader options={customOptions} placement="topRight" />);
toggleOpen(container);
// Inject in tests/__mocks__/rc-trigger.js

27
components/checkbox/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -10,7 +10,6 @@ exports[`renders ./components/checkbox/demo/basic.md extend context correctly 1`
<input
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -34,7 +33,6 @@ Array [
aria-checked="mixed"
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -117,7 +115,7 @@ Array [
exports[`renders ./components/checkbox/demo/controller.md extend context correctly 1`] = `
Array [
<p
style="margin-bottom: 20px;"
style="margin-bottom:20px"
>
<label
class="ant-checkbox-wrapper ant-checkbox-wrapper-checked"
@ -129,7 +127,6 @@ Array [
checked=""
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -151,7 +148,7 @@ Array [
</button>
<button
class="ant-btn ant-btn-primary ant-btn-sm"
style="margin: 0px 10px;"
style="margin:0 10px"
type="button"
>
<span>
@ -166,11 +163,11 @@ exports[`renders ./components/checkbox/demo/debug-line.md extend context correct
<div>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="border: 1px solid red; margin-bottom: 16px;"
style="border:1px solid red;margin-bottom:16px"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<label
class="ant-checkbox-wrapper"
@ -191,7 +188,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md extend context correct
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div>
Bamboo
@ -223,11 +220,11 @@ exports[`renders ./components/checkbox/demo/debug-line.md extend context correct
</div>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="border: 1px solid red; margin-bottom: 16px;"
style="border:1px solid red;margin-bottom:16px"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<label
class="ant-radio-wrapper"
@ -248,7 +245,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md extend context correct
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div>
Bamboo
@ -279,7 +276,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md extend context correct
</div>
</div>
<div
style="border: 1px solid red; margin-bottom: 16px; display: flex; align-items: center;"
style="border:1px solid red;margin-bottom:16px;display:flex;align-items:center"
>
<label
class="ant-checkbox-wrapper"
@ -321,7 +318,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md extend context correct
</label>
</div>
<div
style="border: 1px solid red; margin-bottom: 16px; display: flex; align-items: center;"
style="border:1px solid red;margin-bottom:16px;display:flex;align-items:center"
>
<label
class="ant-radio-wrapper"
@ -377,7 +374,6 @@ Array [
class="ant-checkbox-input"
disabled=""
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -396,7 +392,6 @@ Array [
class="ant-checkbox-input"
disabled=""
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -607,7 +602,7 @@ Array [
exports[`renders ./components/checkbox/demo/layout.md extend context correctly 1`] = `
<div
class="ant-checkbox-group"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-row"

27
components/checkbox/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -10,7 +10,6 @@ exports[`renders ./components/checkbox/demo/basic.md correctly 1`] = `
<input
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -34,7 +33,6 @@ Array [
aria-checked="mixed"
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -117,7 +115,7 @@ Array [
exports[`renders ./components/checkbox/demo/controller.md correctly 1`] = `
Array [
<p
style="margin-bottom: 20px;"
style="margin-bottom:20px"
>
<label
class="ant-checkbox-wrapper ant-checkbox-wrapper-checked"
@ -129,7 +127,6 @@ Array [
checked=""
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -151,7 +148,7 @@ Array [
</button>
<button
class="ant-btn ant-btn-primary ant-btn-sm"
style="margin: 0px 10px;"
style="margin:0 10px"
type="button"
>
<span>
@ -166,11 +163,11 @@ exports[`renders ./components/checkbox/demo/debug-line.md correctly 1`] = `
<div>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="border: 1px solid red; margin-bottom: 16px;"
style="border:1px solid red;margin-bottom:16px"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<label
class="ant-checkbox-wrapper"
@ -191,7 +188,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div>
Bamboo
@ -223,11 +220,11 @@ exports[`renders ./components/checkbox/demo/debug-line.md correctly 1`] = `
</div>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="border: 1px solid red; margin-bottom: 16px;"
style="border:1px solid red;margin-bottom:16px"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<label
class="ant-radio-wrapper"
@ -248,7 +245,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div>
Bamboo
@ -279,7 +276,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md correctly 1`] = `
</div>
</div>
<div
style="border: 1px solid red; margin-bottom: 16px; display: flex; align-items: center;"
style="border:1px solid red;margin-bottom:16px;display:flex;align-items:center"
>
<label
class="ant-checkbox-wrapper"
@ -321,7 +318,7 @@ exports[`renders ./components/checkbox/demo/debug-line.md correctly 1`] = `
</label>
</div>
<div
style="border: 1px solid red; margin-bottom: 16px; display: flex; align-items: center;"
style="border:1px solid red;margin-bottom:16px;display:flex;align-items:center"
>
<label
class="ant-radio-wrapper"
@ -377,7 +374,6 @@ Array [
class="ant-checkbox-input"
disabled=""
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -396,7 +392,6 @@ Array [
class="ant-checkbox-input"
disabled=""
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -607,7 +602,7 @@ Array [
exports[`renders ./components/checkbox/demo/layout.md correctly 1`] = `
<div
class="ant-checkbox-group"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-row"

1
components/checkbox/index.tsx
View File

@ -9,6 +9,7 @@ export { CheckboxGroupProps, CheckboxOptionType } from './Group';
interface CompoundedComponent
extends React.ForwardRefExoticComponent<CheckboxProps & React.RefAttributes<HTMLInputElement>> {
Group: typeof Group;
/** @internal */
__ANT_CHECKBOX: boolean;
}

57
components/collapse/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -156,7 +156,7 @@ exports[`renders ./components/collapse/demo/basic.md extend context correctly 1`
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -297,7 +297,7 @@ exports[`renders ./components/collapse/demo/borderless.md extend context correct
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -320,7 +320,7 @@ exports[`renders ./components/collapse/demo/borderless.md extend context correct
class="ant-collapse-content-box"
>
<p
style="padding-left: 24px;"
style="padding-left:24px"
>
A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can be found as a welcome guest in many households across the world.
</p>
@ -416,7 +416,7 @@ exports[`renders ./components/collapse/demo/collapsible.md extend context correc
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-collapse ant-collapse-icon-position-start"
@ -443,7 +443,7 @@ exports[`renders ./components/collapse/demo/collapsible.md extend context correc
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -477,7 +477,7 @@ exports[`renders ./components/collapse/demo/collapsible.md extend context correc
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-collapse ant-collapse-icon-position-start"
@ -504,7 +504,7 @@ exports[`renders ./components/collapse/demo/collapsible.md extend context correc
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -615,7 +615,7 @@ exports[`renders ./components/collapse/demo/custom.md extend context correctly 1
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="0 0 1024 1024"
width="1em"
>
@ -757,7 +757,7 @@ Array [
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -946,7 +946,7 @@ Array [
</span>,
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="margin: 0px 8px;"
style="margin:0 8px"
>
<div
class="ant-select-selector"
@ -955,17 +955,16 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -980,19 +979,19 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown"
style="opacity:0"
>
<div>
<div
id="rc_select_test_list"
id="undefined_list"
role="listbox"
style="height: 0px; width: 0px; overflow: hidden;"
style="height:0;width:0;overflow:hidden"
>
<div
aria-label="start"
aria-selected="true"
id="rc_select_test_list_test"
id="undefined_list_0"
role="option"
>
start
@ -1000,7 +999,7 @@ Array [
<div
aria-label="end"
aria-selected="false"
id="rc_select_test_list_test"
id="undefined_list_1"
role="option"
>
end
@ -1008,16 +1007,16 @@ Array [
</div>
<div
class="rc-virtual-list"
style="position: relative;"
style="position:relative"
>
<div
class="rc-virtual-list-holder"
style="max-height: 256px; overflow-y: auto;"
style="max-height:256px;overflow-y:auto;overflow-anchor:none"
>
<div>
<div
class="rc-virtual-list-holder-inner"
style="display: flex; flex-direction: column;"
style="display:flex;flex-direction:column"
>
<div
aria-selected="true"
@ -1032,7 +1031,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -1049,7 +1048,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -1063,7 +1062,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1118,7 +1117,7 @@ exports[`renders ./components/collapse/demo/ghost.md extend context correctly 1`
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -1386,7 +1385,7 @@ exports[`renders ./components/collapse/demo/noarrow.md extend context correctly
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>

35
components/collapse/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -156,7 +156,7 @@ exports[`renders ./components/collapse/demo/basic.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -297,7 +297,7 @@ exports[`renders ./components/collapse/demo/borderless.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -320,7 +320,7 @@ exports[`renders ./components/collapse/demo/borderless.md correctly 1`] = `
class="ant-collapse-content-box"
>
<p
style="padding-left: 24px;"
style="padding-left:24px"
>
A dog is a type of domesticated animal. Known for its loyalty and faithfulness, it can be found as a welcome guest in many households across the world.
</p>
@ -416,7 +416,7 @@ exports[`renders ./components/collapse/demo/collapsible.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-collapse ant-collapse-icon-position-start"
@ -443,7 +443,7 @@ exports[`renders ./components/collapse/demo/collapsible.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -477,7 +477,7 @@ exports[`renders ./components/collapse/demo/collapsible.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-collapse ant-collapse-icon-position-start"
@ -504,7 +504,7 @@ exports[`renders ./components/collapse/demo/collapsible.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -615,7 +615,7 @@ exports[`renders ./components/collapse/demo/custom.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="0 0 1024 1024"
width="1em"
>
@ -757,7 +757,7 @@ Array [
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -946,7 +946,7 @@ Array [
</span>,
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="margin: 0px 8px;"
style="margin:0 8px"
>
<div
class="ant-select-selector"
@ -955,17 +955,16 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -981,7 +980,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1036,7 +1035,7 @@ exports[`renders ./components/collapse/demo/ghost.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -1304,7 +1303,7 @@ exports[`renders ./components/collapse/demo/noarrow.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(90deg);"
style="-ms-transform:rotate(90deg);transform:rotate(90deg)"
viewBox="64 64 896 896"
width="1em"
>

20
components/comment/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -40,8 +40,8 @@ exports[`renders ./components/comment/demo/basic.md extend context correctly 1`]
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -103,8 +103,8 @@ exports[`renders ./components/comment/demo/basic.md extend context correctly 1`]
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -155,8 +155,8 @@ exports[`renders ./components/comment/demo/basic.md extend context correctly 1`]
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -324,8 +324,8 @@ exports[`renders ./components/comment/demo/list.md extend context correctly 1`]
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -402,8 +402,8 @@ exports[`renders ./components/comment/demo/list.md extend context correctly 1`]
</span>
<div>
<div
class="ant-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"

35
components/config-provider/__tests__/__snapshots__/components.test.tsx.snap
View File

@ -16231,7 +16231,6 @@ exports[`ConfigProvider components Input configProvider 1`] = `
class="config-input-affix-wrapper config-input-password"
>
<input
action="click"
class="config-input"
type="password"
value=""
@ -16329,7 +16328,6 @@ exports[`ConfigProvider components Input configProvider componentDisabled 1`] =
class="config-input-affix-wrapper config-input-affix-wrapper-disabled config-input-password"
>
<input
action="click"
class="config-input config-input-disabled"
disabled=""
type="password"
@ -16426,7 +16424,6 @@ exports[`ConfigProvider components Input configProvider componentSize large 1`]
class="config-input-affix-wrapper config-input-password config-input-affix-wrapper-lg"
>
<input
action="click"
class="config-input config-input-lg"
type="password"
value=""
@ -16521,7 +16518,6 @@ exports[`ConfigProvider components Input configProvider componentSize middle 1`]
class="config-input-affix-wrapper config-input-password"
>
<input
action="click"
class="config-input"
type="password"
value=""
@ -16616,7 +16612,6 @@ exports[`ConfigProvider components Input configProvider virtual and dropdownMatc
class="ant-input-affix-wrapper ant-input-password"
>
<input
action="click"
class="ant-input"
type="password"
value=""
@ -16711,7 +16706,6 @@ exports[`ConfigProvider components Input normal 1`] = `
class="ant-input-affix-wrapper ant-input-password"
>
<input
action="click"
class="ant-input"
type="password"
value=""
@ -16806,7 +16800,6 @@ exports[`ConfigProvider components Input prefixCls 1`] = `
class="ant-input-affix-wrapper prefix-Input"
>
<input
action="click"
class="ant-input"
type="password"
value=""
@ -42614,9 +42607,7 @@ exports[`ConfigProvider components TreeSelect prefixCls 1`] = `
`;
exports[`ConfigProvider components Upload configProvider 1`] = `
<span
class=""
>
<span>
<div
class="config-upload config-upload-select config-upload-select-text"
>
@ -42716,9 +42707,7 @@ exports[`ConfigProvider components Upload configProvider 1`] = `
`;
exports[`ConfigProvider components Upload configProvider componentDisabled 1`] = `
<span
class=""
>
<span>
<div
class="config-upload config-upload-select config-upload-select-text config-upload-disabled"
>
@ -42790,9 +42779,7 @@ exports[`ConfigProvider components Upload configProvider componentDisabled 1`] =
`;
exports[`ConfigProvider components Upload configProvider componentSize large 1`] = `
<span
class=""
>
<span>
<div
class="config-upload config-upload-select config-upload-select-text"
>
@ -42892,9 +42879,7 @@ exports[`ConfigProvider components Upload configProvider componentSize large 1`]
`;
exports[`ConfigProvider components Upload configProvider componentSize middle 1`] = `
<span
class=""
>
<span>
<div
class="config-upload config-upload-select config-upload-select-text"
>
@ -42994,9 +42979,7 @@ exports[`ConfigProvider components Upload configProvider componentSize middle 1`
`;
exports[`ConfigProvider components Upload configProvider virtual and dropdownMatchSelectWidth 1`] = `
<span
class=""
>
<span>
<div
class="ant-upload ant-upload-select ant-upload-select-text"
>
@ -43096,9 +43079,7 @@ exports[`ConfigProvider components Upload configProvider virtual and dropdownMat
`;
exports[`ConfigProvider components Upload normal 1`] = `
<span
class=""
>
<span>
<div
class="ant-upload ant-upload-select ant-upload-select-text"
>
@ -43198,9 +43179,7 @@ exports[`ConfigProvider components Upload normal 1`] = `
`;
exports[`ConfigProvider components Upload prefixCls 1`] = `
<span
class=""
>
<span>
<div
class="prefix-Upload prefix-Upload-select prefix-Upload-select-text"
>

4
components/config-provider/__tests__/locale.test.tsx
View File

@ -12,8 +12,8 @@ import TimePicker from '../../time-picker';
import { act, render, fireEvent } from '../../../tests/utils';
describe('ConfigProvider.Locale', () => {
function $$(className: string): NodeListOf<Element> {
return document.body.querySelectorAll(className);
function $$(selector: string): NodeListOf<Element> {
return document.body.querySelectorAll(selector);
}
it('not throw', () => {

4
components/config-provider/__tests__/target.test.tsx
View File

@ -7,7 +7,7 @@ import { act, render } from '../../../tests/utils';
describe('ConfigProvider.getTargetContainer', () => {
it('Affix', () => {
jest.useFakeTimers();
const getTargetContainer = jest.fn(() => window as unknown as HTMLElement);
const getTargetContainer = jest.fn(() => window);
render(
<ConfigProvider getTargetContainer={getTargetContainer}>
<Affix>
@ -26,7 +26,7 @@ describe('ConfigProvider.getTargetContainer', () => {
it('Anchor', () => {
jest.useFakeTimers();
const getTargetContainer = jest.fn(() => window as unknown as HTMLElement);
const getTargetContainer = jest.fn(() => window);
render(
<ConfigProvider getTargetContainer={getTargetContainer}>
<Anchor>

8
components/config-provider/__tests__/theme.test.ts
View File

@ -47,13 +47,13 @@ describe('ConfigProvider.Theme', () => {
},
});
const styles: any[] = Array.from(document.querySelectorAll('style'));
const styles = Array.from(document.querySelectorAll('style'));
const themeStyle = styles.find(style =>
style.getAttribute('rc-util-key').includes('-dynamic-theme'),
style.getAttribute('rc-util-key')?.includes('-dynamic-theme'),
);
(Object.keys(infoColor) as Array<keyof typeof infoColor>).forEach(key => {
expect(themeStyle.innerHTML).toContain(
Object.keys(infoColor).forEach((key: keyof typeof infoColor) => {
expect(themeStyle?.innerHTML).toContain(
`--${prefixCls}-info-color-${kebabCase(key)}: ${infoColor[key]}`,
);
});

8
components/config-provider/context.tsx
View File

@ -65,12 +65,6 @@ export const ConfigContext = React.createContext<ConfigConsumerProps>({
export const ConfigConsumer = ConfigContext.Consumer;
// =========================== withConfigConsumer ===========================
// We need define many types here. So let's put in the block region
type IReactComponent<P = any> =
| React.FC<P>
| React.ComponentClass<P>
| React.ClassicComponentClass<P>;
interface BasicExportProps {
prefixCls?: string;
}
@ -86,7 +80,7 @@ interface ConstructorProps {
/** @deprecated Use hooks instead. This is a legacy function */
export function withConfigConsumer<ExportProps extends BasicExportProps>(config: ConsumerConfig) {
return function withConfigConsumerFunc<ComponentDef>(
Component: IReactComponent,
Component: React.ComponentType<ExportProps>,
): React.FC<ExportProps> & ComponentDef {
// Wrap with ConfigConsumer. Since we need compatible with react 15, be care when using ref methods
const SFC = ((props: ExportProps) => (

16
components/config-provider/index.tsx
View File

@ -57,7 +57,7 @@ const PASSED_PROPS: Exclude<keyof ConfigConsumerProps, 'rootPrefixCls' | 'getPre
];
export interface ConfigProviderProps {
getTargetContainer?: () => HTMLElement;
getTargetContainer?: () => HTMLElement | Window;
getPopupContainer?: (triggerNode?: HTMLElement) => HTMLElement;
prefixCls?: string;
iconPrefixCls?: string;
@ -198,7 +198,7 @@ const ProviderChildren: React.FC<ProviderChildrenProps> = props => {
// Pass the props used by `useContext` directly with child component.
// These props should merged into `config`.
PASSED_PROPS.forEach(propName => {
const propValue: any = props[propName];
const propValue = props[propName];
if (propValue) {
(config as any)[propName] = propValue;
}
@ -208,9 +208,9 @@ const ProviderChildren: React.FC<ProviderChildrenProps> = props => {
const memoedConfig = useMemo(
() => config,
config,
(prevConfig: Record<string, any>, currentConfig) => {
const prevKeys = Object.keys(prevConfig);
const currentKeys = Object.keys(currentConfig);
(prevConfig, currentConfig) => {
const prevKeys = Object.keys(prevConfig) as Array<keyof typeof config>;
const currentKeys = Object.keys(currentConfig) as Array<keyof typeof config>;
return (
prevKeys.length !== currentKeys.length ||
prevKeys.some(key => prevConfig[key] !== currentConfig[key])
@ -287,11 +287,7 @@ const ConfigProvider: React.FC<ConfigProviderProps> & {
{(_, __, legacyLocale) => (
<ConfigConsumer>
{context => (
<ProviderChildren
parentContext={context}
legacyLocale={legacyLocale as Locale}
{...props}
/>
<ProviderChildren parentContext={context} legacyLocale={legacyLocale} {...props} />
)}
</ConfigConsumer>
)}

955
components/date-picker/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

221
components/date-picker/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -6,7 +6,7 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker"
@ -50,7 +50,7 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker"
@ -94,7 +94,7 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker"
@ -138,7 +138,7 @@ exports[`renders ./components/date-picker/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker"
@ -232,7 +232,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-borderless"
@ -276,7 +276,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-borderless"
@ -320,7 +320,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-borderless"
@ -364,7 +364,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-borderless"
@ -408,7 +408,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range ant-picker-borderless"
@ -465,7 +465,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -494,7 +494,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range ant-picker-borderless"
@ -551,7 +551,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -580,7 +580,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range ant-picker-borderless"
@ -637,7 +637,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -722,7 +722,7 @@ exports[`renders ./components/date-picker/demo/bordered.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -758,7 +758,7 @@ exports[`renders ./components/date-picker/demo/date-render.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -858,7 +858,7 @@ exports[`renders ./components/date-picker/demo/date-render.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -894,7 +894,7 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-disabled"
@ -908,8 +908,8 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
placeholder="Select date"
readonly=""
size="12"
title="2015-06-06"
value="2015-06-06"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -939,7 +939,7 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-disabled"
@ -953,8 +953,8 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
placeholder="Select month"
readonly=""
size="12"
title="2015-06"
value="2015-06"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -984,7 +984,7 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range ant-picker-disabled"
@ -998,7 +998,7 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
placeholder="Start date"
readonly=""
size="12"
value="2015-06-06"
value=""
/>
</div>
<div
@ -1038,12 +1038,12 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
placeholder="End date"
readonly=""
size="12"
value="2015-06-06"
value=""
/>
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1084,7 +1084,7 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
placeholder="Start date"
readonly=""
size="12"
value="2019-09-03"
value=""
/>
</div>
<div
@ -1124,12 +1124,12 @@ exports[`renders ./components/date-picker/demo/disabled.md correctly 1`] = `
placeholder="End date"
readonly=""
size="12"
value="2019-11-22"
value=""
/>
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1188,7 +1188,7 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1232,7 +1232,7 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1276,7 +1276,7 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -1333,7 +1333,7 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1418,7 +1418,7 @@ exports[`renders ./components/date-picker/demo/disabled-date.md correctly 1`] =
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1454,7 +1454,7 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1498,7 +1498,7 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1542,7 +1542,7 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -1599,7 +1599,7 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1628,7 +1628,7 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -1685,7 +1685,7 @@ exports[`renders ./components/date-picker/demo/extra-footer.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1764,7 +1764,7 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1777,8 +1777,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="Select date"
readonly=""
size="12"
title="2015/01/01"
value="2015/01/01"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -1832,7 +1832,7 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1845,8 +1845,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="Select date"
readonly=""
size="12"
title="01/01/2015"
value="01/01/2015"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -1900,7 +1900,7 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1913,8 +1913,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="Select month"
readonly=""
size="12"
title="2015/01"
value="2015/01"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -1968,7 +1968,7 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -1981,8 +1981,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="Select week"
readonly=""
size="15"
title="11/20 ~ 11/26"
value="11/20 ~ 11/26"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -2036,7 +2036,7 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -2049,7 +2049,7 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="Start date"
readonly=""
size="12"
value="2015/01/01"
value=""
/>
</div>
<div
@ -2088,12 +2088,12 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="End date"
readonly=""
size="12"
value="2015/01/01"
value=""
/>
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2157,8 +2157,8 @@ exports[`renders ./components/date-picker/demo/format.md correctly 1`] = `
placeholder="Select date"
readonly=""
size="27"
title="custom format: 2015/01/01"
value="custom format: 2015/01/01"
title=""
value=""
/>
<span
class="ant-picker-suffix"
@ -2219,7 +2219,7 @@ exports[`renders ./components/date-picker/demo/mode.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -2319,7 +2319,7 @@ exports[`renders ./components/date-picker/demo/mode.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2530,7 +2530,7 @@ Array [
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2565,7 +2565,7 @@ exports[`renders ./components/date-picker/demo/presetted-ranges.md correctly 1`]
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -2622,7 +2622,7 @@ exports[`renders ./components/date-picker/demo/presetted-ranges.md correctly 1`]
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2707,7 +2707,7 @@ exports[`renders ./components/date-picker/demo/presetted-ranges.md correctly 1`]
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2743,7 +2743,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -2800,7 +2800,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2829,7 +2829,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -2886,7 +2886,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -2915,7 +2915,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -2972,7 +2972,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3001,7 +3001,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -3058,7 +3058,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3087,7 +3087,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -3144,7 +3144,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3229,7 +3229,7 @@ exports[`renders ./components/date-picker/demo/range-picker.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3315,7 +3315,7 @@ exports[`renders ./components/date-picker/demo/select-in-range.md correctly 1`]
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3349,7 +3349,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-radio-group ant-radio-group-outline"
@ -3416,7 +3416,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-middle"
@ -3460,7 +3460,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-middle"
@ -3504,7 +3504,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range ant-picker-middle"
@ -3561,7 +3561,7 @@ exports[`renders ./components/date-picker/demo/size.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3640,7 +3640,7 @@ exports[`renders ./components/date-picker/demo/start-end.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-picker"
@ -3731,15 +3731,15 @@ exports[`renders ./components/date-picker/demo/start-end.md correctly 1`] = `
exports[`renders ./components/date-picker/demo/status.md correctly 1`] = `
<div
class="ant-space ant-space-vertical"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker ant-picker-status-error"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-picker-input"
@ -3780,11 +3780,11 @@ exports[`renders ./components/date-picker/demo/status.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker ant-picker-status-warning"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-picker-input"
@ -3825,11 +3825,11 @@ exports[`renders ./components/date-picker/demo/status.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-picker ant-picker-range ant-picker-status-error"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-picker-input ant-picker-input-active"
@ -3883,7 +3883,7 @@ exports[`renders ./components/date-picker/demo/status.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -3915,7 +3915,7 @@ exports[`renders ./components/date-picker/demo/status.md correctly 1`] = `
>
<div
class="ant-picker ant-picker-range ant-picker-status-warning"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-picker-input ant-picker-input-active"
@ -3969,7 +3969,7 @@ exports[`renders ./components/date-picker/demo/status.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -4005,7 +4005,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -4049,7 +4049,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -4093,7 +4093,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -4150,7 +4150,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -4179,7 +4179,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -4223,7 +4223,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -4249,7 +4249,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -4275,7 +4275,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker ant-picker-range"
@ -4332,7 +4332,7 @@ exports[`renders ./components/date-picker/demo/suffix.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -4375,7 +4375,7 @@ exports[`renders ./components/date-picker/demo/switchable.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-select ant-select-single ant-select-show-arrow"
@ -4387,17 +4387,16 @@ exports[`renders ./components/date-picker/demo/switchable.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -4413,7 +4412,7 @@ exports[`renders ./components/date-picker/demo/switchable.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -4493,7 +4492,7 @@ exports[`renders ./components/date-picker/demo/time.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 12px;"
style="margin-bottom:12px"
>
<div
class="ant-picker"
@ -4593,7 +4592,7 @@ exports[`renders ./components/date-picker/demo/time.md correctly 1`] = `
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"

4
components/date-picker/generatePicker/generateRangePicker.tsx
View File

@ -7,7 +7,7 @@ import { RangePicker as RCRangePicker } from 'rc-picker';
import type { GenerateConfig } from 'rc-picker/lib/generate/index';
import * as React from 'react';
import { forwardRef, useContext, useImperativeHandle } from 'react';
import type { PickerLocale, RangePickerProps } from '.';
import type { RangePickerProps } from '.';
import { Components, getTimeProps } from '.';
import { ConfigContext } from '../../config-provider';
import DisabledContext from '../../config-provider/DisabledContext';
@ -96,7 +96,7 @@ export default function generateRangePicker<DateType>(
return (
<LocaleReceiver componentName="DatePicker" defaultLocale={enUS}>
{(contextLocale: PickerLocale) => {
{contextLocale => {
const locale = { ...contextLocale, ...props.locale };
return (

4
components/date-picker/generatePicker/generateSinglePicker.tsx
View File

@ -7,7 +7,7 @@ import type { GenerateConfig } from 'rc-picker/lib/generate/index';
import type { PickerMode } from 'rc-picker/lib/interface';
import * as React from 'react';
import { forwardRef, useContext, useImperativeHandle } from 'react';
import type { PickerDateProps, PickerLocale, PickerProps, PickerTimeProps } from '.';
import type { PickerDateProps, PickerProps, PickerTimeProps } from '.';
import { Components, getTimeProps } from '.';
import { ConfigContext } from '../../config-provider';
import DisabledContext from '../../config-provider/DisabledContext';
@ -114,7 +114,7 @@ export default function generatePicker<DateType>(generateConfig: GenerateConfig<
return (
<LocaleReceiver componentName="DatePicker" defaultLocale={enUS}>
{(contextLocale: PickerLocale) => {
{contextLocale => {
const locale = { ...contextLocale, ...props.locale };
return (

368
components/descriptions/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -40,10 +40,6 @@ exports[`renders ./components/descriptions/demo/basic.md extend context correctl
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -63,10 +59,6 @@ exports[`renders ./components/descriptions/demo/basic.md extend context correctl
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -109,13 +101,9 @@ exports[`renders ./components/descriptions/demo/basic.md extend context correctl
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
colspan="2"
>
<div
class="ant-descriptions-item-container"
@ -176,10 +164,6 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -196,10 +180,6 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -236,10 +216,6 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
2018-04-24 18:00:00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -250,7 +226,7 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="3"
>
<span>
2019-04-24 18:00:00
@ -270,7 +246,7 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
<span
@ -307,10 +283,6 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -327,10 +299,6 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -361,7 +329,7 @@ exports[`renders ./components/descriptions/demo/border.md extend context correct
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
Data disk type: MongoDB
@ -423,10 +391,6 @@ exports[`renders ./components/descriptions/demo/responsive.md extend context cor
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -443,10 +407,6 @@ exports[`renders ./components/descriptions/demo/responsive.md extend context cor
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -483,10 +443,6 @@ exports[`renders ./components/descriptions/demo/responsive.md extend context cor
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -503,10 +459,6 @@ exports[`renders ./components/descriptions/demo/responsive.md extend context cor
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -537,7 +489,7 @@ exports[`renders ./components/descriptions/demo/responsive.md extend context cor
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
Data disk type: MongoDB
@ -675,10 +627,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -695,10 +643,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -735,10 +679,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -755,10 +695,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -789,7 +725,7 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
Data disk type: MongoDB
@ -864,10 +800,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -887,10 +819,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -933,10 +861,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -956,10 +880,6 @@ exports[`renders ./components/descriptions/demo/size.md extend context correctly
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -1078,7 +998,7 @@ Array [
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red;"
style="background:red"
>
<span>
Product
@ -1087,16 +1007,12 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green;"
style="background:green"
>
<span>
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1113,10 +1029,6 @@ Array [
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1165,7 +1077,7 @@ Array [
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red;"
style="background:red"
>
<span>
Product
@ -1174,20 +1086,16 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green;"
style="background:green"
>
<span>
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red;"
style="background:red"
>
<span>
Billing Mode
@ -1196,20 +1104,16 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green;"
style="background:green"
>
<span>
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red; color: orange;"
style="background:red;color:orange"
>
<span>
Automatic Renewal
@ -1218,7 +1122,7 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green; color: blue;"
style="background:green;color:blue"
>
<span>
YES
@ -1283,7 +1187,7 @@ exports[`renders ./components/descriptions/demo/text.md extend context correctly
class="ant-descriptions-item-label"
>
<div
style="display: flex;"
style="display:flex"
>
Billing Mode
</div>
@ -1546,7 +1450,7 @@ exports[`renders ./components/descriptions/demo/text.md extend context correctly
class="ant-table-content"
>
<table
style="table-layout: auto;"
style="table-layout:auto"
>
<colgroup />
<thead
@ -1666,28 +1570,6 @@ exports[`renders ./components/descriptions/demo/vertical.md extend context corre
</span>
</div>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Zhou Maomao
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item"
colspan="1"
@ -1702,28 +1584,6 @@ exports[`renders ./components/descriptions/demo/vertical.md extend context corre
</span>
</div>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
1810000000
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item"
colspan="1"
@ -1742,6 +1602,34 @@ exports[`renders ./components/descriptions/demo/vertical.md extend context corre
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Zhou Maomao
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
1810000000
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
@ -1762,7 +1650,7 @@ exports[`renders ./components/descriptions/demo/vertical.md extend context corre
>
<th
class="ant-descriptions-item"
colspan="1"
colspan="2"
>
<div
class="ant-descriptions-item-container"
@ -1774,28 +1662,6 @@ exports[`renders ./components/descriptions/demo/vertical.md extend context corre
</span>
</div>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item"
colspan="1"
@ -1814,6 +1680,20 @@ exports[`renders ./components/descriptions/demo/vertical.md extend context corre
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
@ -1864,22 +1744,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
Product
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1888,22 +1752,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
Billing Mode
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1916,6 +1764,22 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Cloud Database
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Prepaid
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
@ -1936,25 +1800,9 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
Order time
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
2018-04-24 18:00:00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
colspan="2"
>
<span>
Usage Time
@ -1967,6 +1815,14 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
2018-04-24 18:00:00
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="2"
>
<span>
2019-04-24 18:00:00
@ -1978,7 +1834,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
>
<th
class="ant-descriptions-item-label"
colspan="1"
colspan="3"
>
<span>
Status
@ -1990,7 +1846,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="3"
>
<span>
<span
@ -2019,22 +1875,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
Negotiated Amount
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -2043,22 +1883,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
Discount
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -2071,6 +1895,22 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$80.00
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$20.00
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
@ -2085,7 +1925,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
>
<th
class="ant-descriptions-item-label"
colspan="1"
colspan="3"
>
<span>
Config Info
@ -2097,7 +1937,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md extend contex
>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="3"
>
<span>
Data disk type: MongoDB

368
components/descriptions/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -40,10 +40,6 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -63,10 +59,6 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -109,13 +101,9 @@ exports[`renders ./components/descriptions/demo/basic.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
colspan="2"
>
<div
class="ant-descriptions-item-container"
@ -176,10 +164,6 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -196,10 +180,6 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -236,10 +216,6 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
2018-04-24 18:00:00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -250,7 +226,7 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="3"
>
<span>
2019-04-24 18:00:00
@ -270,7 +246,7 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
<span
@ -307,10 +283,6 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -327,10 +299,6 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -361,7 +329,7 @@ exports[`renders ./components/descriptions/demo/border.md correctly 1`] = `
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
Data disk type: MongoDB
@ -423,10 +391,6 @@ exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -443,10 +407,6 @@ exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -483,10 +443,6 @@ exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -503,10 +459,6 @@ exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -537,7 +489,7 @@ exports[`renders ./components/descriptions/demo/responsive.md correctly 1`] = `
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
Data disk type: MongoDB
@ -675,10 +627,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -695,10 +643,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -735,10 +679,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -755,10 +695,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -789,7 +725,7 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
</th>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="5"
>
<span>
Data disk type: MongoDB
@ -864,10 +800,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -887,10 +819,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -933,10 +861,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -956,10 +880,6 @@ exports[`renders ./components/descriptions/demo/size.md correctly 1`] = `
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
@ -1078,7 +998,7 @@ Array [
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red;"
style="background:red"
>
<span>
Product
@ -1087,16 +1007,12 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green;"
style="background:green"
>
<span>
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1113,10 +1029,6 @@ Array [
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1165,7 +1077,7 @@ Array [
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red;"
style="background:red"
>
<span>
Product
@ -1174,20 +1086,16 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green;"
style="background:green"
>
<span>
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red;"
style="background:red"
>
<span>
Billing Mode
@ -1196,20 +1104,16 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green;"
style="background:green"
>
<span>
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
style="background: red; color: orange;"
style="background:red;color:orange"
>
<span>
Automatic Renewal
@ -1218,7 +1122,7 @@ Array [
<td
class="ant-descriptions-item-content"
colspan="1"
style="background: green; color: blue;"
style="background:green;color:blue"
>
<span>
YES
@ -1283,7 +1187,7 @@ exports[`renders ./components/descriptions/demo/text.md correctly 1`] = `
class="ant-descriptions-item-label"
>
<div
style="display: flex;"
style="display:flex"
>
Billing Mode
</div>
@ -1546,7 +1450,7 @@ exports[`renders ./components/descriptions/demo/text.md correctly 1`] = `
class="ant-table-content"
>
<table
style="table-layout: auto;"
style="table-layout:auto"
>
<colgroup />
<thead
@ -1666,28 +1570,6 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
</span>
</div>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Zhou Maomao
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item"
colspan="1"
@ -1702,28 +1584,6 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
</span>
</div>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
1810000000
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item"
colspan="1"
@ -1742,6 +1602,34 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
Zhou Maomao
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
1810000000
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
@ -1762,7 +1650,7 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
>
<th
class="ant-descriptions-item"
colspan="1"
colspan="2"
>
<div
class="ant-descriptions-item-container"
@ -1774,28 +1662,6 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
</span>
</div>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="1"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item"
colspan="1"
@ -1814,6 +1680,20 @@ exports[`renders ./components/descriptions/demo/vertical.md correctly 1`] = `
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item"
colspan="2"
>
<div
class="ant-descriptions-item-container"
>
<span
class="ant-descriptions-item-content"
>
No. 18, Wantang Road, Xihu District, Hangzhou, Zhejiang, China
</span>
</div>
</td>
<td
class="ant-descriptions-item"
colspan="1"
@ -1864,22 +1744,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
Product
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Cloud Database
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1888,22 +1752,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
Billing Mode
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Prepaid
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -1916,6 +1764,22 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Cloud Database
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
Prepaid
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
@ -1936,25 +1800,9 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
Order time
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
2018-04-24 18:00:00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
colspan="2"
>
<span>
Usage Time
@ -1967,6 +1815,14 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
2018-04-24 18:00:00
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="2"
>
<span>
2019-04-24 18:00:00
@ -1978,7 +1834,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
>
<th
class="ant-descriptions-item-label"
colspan="1"
colspan="3"
>
<span>
Status
@ -1990,7 +1846,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="3"
>
<span>
<span
@ -2019,22 +1875,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
Negotiated Amount
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$80.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -2043,22 +1883,6 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
Discount
</span>
</th>
</tr>
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$20.00
</span>
</td>
</tr>
<tr
class="ant-descriptions-row"
>
<th
class="ant-descriptions-item-label"
colspan="1"
@ -2071,6 +1895,22 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
<tr
class="ant-descriptions-row"
>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$80.00
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
>
<span>
$20.00
</span>
</td>
<td
class="ant-descriptions-item-content"
colspan="1"
@ -2085,7 +1925,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
>
<th
class="ant-descriptions-item-label"
colspan="1"
colspan="3"
>
<span>
Config Info
@ -2097,7 +1937,7 @@ exports[`renders ./components/descriptions/demo/vertical-border.md correctly 1`]
>
<td
class="ant-descriptions-item-content"
colspan="1"
colspan="3"
>
<span>
Data disk type: MongoDB

15
components/divider/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -5,17 +5,17 @@ Array [
<div
class="ant-divider ant-divider-horizontal"
role="separator"
style="border-width: 2px; border-color: #7cb305;"
style="border-width:2px;border-color:#7cb305"
/>,
<div
class="ant-divider ant-divider-horizontal ant-divider-dashed"
role="separator"
style="border-color: #7cb305;"
style="border-color:#7cb305"
/>,
<div
class="ant-divider ant-divider-horizontal ant-divider-with-text ant-divider-with-text-center ant-divider-dashed"
role="separator"
style="border-color: #7cb305;"
style="border-color:#7cb305"
>
<span
class="ant-divider-inner-text"
@ -26,12 +26,12 @@ Array [
<div
class="ant-divider ant-divider-vertical"
role="separator"
style="height: 60px; border-color: #7cb305;"
style="height:60px;border-color:#7cb305"
/>,
<div
class="ant-divider ant-divider-vertical ant-divider-dashed"
role="separator"
style="height: 60px; border-color: #7cb305;"
style="height:60px;border-color:#7cb305"
/>,
]
`;
@ -107,6 +107,7 @@ Array [
exports[`renders ./components/divider/demo/vertical.md extend context correctly 1`] = `
Array [
Text,
<div
class="ant-divider ant-divider-vertical"
role="separator"
@ -178,7 +179,7 @@ Array [
>
<span
class="ant-divider-inner-text"
style="margin-left: 0px;"
style="margin-left:0"
>
Left Text with 0 orientationMargin
</span>
@ -192,7 +193,7 @@ Array [
>
<span
class="ant-divider-inner-text"
style="margin-right: 50px;"
style="margin-right:50px"
>
Right Text with 50px orientationMargin
</span>

15
components/divider/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -5,17 +5,17 @@ Array [
<div
class="ant-divider ant-divider-horizontal"
role="separator"
style="border-width: 2px; border-color: #7cb305;"
style="border-width:2px;border-color:#7cb305"
/>,
<div
class="ant-divider ant-divider-horizontal ant-divider-dashed"
role="separator"
style="border-color: #7cb305;"
style="border-color:#7cb305"
/>,
<div
class="ant-divider ant-divider-horizontal ant-divider-with-text ant-divider-with-text-center ant-divider-dashed"
role="separator"
style="border-color: #7cb305;"
style="border-color:#7cb305"
>
<span
class="ant-divider-inner-text"
@ -26,12 +26,12 @@ Array [
<div
class="ant-divider ant-divider-vertical"
role="separator"
style="height: 60px; border-color: #7cb305;"
style="height:60px;border-color:#7cb305"
/>,
<div
class="ant-divider ant-divider-vertical ant-divider-dashed"
role="separator"
style="height: 60px; border-color: #7cb305;"
style="height:60px;border-color:#7cb305"
/>,
]
`;
@ -107,6 +107,7 @@ Array [
exports[`renders ./components/divider/demo/vertical.md correctly 1`] = `
Array [
Text,
<div
class="ant-divider ant-divider-vertical"
role="separator"
@ -178,7 +179,7 @@ Array [
>
<span
class="ant-divider-inner-text"
style="margin-left: 0px;"
style="margin-left:0"
>
Left Text with 0 orientationMargin
</span>
@ -192,7 +193,7 @@ Array [
>
<span
class="ant-divider-inner-text"
style="margin-right: 50px;"
style="margin-right:50px"
>
Right Text with 50px orientationMargin
</span>

256
components/drawer/__tests__/__snapshots__/demo-extend.test.tsx.snap
View File

@ -20,12 +20,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -92,7 +92,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -113,7 +113,7 @@ exports[`renders ./components/drawer/demo/config-provider.md extend context corr
</button>
<div
class="ant-drawer ant-drawer-right ant-drawer-open ant-drawer-inline"
style="position: absolute;"
style="position:absolute"
tabindex="-1"
>
<div
@ -122,12 +122,12 @@ exports[`renders ./components/drawer/demo/config-provider.md extend context corr
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -194,7 +194,7 @@ exports[`renders ./components/drawer/demo/config-provider.md extend context corr
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>
@ -208,7 +208,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-radio-group ant-radio-group-outline"
@ -315,12 +315,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 500px;"
style="width:500px"
>
<div
aria-modal="true"
@ -375,7 +375,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-default"
@ -420,7 +420,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -472,12 +472,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 720px;"
style="width:720px"
>
<div
aria-modal="true"
@ -532,7 +532,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-default"
@ -560,18 +560,18 @@ Array [
</div>
<div
class="ant-drawer-body"
style="padding-bottom: 80px;"
style="padding-bottom:80px"
>
<form
class="ant-form ant-form-vertical ant-form-hide-required-mark"
>
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-12"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -615,7 +615,7 @@ Array [
</div>
<div
class="ant-col ant-col-12"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -645,7 +645,7 @@ Array [
>
<span
class="ant-input-group-wrapper"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-wrapper ant-input-group"
@ -679,11 +679,11 @@ Array [
</div>
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-12"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -722,7 +722,7 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="owner_list_test"
aria-activedescendant="owner_list_0"
aria-autocomplete="list"
aria-controls="owner_list"
aria-haspopup="listbox"
@ -733,7 +733,7 @@ Array [
id="owner"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -747,19 +747,19 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown"
style="opacity:0"
>
<div>
<div
id="owner_list"
role="listbox"
style="height: 0px; width: 0px; overflow: hidden;"
style="height:0;width:0;overflow:hidden"
>
<div
aria-label="Xiaoxiao Fu"
aria-selected="false"
id="owner_list_test"
id="owner_list_0"
role="option"
>
xiao
@ -767,7 +767,7 @@ Array [
<div
aria-label="Maomao Zhou"
aria-selected="false"
id="owner_list_test"
id="owner_list_1"
role="option"
>
mao
@ -775,16 +775,16 @@ Array [
</div>
<div
class="rc-virtual-list"
style="position: relative;"
style="position:relative"
>
<div
class="rc-virtual-list-holder"
style="max-height: 256px; overflow-y: auto;"
style="max-height:256px;overflow-y:auto;overflow-anchor:none"
>
<div>
<div
class="rc-virtual-list-holder-inner"
style="display: flex; flex-direction: column;"
style="display:flex;flex-direction:column"
>
<div
aria-selected="false"
@ -799,7 +799,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -816,7 +816,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -830,7 +830,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -862,7 +862,7 @@ Array [
</div>
<div
class="ant-col ant-col-12"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -901,7 +901,7 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="type_list_test"
aria-activedescendant="type_list_0"
aria-autocomplete="list"
aria-controls="type_list"
aria-haspopup="listbox"
@ -912,7 +912,7 @@ Array [
id="type"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -926,19 +926,19 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown"
style="opacity:0"
>
<div>
<div
id="type_list"
role="listbox"
style="height: 0px; width: 0px; overflow: hidden;"
style="height:0;width:0;overflow:hidden"
>
<div
aria-label="Private"
aria-selected="false"
id="type_list_test"
id="type_list_0"
role="option"
>
private
@ -946,7 +946,7 @@ Array [
<div
aria-label="Public"
aria-selected="false"
id="type_list_test"
id="type_list_1"
role="option"
>
public
@ -954,16 +954,16 @@ Array [
</div>
<div
class="rc-virtual-list"
style="position: relative;"
style="position:relative"
>
<div
class="rc-virtual-list-holder"
style="max-height: 256px; overflow-y: auto;"
style="max-height:256px;overflow-y:auto;overflow-anchor:none"
>
<div>
<div
class="rc-virtual-list-holder-inner"
style="display: flex; flex-direction: column;"
style="display:flex;flex-direction:column"
>
<div
aria-selected="false"
@ -978,7 +978,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -995,7 +995,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -1009,7 +1009,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1042,11 +1042,11 @@ Array [
</div>
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-12"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -1085,7 +1085,7 @@ Array [
class="ant-select-selection-search"
>
<input
aria-activedescendant="approver_list_test"
aria-activedescendant="approver_list_0"
aria-autocomplete="list"
aria-controls="approver_list"
aria-haspopup="listbox"
@ -1096,7 +1096,7 @@ Array [
id="approver"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -1110,19 +1110,19 @@ Array [
</div>
<div>
<div
class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown"
style="opacity:0"
>
<div>
<div
id="approver_list"
role="listbox"
style="height: 0px; width: 0px; overflow: hidden;"
style="height:0;width:0;overflow:hidden"
>
<div
aria-label="Jack Ma"
aria-selected="false"
id="approver_list_test"
id="approver_list_0"
role="option"
>
jack
@ -1130,7 +1130,7 @@ Array [
<div
aria-label="Tom Liu"
aria-selected="false"
id="approver_list_test"
id="approver_list_1"
role="option"
>
tom
@ -1138,16 +1138,16 @@ Array [
</div>
<div
class="rc-virtual-list"
style="position: relative;"
style="position:relative"
>
<div
class="rc-virtual-list-holder"
style="max-height: 256px; overflow-y: auto;"
style="max-height:256px;overflow-y:auto;overflow-anchor:none"
>
<div>
<div
class="rc-virtual-list-holder-inner"
style="display: flex; flex-direction: column;"
style="display:flex;flex-direction:column"
>
<div
aria-selected="false"
@ -1162,7 +1162,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -1179,7 +1179,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -1193,7 +1193,7 @@ Array [
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1225,7 +1225,7 @@ Array [
</div>
<div
class="ant-col ant-col-12"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -1256,7 +1256,7 @@ Array [
<div
aria-required="true"
class="ant-picker ant-picker-range"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-picker-input ant-picker-input-active"
@ -1311,7 +1311,7 @@ Array [
</div>
<div
class="ant-picker-active-bar"
style="left: 0px; width: 0px; position: absolute;"
style="left:0;width:0;position:absolute"
/>
<span
class="ant-picker-suffix"
@ -1339,20 +1339,20 @@ Array [
</div>
<div>
<div
class="ant-picker-dropdown ant-picker-dropdown-range ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-picker-dropdown ant-picker-dropdown-range"
style="opacity:0"
>
<div
class="ant-picker-range-wrapper ant-picker-date-range-wrapper"
style="min-width: 0;"
style="min-width:0"
>
<div
class="ant-picker-range-arrow"
style="left: 0px;"
style="left:0"
/>
<div
class="ant-picker-panel-container"
style="margin-left: 0px;"
style="margin-left:0"
>
<div
class="ant-picker-panels"
@ -1405,7 +1405,7 @@ Array [
</div>
<button
class="ant-picker-header-next-btn"
style="visibility: hidden;"
style="visibility:hidden"
tabindex="-1"
type="button"
>
@ -1415,7 +1415,7 @@ Array [
</button>
<button
class="ant-picker-header-super-next-btn"
style="visibility: hidden;"
style="visibility:hidden"
tabindex="-1"
type="button"
>
@ -1905,7 +1905,7 @@ Array [
>
<button
class="ant-picker-header-super-prev-btn"
style="visibility: hidden;"
style="visibility:hidden"
tabindex="-1"
type="button"
>
@ -1915,7 +1915,7 @@ Array [
</button>
<button
class="ant-picker-header-prev-btn"
style="visibility: hidden;"
style="visibility:hidden"
tabindex="-1"
type="button"
>
@ -2434,9 +2434,6 @@ Array [
</div>
</div>
</div>
<div
style="position: absolute; top: 0px; left: 0px; width: 100%;"
/>
</div>
</div>
</div>
@ -2446,11 +2443,11 @@ Array [
</div>
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-24"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
class="ant-form-item"
@ -2500,7 +2497,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -2527,12 +2524,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 520px; transform: translateX(-180px);"
style="width:520px"
>
<div
aria-modal="true"
@ -2576,12 +2573,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 320px;"
style="width:320px"
>
<div
aria-modal="true"
@ -2615,7 +2612,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>
@ -2626,7 +2623,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -2650,12 +2647,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 333px; background: red; border-radius: 20px; box-shadow: -5px 0 5px green; overflow: hidden;"
style="width:333px;background:red;border-radius:20px;box-shadow:-5px 0 5px green;overflow:hidden"
>
<div
aria-modal="true"
@ -2722,7 +2719,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -2736,7 +2733,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-radio-group ant-radio-group-outline"
@ -2843,12 +2840,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -2890,7 +2887,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -2903,7 +2900,7 @@ exports[`renders ./components/drawer/demo/render-in-current.md extend context co
>
Render in this
<div
style="margin-top: 16px;"
style="margin-top:16px"
>
<button
class="ant-btn ant-btn-primary"
@ -2916,7 +2913,7 @@ exports[`renders ./components/drawer/demo/render-in-current.md extend context co
</div>
<div
class="ant-drawer ant-drawer-right ant-drawer-open ant-drawer-inline"
style="position: absolute;"
style="position:absolute"
tabindex="-1"
>
<div
@ -2925,12 +2922,12 @@ exports[`renders ./components/drawer/demo/render-in-current.md extend context co
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -2966,7 +2963,7 @@ exports[`renders ./components/drawer/demo/render-in-current.md extend context co
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>
@ -2975,14 +2972,14 @@ exports[`renders ./components/drawer/demo/render-in-current.md extend context co
exports[`renders ./components/drawer/demo/scroll-debug.md extend context correctly 1`] = `
<div
style="position: relative; z-index: 999999;"
style="position:relative;z-index:999999"
>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
aria-checked="false"
@ -3002,7 +2999,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
aria-checked="false"
@ -3022,7 +3019,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
aria-checked="false"
@ -3070,12 +3067,12 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px; transform: translateX(-180px);"
style="width:378px"
>
<div
aria-modal="true"
@ -3137,12 +3134,12 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -3201,7 +3198,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>
@ -3212,7 +3209,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>
@ -3226,12 +3223,12 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -3290,7 +3287,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md extend context correct
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>
@ -3304,7 +3301,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary"
@ -3338,12 +3335,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 378px;"
style="width:378px"
>
<div
aria-modal="true"
@ -3398,7 +3395,7 @@ Array [
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-default"
@ -3443,7 +3440,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,
@ -3570,12 +3567,12 @@ Array [
<div
aria-hidden="true"
data-sentinel="start"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
<div
class="ant-drawer-content-wrapper"
style="width: 640px;"
style="width:640px"
>
<div
aria-modal="true"
@ -3590,7 +3587,7 @@ Array [
>
<p
class="site-description-item-profile-p"
style="margin-bottom: 24px;"
style="margin-bottom:24px"
>
User Profile
</p>
@ -3612,6 +3609,7 @@ Array [
class="site-description-item-profile-p-label"
>
Full Name
<!-- -->
:
</p>
Lily
@ -3627,6 +3625,7 @@ Array [
class="site-description-item-profile-p-label"
>
Account
<!-- -->
:
</p>
AntDesign@example.com
@ -3646,6 +3645,7 @@ Array [
class="site-description-item-profile-p-label"
>
City
<!-- -->
:
</p>
HangZhou
@ -3661,6 +3661,7 @@ Array [
class="site-description-item-profile-p-label"
>
Country
<!-- -->
:
</p>
China🇨🇳
@ -3680,6 +3681,7 @@ Array [
class="site-description-item-profile-p-label"
>
Birthday
<!-- -->
:
</p>
February 2,1900
@ -3695,6 +3697,7 @@ Array [
class="site-description-item-profile-p-label"
>
Website
<!-- -->
:
</p>
-
@ -3714,6 +3717,7 @@ Array [
class="site-description-item-profile-p-label"
>
Message
<!-- -->
:
</p>
Make things as simple as possible but no simpler.
@ -3742,6 +3746,7 @@ Array [
class="site-description-item-profile-p-label"
>
Position
<!-- -->
:
</p>
Programmer
@ -3757,6 +3762,7 @@ Array [
class="site-description-item-profile-p-label"
>
Responsibilities
<!-- -->
:
</p>
Coding
@ -3776,6 +3782,7 @@ Array [
class="site-description-item-profile-p-label"
>
Department
<!-- -->
:
</p>
XTech
@ -3791,6 +3798,7 @@ Array [
class="site-description-item-profile-p-label"
>
Supervisor
<!-- -->
:
</p>
<a>
@ -3812,6 +3820,7 @@ Array [
class="site-description-item-profile-p-label"
>
Skills
<!-- -->
:
</p>
C / C + +, data structures, software engineering, operating systems, computer networks, databases, compiler theory, computer architecture, Microcomputer Principle and Interface Technology, Computer English, Java, ASP, etc.
@ -3840,6 +3849,7 @@ Array [
class="site-description-item-profile-p-label"
>
Email
<!-- -->
:
</p>
AntDesign@example.com
@ -3855,6 +3865,7 @@ Array [
class="site-description-item-profile-p-label"
>
Phone Number
<!-- -->
:
</p>
+86 181 0000 0000
@ -3874,6 +3885,7 @@ Array [
class="site-description-item-profile-p-label"
>
Github
<!-- -->
:
</p>
<a
@ -3891,7 +3903,7 @@ Array [
<div
aria-hidden="true"
data-sentinel="end"
style="width: 0px; height: 0px; overflow: hidden; outline: none; position: absolute;"
style="width:0;height:0;overflow:hidden;outline:none;position:absolute"
tabindex="0"
/>
</div>,

16
components/drawer/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -32,7 +32,7 @@ exports[`renders ./components/drawer/demo/extra.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-radio-group ant-radio-group-outline"
@ -195,7 +195,7 @@ exports[`renders ./components/drawer/demo/placement.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-radio-group ant-radio-group-outline"
@ -300,7 +300,7 @@ exports[`renders ./components/drawer/demo/render-in-current.md correctly 1`] = `
>
Render in this
<div
style="margin-top: 16px;"
style="margin-top:16px"
>
<button
class="ant-btn ant-btn-primary"
@ -316,14 +316,14 @@ exports[`renders ./components/drawer/demo/render-in-current.md correctly 1`] = `
exports[`renders ./components/drawer/demo/scroll-debug.md correctly 1`] = `
<div
style="position: relative; z-index: 999999;"
style="position:relative;z-index:999999"
>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
aria-checked="false"
@ -343,7 +343,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
aria-checked="false"
@ -363,7 +363,7 @@ exports[`renders ./components/drawer/demo/scroll-debug.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
aria-checked="false"
@ -410,7 +410,7 @@ exports[`renders ./components/drawer/demo/size.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<button
class="ant-btn ant-btn-primary"

1384
components/dropdown/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

64
components/dropdown/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -117,7 +117,7 @@ exports[`renders ./components/dropdown/demo/basic.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Hover me
</div>
@ -151,7 +151,7 @@ exports[`renders ./components/dropdown/demo/basic.md correctly 1`] = `
exports[`renders ./components/dropdown/demo/context-menu.md correctly 1`] = `
<div
class="ant-dropdown-trigger site-dropdown-context-menu"
style="text-align: center; height: 200px; line-height: 200px;"
style="text-align:center;height:200px;line-height:200px"
>
Right Click on here
</div>
@ -160,11 +160,11 @@ exports[`renders ./components/dropdown/demo/context-menu.md correctly 1`] = `
exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="flex-wrap: wrap; margin-bottom: -8px;"
style="flex-wrap:wrap;margin-bottom:-8px"
>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -205,7 +205,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -246,7 +246,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -289,7 +289,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -334,7 +334,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -345,7 +345,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Button
</div>
@ -377,7 +377,7 @@ exports[`renders ./components/dropdown/demo/dropdown-button.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="padding-bottom: 8px;"
style="padding-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -428,7 +428,7 @@ exports[`renders ./components/dropdown/demo/event.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Hover me, Click menu item
</div>
@ -468,7 +468,7 @@ exports[`renders ./components/dropdown/demo/item.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Hover me
</div>
@ -505,7 +505,7 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -516,11 +516,10 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -570,7 +569,7 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-btn-group ant-btn-group-sm ant-dropdown-button"
@ -581,11 +580,10 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
>
<span
class="ant-btn-loading-icon"
style="width: 0px; opacity: 0; transform: scale(0);"
>
<span
aria-label="loading"
class="anticon anticon-loading anticon-spin ant-btn-loading-icon-motion-appear ant-btn-loading-icon-motion-appear-start ant-btn-loading-icon-motion"
class="anticon anticon-loading anticon-spin"
role="img"
>
<svg
@ -635,7 +633,7 @@ exports[`renders ./components/dropdown/demo/loading.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-btn-group ant-dropdown-button"
@ -726,7 +724,7 @@ exports[`renders ./components/dropdown/demo/menu-full.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Hover to check menu style
</div>
@ -766,7 +764,7 @@ exports[`renders ./components/dropdown/demo/overlay-open.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Hover me
</div>
@ -803,15 +801,15 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="flex-wrap: wrap; margin-bottom: -8px;"
style="flex-wrap:wrap;margin-bottom:-8px"
>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -824,7 +822,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -837,7 +835,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="padding-bottom: 8px;"
style="padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -855,11 +853,11 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
>
<div
class="ant-space ant-space-horizontal ant-space-align-center"
style="flex-wrap: wrap; margin-bottom: -8px;"
style="flex-wrap:wrap;margin-bottom:-8px"
>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -872,7 +870,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px; padding-bottom: 8px;"
style="margin-right:8px;padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -885,7 +883,7 @@ exports[`renders ./components/dropdown/demo/placement.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="padding-bottom: 8px;"
style="padding-bottom:8px"
>
<button
class="ant-btn ant-btn-default ant-dropdown-trigger"
@ -910,7 +908,7 @@ exports[`renders ./components/dropdown/demo/selectable.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Selectable
</div>
@ -950,7 +948,7 @@ exports[`renders ./components/dropdown/demo/sub-menu.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Cascading menu
</div>
@ -990,7 +988,7 @@ exports[`renders ./components/dropdown/demo/trigger.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
Click me
</div>

10
components/dropdown/__tests__/dropdown-button.test.tsx
View File

@ -7,23 +7,25 @@ import type { DropdownProps } from '../dropdown';
import { render } from '../../../tests/utils';
let dropdownProps: DropdownProps;
jest.mock('../dropdown', () => {
const ActualDropdown = jest.requireActual('../dropdown');
const ActualDropdownComponent = ActualDropdown.default;
const h: typeof React = jest.requireActual('react');
const mockedDropdown = (props: DropdownProps) => {
const MockedDropdown: React.FC<DropdownProps> & {
Button: typeof ActualDropdownComponent.Button;
} = props => {
dropdownProps = props;
const { children, ...restProps } = props;
return h.createElement(ActualDropdownComponent, { ...restProps }, children);
};
mockedDropdown.defaultProps = ActualDropdownComponent.defaultProps;
mockedDropdown.Button = ActualDropdownComponent.Button;
MockedDropdown.Button = ActualDropdownComponent.Button;
return {
...ActualDropdown,
__esModule: true,
default: mockedDropdown,
default: MockedDropdown,
};
});

7
components/dropdown/dropdown-button.tsx
View File

@ -28,6 +28,7 @@ export interface DropdownButtonProps extends ButtonGroupProps, DropdownProps {
}
interface DropdownButtonInterface extends React.FC<DropdownButtonProps> {
/** @internal */
__ANT_BUTTON: boolean;
}
@ -70,7 +71,7 @@ const DropdownButton: DropdownButtonInterface = props => {
} = props;
const prefixCls = getPrefixCls('dropdown-button', customizePrefixCls);
const dropdownProps = {
const dropdownProps: DropdownProps = {
align,
overlay,
disabled,
@ -82,7 +83,7 @@ const DropdownButton: DropdownButtonInterface = props => {
overlayClassName,
overlayStyle,
destroyPopupOnHide,
} as DropdownProps;
};
if ('open' in props) {
dropdownProps.open = open;
@ -113,7 +114,7 @@ const DropdownButton: DropdownButtonInterface = props => {
const rightButton = <Button type={type} danger={danger} icon={icon} />;
const [leftButtonToRender, rightButtonToRender] = buttonsRender!([leftButton, rightButton]);
const [leftButtonToRender, rightButtonToRender] = buttonsRender([leftButton, rightButton]);
return (
<ButtonGroup {...restProps} className={classNames(prefixCls, className)}>

23
components/dropdown/dropdown.tsx
View File

@ -109,7 +109,7 @@ const Dropdown: DropdownInterface = props => {
if (transitionName !== undefined) {
return transitionName;
}
if (placement.indexOf('top') >= 0) {
if (placement.includes('top')) {
return `${rootPrefixCls}-slide-down`;
}
return `${rootPrefixCls}-slide-up`;
@ -118,7 +118,7 @@ const Dropdown: DropdownInterface = props => {
const getPlacement = () => {
const { placement } = props;
if (!placement) {
return direction === 'rtl' ? ('bottomRight' as Placement) : ('bottomLeft' as Placement);
return direction === 'rtl' ? 'bottomRight' : 'bottomLeft';
}
if (placement.includes('Center')) {
@ -146,6 +146,8 @@ const Dropdown: DropdownInterface = props => {
open,
onVisibleChange,
onOpenChange,
mouseEnterDelay = 0.15,
mouseLeaveDelay = 0.1,
} = props;
const prefixCls = getPrefixCls('dropdown', customizePrefixCls);
@ -163,8 +165,8 @@ const Dropdown: DropdownInterface = props => {
});
const triggerActions = disabled ? [] : trigger;
let alignPoint;
if (triggerActions && triggerActions.indexOf('contextMenu') !== -1) {
let alignPoint: boolean;
if (triggerActions && triggerActions.includes('contextMenu')) {
alignPoint = true;
}
@ -198,9 +200,9 @@ const Dropdown: DropdownInterface = props => {
// So we need render the element to check and pass back to rc-dropdown.
const { overlay } = props;
let overlayNode;
let overlayNode: React.ReactNode;
if (typeof overlay === 'function') {
overlayNode = (overlay as OverlayFunc)();
overlayNode = overlay();
} else {
overlayNode = overlay;
}
@ -236,8 +238,10 @@ const Dropdown: DropdownInterface = props => {
// ============================ Render ============================
return (
<RcDropdown
alignPoint={alignPoint}
alignPoint={alignPoint!}
{...props}
mouseEnterDelay={mouseEnterDelay}
mouseLeaveDelay={mouseLeaveDelay}
visible={mergedOpen}
builtinPlacements={builtinPlacements}
arrow={!!arrow}
@ -257,9 +261,4 @@ const Dropdown: DropdownInterface = props => {
Dropdown.Button = DropdownButton;
Dropdown.defaultProps = {
mouseEnterDelay: 0.15,
mouseLeaveDelay: 0.1,
};
export default Dropdown;

107
components/empty/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -104,7 +104,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</h4>
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -113,17 +113,16 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_-test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -135,13 +134,13 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<div>
<div
class="ant-select-dropdown ant-select-dropdown-empty ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown ant-select-dropdown-empty"
style="opacity:0"
>
<div>
<div
class="ant-select-item-empty"
id="rc_select_test_list"
id="undefined_list"
role="listbox"
>
<div
@ -197,7 +196,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -226,7 +225,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</h4>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -236,15 +235,14 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -256,8 +254,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<div>
<div
class="ant-select-dropdown ant-tree-select-dropdown ant-select-dropdown-empty ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown ant-tree-select-dropdown ant-select-dropdown-empty"
style="opacity:0"
>
<div>
<div
@ -317,7 +315,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -346,7 +344,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</h4>
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -356,12 +354,11 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -373,8 +370,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty"
style="opacity:0"
>
<div>
<div
@ -449,7 +446,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -494,7 +491,6 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
<input
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -522,8 +518,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</span>
<div>
<div
class="ant-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-dropdown"
style="opacity:0"
>
<ul
class="ant-dropdown-menu ant-dropdown-menu-root ant-dropdown-menu-vertical ant-dropdown-menu-light"
@ -533,7 +529,6 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-selectAll"
role="menuitem"
tabindex="-1"
>
@ -545,8 +540,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -567,7 +562,6 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-selectInvert"
role="menuitem"
tabindex="-1"
>
@ -579,8 +573,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -602,12 +596,12 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</ul>
<div
aria-hidden="true"
style="display: none;"
style="display:none"
>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -628,8 +622,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -655,6 +649,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
class="ant-transfer-list-header-selected"
>
0
<!-- -->
<!-- -->
item
</span>
<span
@ -785,7 +781,6 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
<input
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -813,8 +808,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</span>
<div>
<div
class="ant-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-dropdown"
style="opacity:0"
>
<ul
class="ant-dropdown-menu ant-dropdown-menu-root ant-dropdown-menu-vertical ant-dropdown-menu-light"
@ -824,7 +819,6 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-selectAll"
role="menuitem"
tabindex="-1"
>
@ -836,8 +830,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -858,7 +852,6 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<li
class="ant-dropdown-menu-item ant-dropdown-menu-item-only-child"
data-menu-id="rc-menu-uuid-test-selectInvert"
role="menuitem"
tabindex="-1"
>
@ -870,8 +863,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</li>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -893,12 +886,12 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</ul>
<div
aria-hidden="true"
style="display: none;"
style="display:none"
>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -919,8 +912,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</div>
<div>
<div
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip ant-zoom-big-fast-appear ant-zoom-big-fast-appear-prepare ant-zoom-big-fast"
style="opacity: 0;"
class="ant-tooltip ant-dropdown-menu-inline-collapsed-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -946,6 +939,8 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
class="ant-transfer-list-header-selected"
>
0
<!-- -->
<!-- -->
item
</span>
<span
@ -1013,7 +1008,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
</h4>
<div
class="ant-table-wrapper"
style="margin-top: 8px;"
style="margin-top:8px"
>
<div
class="ant-spin-nested-loading"
@ -1031,7 +1026,7 @@ exports[`renders ./components/empty/demo/config-provider.md extend context corre
class="ant-table-content"
>
<table
style="table-layout: auto;"
style="table-layout:auto"
>
<colgroup />
<thead
@ -1191,7 +1186,7 @@ exports[`renders ./components/empty/demo/customize.md extend context correctly 1
>
<div
class="ant-empty-image"
style="height: 60px;"
style="height:60px"
>
<img
alt="empty"

45
components/empty/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -104,7 +104,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
</h4>
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -113,17 +113,16 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -136,7 +135,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -165,7 +164,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
</h4>
<div
class="ant-select ant-tree-select ant-select-single ant-select-show-arrow"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -175,15 +174,14 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -196,7 +194,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -225,7 +223,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
</h4>
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow ant-select-show-search"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-select-selector"
@ -235,12 +233,11 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
role="combobox"
type="search"
value=""
@ -253,7 +250,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -298,7 +295,6 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
<input
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -328,6 +324,8 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
class="ant-transfer-list-header-selected"
>
0
<!-- -->
<!-- -->
item
</span>
<span
@ -458,7 +456,6 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
<input
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -488,6 +485,8 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
class="ant-transfer-list-header-selected"
>
0
<!-- -->
<!-- -->
item
</span>
<span
@ -555,7 +554,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
</h4>
<div
class="ant-table-wrapper"
style="margin-top: 8px;"
style="margin-top:8px"
>
<div
class="ant-spin-nested-loading"
@ -573,7 +572,7 @@ exports[`renders ./components/empty/demo/config-provider.md correctly 1`] = `
class="ant-table-content"
>
<table
style="table-layout: auto;"
style="table-layout:auto"
>
<colgroup />
<thead
@ -733,7 +732,7 @@ exports[`renders ./components/empty/demo/customize.md correctly 1`] = `
>
<div
class="ant-empty-image"
style="height: 60px;"
style="height:60px"
>
<img
alt="empty"

4
components/empty/index.tsx
View File

@ -41,9 +41,9 @@ const Empty: EmptyType = ({
return (
<LocaleReceiver componentName="Empty">
{(locale: TransferLocale) => {
{contextLocale => {
const prefixCls = getPrefixCls('empty', customizePrefixCls);
const des = typeof description !== 'undefined' ? description : locale.description;
const des = typeof description !== 'undefined' ? description : contextLocale.description;
const alt = typeof des === 'string' ? des : 'empty';
let imageNode: React.ReactNode = null;

2
components/form/FormItemInput.tsx
View File

@ -13,7 +13,7 @@ interface FormItemInputMiscProps {
warnings: React.ReactNode[];
marginBottom?: number | null;
onErrorVisibleChanged?: (visible: boolean) => void;
/** @private Internal Usage, do not use in any of your production. */
/** @internal do not use in any of your production. */
_internalItemRender?: {
mark: string;
render: (

1191
components/form/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

661
components/form/__tests__/__snapshots__/demo.test.ts.snap
View File

File diff suppressed because it is too large Load Diff

4
components/form/__tests__/__snapshots__/index.test.tsx.snap
View File

@ -919,9 +919,7 @@ exports[`Form form should support disabled 1`] = `
<div
class="ant-form-item-control-input-content"
>
<span
class=""
>
<span>
<div
class="ant-upload ant-upload-select ant-upload-select-text ant-upload-disabled"
style="display: none;"

2
components/form/hooks/useForm.ts
View File

@ -7,7 +7,7 @@ import { getFieldId, toArray } from '../util';
export interface FormInstance<Values = any> extends RcFormInstance<Values> {
scrollToField: (name: NamePath, options?: ScrollOptions) => void;
/** This is an internal usage. Do not use in your prod */
/** @internal: This is an internal usage. Do not use in your prod */
__INTERNAL__: {
/** No! Do not use this in your code! */
name?: string;

229
components/grid/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -525,13 +525,13 @@ Array [
>
<div
class="ant-col"
style="flex: 2 2 auto;"
style="flex:2 2 auto"
>
2 / 5
</div>
<div
class="ant-col"
style="flex: 3 3 auto;"
style="flex:3 3 auto"
>
3 / 5
</div>
@ -551,13 +551,13 @@ Array [
>
<div
class="ant-col"
style="flex: 0 0 100px;"
style="flex:0 0 100px"
>
100px
</div>
<div
class="ant-col"
style="flex-basis: auto;"
style="flex:auto"
>
Fill Rest
</div>
@ -577,13 +577,13 @@ Array [
>
<div
class="ant-col"
style="flex: 1 1 200px;"
style="flex:1 1 200px"
>
1 1 200px
</div>
<div
class="ant-col"
style="flex: 0 1 300px;"
style="flex:0 1 300px"
>
0 1 300px
</div>
@ -593,17 +593,17 @@ Array [
>
<div
class="ant-col"
style="flex: 0 0 auto; min-width: 0;"
style="flex:none;min-width:0"
>
<div
style="padding: 0px 16px;"
style="padding:0 16px"
>
none
</div>
</div>
<div
class="ant-col"
style="flex-basis: auto; min-width: 0;"
style="flex:auto;min-width:0"
>
auto with no-wrap
</div>
@ -625,44 +625,44 @@ Array [
</div>,
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
@ -680,44 +680,44 @@ Array [
</div>,
<div
class="ant-row"
style="margin-left: -4px; margin-right: -4px;"
style="margin-left:-16px;margin-right:-16px"
>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
@ -735,84 +735,84 @@ Array [
</div>,
<div
class="ant-row"
style="margin: -12px -8px -12px -8px;"
style="margin-left:-8px;margin-right:-8px;margin-top:-12px;margin-bottom:-12px"
>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
@ -869,7 +869,7 @@ Array [
Horizontal Gutter (px):
</span>,
<div
style="width: 50%;"
style="width:50%"
>
<div
class="ant-slider ant-slider-horizontal ant-slider-with-marks"
@ -879,34 +879,34 @@ Array [
/>
<div
class="ant-slider-track"
style="left: 0%; width: 20%;"
style="left:0%;width:20%"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
/>
</div>
<div
@ -916,13 +916,13 @@ Array [
aria-valuenow="1"
class="ant-slider-handle"
role="slider"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
tabindex="0"
/>
<div>
<div
class="ant-tooltip ant-slider-tooltip ant-zoom-down-appear ant-zoom-down-appear-prepare ant-zoom-down"
style="opacity: 0;"
class="ant-tooltip ant-slider-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -948,37 +948,37 @@ Array [
>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
>
8
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
>
16
</span>
<span
class="ant-slider-mark-text"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
>
24
</span>
<span
class="ant-slider-mark-text"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
>
32
</span>
<span
class="ant-slider-mark-text"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
>
40
</span>
<span
class="ant-slider-mark-text"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
>
48
</span>
@ -989,7 +989,7 @@ Array [
Vertical Gutter (px):
</span>,
<div
style="width: 50%;"
style="width:50%"
>
<div
class="ant-slider ant-slider-horizontal ant-slider-with-marks"
@ -999,34 +999,34 @@ Array [
/>
<div
class="ant-slider-track"
style="left: 0%; width: 20%;"
style="left:0%;width:20%"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
/>
</div>
<div
@ -1036,13 +1036,13 @@ Array [
aria-valuenow="1"
class="ant-slider-handle"
role="slider"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
tabindex="0"
/>
<div>
<div
class="ant-tooltip ant-slider-tooltip ant-zoom-down-appear ant-zoom-down-appear-prepare ant-zoom-down"
style="opacity: 0;"
class="ant-tooltip ant-slider-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1068,37 +1068,37 @@ Array [
>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
>
8
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
>
16
</span>
<span
class="ant-slider-mark-text"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
>
24
</span>
<span
class="ant-slider-mark-text"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
>
32
</span>
<span
class="ant-slider-mark-text"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
>
40
</span>
<span
class="ant-slider-mark-text"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
>
48
</span>
@ -1109,7 +1109,7 @@ Array [
Column Count:
</span>,
<div
style="width: 50%; margin-bottom: 48px;"
style="width:50%;margin-bottom:48px"
>
<div
class="ant-slider ant-slider-horizontal ant-slider-with-marks"
@ -1119,34 +1119,34 @@ Array [
/>
<div
class="ant-slider-track"
style="left: 0%; width: 40%;"
style="left:0%;width:40%"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
/>
</div>
<div
@ -1156,13 +1156,13 @@ Array [
aria-valuenow="2"
class="ant-slider-handle"
role="slider"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
tabindex="0"
/>
<div>
<div
class="ant-tooltip ant-slider-tooltip ant-zoom-down-appear ant-zoom-down-appear-prepare ant-zoom-down"
style="opacity: 0;"
class="ant-tooltip ant-slider-tooltip"
style="opacity:0"
>
<div
class="ant-tooltip-content"
@ -1188,37 +1188,37 @@ Array [
>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
>
2
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
>
3
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
>
4
</span>
<span
class="ant-slider-mark-text"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
>
6
</span>
<span
class="ant-slider-mark-text"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
>
8
</span>
<span
class="ant-slider-mark-text"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
>
12
</span>
@ -1227,11 +1227,11 @@ Array [
</div>,
<div
class="ant-row"
style="margin: -8px -8px -8px -8px;"
style="margin-left:-8px;margin-right:-8px;margin-top:-8px;margin-bottom:-8px"
>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1239,7 +1239,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1247,7 +1247,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1255,7 +1255,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1263,7 +1263,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1271,7 +1271,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1279,7 +1279,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1287,20 +1287,21 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
</div>
</div>
</div>,
Another Row:,
<div
class="ant-row"
style="margin: -8px -8px -8px -8px;"
style="margin-left:-8px;margin-right:-8px;margin-top:-8px;margin-bottom:-8px"
>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1308,7 +1309,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1316,7 +1317,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1324,7 +1325,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1420,9 +1421,9 @@ exports[`renders ./components/grid/demo/sort.md extend context correctly 1`] = `
`;
exports[`renders ./components/grid/demo/useBreakpoint.md extend context correctly 1`] = `
<span
class="ant-tag ant-tag-blue"
>
xs
</span>
Array [
Current break point:,
<!-- -->,
,
]
`;

217
components/grid/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -525,13 +525,13 @@ Array [
>
<div
class="ant-col"
style="flex: 2 2 auto;"
style="flex:2 2 auto"
>
2 / 5
</div>
<div
class="ant-col"
style="flex: 3 3 auto;"
style="flex:3 3 auto"
>
3 / 5
</div>
@ -551,13 +551,13 @@ Array [
>
<div
class="ant-col"
style="flex: 0 0 100px;"
style="flex:0 0 100px"
>
100px
</div>
<div
class="ant-col"
style="flex-basis: auto;"
style="flex:auto"
>
Fill Rest
</div>
@ -577,13 +577,13 @@ Array [
>
<div
class="ant-col"
style="flex: 1 1 200px;"
style="flex:1 1 200px"
>
1 1 200px
</div>
<div
class="ant-col"
style="flex: 0 1 300px;"
style="flex:0 1 300px"
>
0 1 300px
</div>
@ -593,17 +593,17 @@ Array [
>
<div
class="ant-col"
style="flex: 0 0 auto; min-width: 0;"
style="flex:none;min-width:0"
>
<div
style="padding: 0px 16px;"
style="padding:0 16px"
>
none
</div>
</div>
<div
class="ant-col"
style="flex-basis: auto; min-width: 0;"
style="flex:auto;min-width:0"
>
auto with no-wrap
</div>
@ -625,44 +625,44 @@ Array [
</div>,
<div
class="ant-row"
style="margin-left: -8px; margin-right: -8px;"
style="margin-left:-8px;margin-right:-8px"
>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 8px; padding-right: 8px;"
style="padding-left:8px;padding-right:8px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
@ -680,44 +680,44 @@ Array [
</div>,
<div
class="ant-row"
style="margin-left: -4px; margin-right: -4px;"
style="margin-left:-16px;margin-right:-16px"
>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding-left: 4px; padding-right: 4px;"
style="padding-left:16px;padding-right:16px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
@ -735,84 +735,84 @@ Array [
</div>,
<div
class="ant-row"
style="margin: -12px -8px -12px -8px;"
style="margin-left:-8px;margin-right:-8px;margin-top:-12px;margin-bottom:-12px"
>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
</div>
<div
class="ant-col ant-col-6 gutter-row"
style="padding: 12px 8px 12px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:12px;padding-bottom:12px"
>
<div
style="background: rgb(0, 146, 255); padding: 8px 0px;"
style="background:#0092ff;padding:8px 0"
>
col-6
</div>
@ -869,7 +869,7 @@ Array [
Horizontal Gutter (px):
</span>,
<div
style="width: 50%;"
style="width:50%"
>
<div
class="ant-slider ant-slider-horizontal ant-slider-with-marks"
@ -879,34 +879,34 @@ Array [
/>
<div
class="ant-slider-track"
style="left: 0%; width: 20%;"
style="left:0%;width:20%"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
/>
</div>
<div
@ -916,7 +916,7 @@ Array [
aria-valuenow="1"
class="ant-slider-handle"
role="slider"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
tabindex="0"
/>
<div
@ -924,37 +924,37 @@ Array [
>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
>
8
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
>
16
</span>
<span
class="ant-slider-mark-text"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
>
24
</span>
<span
class="ant-slider-mark-text"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
>
32
</span>
<span
class="ant-slider-mark-text"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
>
40
</span>
<span
class="ant-slider-mark-text"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
>
48
</span>
@ -965,7 +965,7 @@ Array [
Vertical Gutter (px):
</span>,
<div
style="width: 50%;"
style="width:50%"
>
<div
class="ant-slider ant-slider-horizontal ant-slider-with-marks"
@ -975,34 +975,34 @@ Array [
/>
<div
class="ant-slider-track"
style="left: 0%; width: 20%;"
style="left:0%;width:20%"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
/>
</div>
<div
@ -1012,7 +1012,7 @@ Array [
aria-valuenow="1"
class="ant-slider-handle"
role="slider"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
tabindex="0"
/>
<div
@ -1020,37 +1020,37 @@ Array [
>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
>
8
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
>
16
</span>
<span
class="ant-slider-mark-text"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
>
24
</span>
<span
class="ant-slider-mark-text"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
>
32
</span>
<span
class="ant-slider-mark-text"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
>
40
</span>
<span
class="ant-slider-mark-text"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
>
48
</span>
@ -1061,7 +1061,7 @@ Array [
Column Count:
</span>,
<div
style="width: 50%; margin-bottom: 48px;"
style="width:50%;margin-bottom:48px"
>
<div
class="ant-slider ant-slider-horizontal ant-slider-with-marks"
@ -1071,34 +1071,34 @@ Array [
/>
<div
class="ant-slider-track"
style="left: 0%; width: 40%;"
style="left:0%;width:40%"
/>
<div
class="ant-slider-step"
>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot ant-slider-dot-active"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
/>
<span
class="ant-slider-dot"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
/>
</div>
<div
@ -1108,7 +1108,7 @@ Array [
aria-valuenow="2"
class="ant-slider-handle"
role="slider"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
tabindex="0"
/>
<div
@ -1116,37 +1116,37 @@ Array [
>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 0%; transform: translateX(-50%);"
style="left:0%;transform:translateX(-50%)"
>
2
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 20%; transform: translateX(-50%);"
style="left:20%;transform:translateX(-50%)"
>
3
</span>
<span
class="ant-slider-mark-text ant-slider-mark-text-active"
style="left: 40%; transform: translateX(-50%);"
style="left:40%;transform:translateX(-50%)"
>
4
</span>
<span
class="ant-slider-mark-text"
style="left: 60%; transform: translateX(-50%);"
style="left:60%;transform:translateX(-50%)"
>
6
</span>
<span
class="ant-slider-mark-text"
style="left: 80%; transform: translateX(-50%);"
style="left:80%;transform:translateX(-50%)"
>
8
</span>
<span
class="ant-slider-mark-text"
style="left: 100%; transform: translateX(-50%);"
style="left:100%;transform:translateX(-50%)"
>
12
</span>
@ -1155,11 +1155,11 @@ Array [
</div>,
<div
class="ant-row"
style="margin: -8px -8px -8px -8px;"
style="margin-left:-8px;margin-right:-8px;margin-top:-8px;margin-bottom:-8px"
>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1167,7 +1167,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1175,7 +1175,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1183,7 +1183,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1191,7 +1191,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1199,7 +1199,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1207,7 +1207,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1215,20 +1215,21 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
</div>
</div>
</div>,
Another Row:,
<div
class="ant-row"
style="margin: -8px -8px -8px -8px;"
style="margin-left:-8px;margin-right:-8px;margin-top:-8px;margin-bottom:-8px"
>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1236,7 +1237,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1244,7 +1245,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1252,7 +1253,7 @@ Array [
</div>
<div
class="ant-col ant-col-6"
style="padding: 8px 8px 8px 8px;"
style="padding-left:8px;padding-right:8px;padding-top:8px;padding-bottom:8px"
>
<div>
Column
@ -1348,9 +1349,9 @@ exports[`renders ./components/grid/demo/sort.md correctly 1`] = `
`;
exports[`renders ./components/grid/demo/useBreakpoint.md correctly 1`] = `
<span
class="ant-tag ant-tag-blue"
>
xs
</span>
Array [
Current break point:,
<!-- -->,
,
]
`;

44
components/icon/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -6,7 +6,7 @@ exports[`renders ./components/icon/demo/basic.md extend context correctly 1`] =
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="home"
@ -30,7 +30,7 @@ exports[`renders ./components/icon/demo/basic.md extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="setting"
@ -54,7 +54,7 @@ exports[`renders ./components/icon/demo/basic.md extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="smile"
@ -78,7 +78,7 @@ exports[`renders ./components/icon/demo/basic.md extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="sync"
@ -102,7 +102,7 @@ exports[`renders ./components/icon/demo/basic.md extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="smile"
@ -115,7 +115,7 @@ exports[`renders ./components/icon/demo/basic.md extend context correctly 1`] =
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(180deg);"
style="-ms-transform:rotate(180deg);transform:rotate(180deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -157,12 +157,12 @@ exports[`renders ./components/icon/demo/custom.md extend context correctly 1`] =
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
role="img"
style="color: hotpink;"
style="color:hotpink"
>
<svg
fill="currentColor"
@ -178,12 +178,12 @@ exports[`renders ./components/icon/demo/custom.md extend context correctly 1`] =
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
role="img"
style="font-size: 32px;"
style="font-size:32px"
>
<svg
fill="currentColor"
@ -194,49 +194,41 @@ exports[`renders ./components/icon/demo/custom.md extend context correctly 1`] =
<path
d="M99.096 315.634s-82.58-64.032-82.58-132.13c0-66.064 33.032-165.162 148.646-148.646 83.37 11.91 99.096 165.162 99.096 165.162l-165.162 115.614zM924.906 315.634s82.58-64.032 82.58-132.13c0-66.064-33.032-165.162-148.646-148.646-83.37 11.91-99.096 165.162-99.096 165.162l165.162 115.614z"
fill="#6B676E"
p-id="1143"
/>
<path
d="M1024 561.548c0 264.526-229.23 429.42-512.002 429.42S0 826.076 0 561.548 283.96 66.064 512.002 66.064 1024 297.022 1024 561.548z"
fill="#FFEBD2"
p-id="1144"
/>
<path
d="M330.324 842.126c0 82.096 81.34 148.646 181.678 148.646s181.678-66.55 181.678-148.646H330.324z"
fill="#E9D7C3"
p-id="1145"
/>
<path
d="M644.13 611.098C594.582 528.516 561.55 512 512.002 512c-49.548 0-82.58 16.516-132.13 99.096-42.488 70.814-78.73 211.264-49.548 247.742 66.064 82.58 165.162 33.032 181.678 33.032 16.516 0 115.614 49.548 181.678-33.032 29.18-36.476-7.064-176.93-49.55-247.74z"
fill="#FFFFFF"
p-id="1146"
/>
<path
d="M611.098 495.484c0-45.608 36.974-82.58 82.58-82.58 49.548 0 198.194 99.098 198.194 165.162s-79.934 144.904-148.646 99.096c-49.548-33.032-132.128-148.646-132.128-181.678zM412.904 495.484c0-45.608-36.974-82.58-82.58-82.58-49.548 0-198.194 99.098-198.194 165.162s79.934 144.904 148.646 99.096c49.548-33.032 132.128-148.646 132.128-181.678z"
fill="#6B676E"
p-id="1147"
/>
<path
d="M512.002 726.622c-30.06 0-115.614 5.668-115.614 33.032 0 49.638 105.484 85.24 115.614 82.58 10.128 2.66 115.614-32.944 115.614-82.58-0.002-27.366-85.556-33.032-115.614-33.032z"
fill="#464655"
p-id="1148"
/>
<path
d="M330.324 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z"
fill="#464655"
p-id="1149"
/>
<path
d="M693.678 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z"
fill="#464655"
p-id="1150"
/>
</svg>
</span>
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -300,7 +292,7 @@ exports[`renders ./components/icon/demo/iconfont.md extend context correctly 1`]
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -322,7 +314,7 @@ exports[`renders ./components/icon/demo/iconfont.md extend context correctly 1`]
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -372,7 +364,7 @@ exports[`renders ./components/icon/demo/scriptUrl.md extend context correctly 1`
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -394,7 +386,7 @@ exports[`renders ./components/icon/demo/scriptUrl.md extend context correctly 1`
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -416,7 +408,7 @@ exports[`renders ./components/icon/demo/scriptUrl.md extend context correctly 1`
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -466,7 +458,7 @@ exports[`renders ./components/icon/demo/two-tone.md extend context correctly 1`]
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="smile"
@ -499,7 +491,7 @@ exports[`renders ./components/icon/demo/two-tone.md extend context correctly 1`]
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="heart"

44
components/icon/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -6,7 +6,7 @@ exports[`renders ./components/icon/demo/basic.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="home"
@ -30,7 +30,7 @@ exports[`renders ./components/icon/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="setting"
@ -54,7 +54,7 @@ exports[`renders ./components/icon/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="smile"
@ -78,7 +78,7 @@ exports[`renders ./components/icon/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="sync"
@ -102,7 +102,7 @@ exports[`renders ./components/icon/demo/basic.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="smile"
@ -115,7 +115,7 @@ exports[`renders ./components/icon/demo/basic.md correctly 1`] = `
fill="currentColor"
focusable="false"
height="1em"
style="transform: rotate(180deg);"
style="-ms-transform:rotate(180deg);transform:rotate(180deg)"
viewBox="64 64 896 896"
width="1em"
>
@ -157,12 +157,12 @@ exports[`renders ./components/icon/demo/custom.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
role="img"
style="color: hotpink;"
style="color:hotpink"
>
<svg
fill="currentColor"
@ -178,12 +178,12 @@ exports[`renders ./components/icon/demo/custom.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
role="img"
style="font-size: 32px;"
style="font-size:32px"
>
<svg
fill="currentColor"
@ -194,49 +194,41 @@ exports[`renders ./components/icon/demo/custom.md correctly 1`] = `
<path
d="M99.096 315.634s-82.58-64.032-82.58-132.13c0-66.064 33.032-165.162 148.646-148.646 83.37 11.91 99.096 165.162 99.096 165.162l-165.162 115.614zM924.906 315.634s82.58-64.032 82.58-132.13c0-66.064-33.032-165.162-148.646-148.646-83.37 11.91-99.096 165.162-99.096 165.162l165.162 115.614z"
fill="#6B676E"
p-id="1143"
/>
<path
d="M1024 561.548c0 264.526-229.23 429.42-512.002 429.42S0 826.076 0 561.548 283.96 66.064 512.002 66.064 1024 297.022 1024 561.548z"
fill="#FFEBD2"
p-id="1144"
/>
<path
d="M330.324 842.126c0 82.096 81.34 148.646 181.678 148.646s181.678-66.55 181.678-148.646H330.324z"
fill="#E9D7C3"
p-id="1145"
/>
<path
d="M644.13 611.098C594.582 528.516 561.55 512 512.002 512c-49.548 0-82.58 16.516-132.13 99.096-42.488 70.814-78.73 211.264-49.548 247.742 66.064 82.58 165.162 33.032 181.678 33.032 16.516 0 115.614 49.548 181.678-33.032 29.18-36.476-7.064-176.93-49.55-247.74z"
fill="#FFFFFF"
p-id="1146"
/>
<path
d="M611.098 495.484c0-45.608 36.974-82.58 82.58-82.58 49.548 0 198.194 99.098 198.194 165.162s-79.934 144.904-148.646 99.096c-49.548-33.032-132.128-148.646-132.128-181.678zM412.904 495.484c0-45.608-36.974-82.58-82.58-82.58-49.548 0-198.194 99.098-198.194 165.162s79.934 144.904 148.646 99.096c49.548-33.032 132.128-148.646 132.128-181.678z"
fill="#6B676E"
p-id="1147"
/>
<path
d="M512.002 726.622c-30.06 0-115.614 5.668-115.614 33.032 0 49.638 105.484 85.24 115.614 82.58 10.128 2.66 115.614-32.944 115.614-82.58-0.002-27.366-85.556-33.032-115.614-33.032z"
fill="#464655"
p-id="1148"
/>
<path
d="M330.324 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z"
fill="#464655"
p-id="1149"
/>
<path
d="M693.678 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z"
fill="#464655"
p-id="1150"
/>
</svg>
</span>
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -300,7 +292,7 @@ exports[`renders ./components/icon/demo/iconfont.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -322,7 +314,7 @@ exports[`renders ./components/icon/demo/iconfont.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -372,7 +364,7 @@ exports[`renders ./components/icon/demo/scriptUrl.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -394,7 +386,7 @@ exports[`renders ./components/icon/demo/scriptUrl.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -416,7 +408,7 @@ exports[`renders ./components/icon/demo/scriptUrl.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
class="anticon"
@ -466,7 +458,7 @@ exports[`renders ./components/icon/demo/two-tone.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="smile"
@ -499,7 +491,7 @@ exports[`renders ./components/icon/demo/two-tone.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<span
aria-label="heart"

8
components/icon/demo/custom.md
View File

@ -30,42 +30,34 @@ const PandaSvg = () => (
<path
d="M99.096 315.634s-82.58-64.032-82.58-132.13c0-66.064 33.032-165.162 148.646-148.646 83.37 11.91 99.096 165.162 99.096 165.162l-165.162 115.614zM924.906 315.634s82.58-64.032 82.58-132.13c0-66.064-33.032-165.162-148.646-148.646-83.37 11.91-99.096 165.162-99.096 165.162l165.162 115.614z"
fill="#6B676E"
p-id="1143"
/>
<path
d="M1024 561.548c0 264.526-229.23 429.42-512.002 429.42S0 826.076 0 561.548 283.96 66.064 512.002 66.064 1024 297.022 1024 561.548z"
fill="#FFEBD2"
p-id="1144"
/>
<path
d="M330.324 842.126c0 82.096 81.34 148.646 181.678 148.646s181.678-66.55 181.678-148.646H330.324z"
fill="#E9D7C3"
p-id="1145"
/>
<path
d="M644.13 611.098C594.582 528.516 561.55 512 512.002 512c-49.548 0-82.58 16.516-132.13 99.096-42.488 70.814-78.73 211.264-49.548 247.742 66.064 82.58 165.162 33.032 181.678 33.032 16.516 0 115.614 49.548 181.678-33.032 29.18-36.476-7.064-176.93-49.55-247.74z"
fill="#FFFFFF"
p-id="1146"
/>
<path
d="M611.098 495.484c0-45.608 36.974-82.58 82.58-82.58 49.548 0 198.194 99.098 198.194 165.162s-79.934 144.904-148.646 99.096c-49.548-33.032-132.128-148.646-132.128-181.678zM412.904 495.484c0-45.608-36.974-82.58-82.58-82.58-49.548 0-198.194 99.098-198.194 165.162s79.934 144.904 148.646 99.096c49.548-33.032 132.128-148.646 132.128-181.678z"
fill="#6B676E"
p-id="1147"
/>
<path
d="M512.002 726.622c-30.06 0-115.614 5.668-115.614 33.032 0 49.638 105.484 85.24 115.614 82.58 10.128 2.66 115.614-32.944 115.614-82.58-0.002-27.366-85.556-33.032-115.614-33.032z"
fill="#464655"
p-id="1148"
/>
<path
d="M330.324 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z"
fill="#464655"
p-id="1149"
/>
<path
d="M693.678 495.484m-33.032 0a33.032 33.032 0 1 0 66.064 0 33.032 33.032 0 1 0-66.064 0Z"
fill="#464655"
p-id="1150"
/>
</svg>
);

39
components/image/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -3,7 +3,7 @@
exports[`renders ./components/image/demo/basic.md extend context correctly 1`] = `
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -45,6 +45,7 @@ exports[`renders ./components/image/demo/controlled-preview.md extend context co
Array [
<div>
scaleStep:
<!-- -->
<div
class="ant-input-number"
>
@ -133,17 +134,17 @@ Array [
</button>,
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png?x-oss-process=image/blur,r_50,s_50/quality,q_1/resize,m_mfit,h_200,w_200"
style="display: none;"
style="display:none"
width="200"
/>
<div
class="ant-image-mask"
style="display: none;"
style="display:none"
>
<div
class="ant-image-mask-info"
@ -177,13 +178,13 @@ Array [
exports[`renders ./components/image/demo/fallback.md extend context correctly 1`] = `
<div
class="ant-image"
style="width: 200px; height: 200px;"
style="width:200px;height:200px"
>
<img
class="ant-image-img"
height="200"
src="error"
style="height: 200px;"
style="height:200px"
width="200"
/>
<div
@ -223,11 +224,11 @@ exports[`renders ./components/image/demo/placeholder.md extend context correctly
>
<div
class="ant-space-item"
style="margin-right: 12px;"
style="margin-right:12px"
>
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -240,7 +241,7 @@ exports[`renders ./components/image/demo/placeholder.md extend context correctly
>
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -298,7 +299,7 @@ exports[`renders ./components/image/demo/preview-group.md extend context correct
Array [
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -336,7 +337,7 @@ Array [
</div>,
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -379,7 +380,7 @@ exports[`renders ./components/image/demo/preview-group-top-progress.md extend co
Array [
<div
class="ant-image"
style="width: 150px;"
style="width:150px"
>
<img
class="ant-image-img"
@ -417,7 +418,7 @@ Array [
</div>,
<div
class="ant-image"
style="width: 150px;"
style="width:150px"
>
<img
class="ant-image-img"
@ -455,7 +456,7 @@ Array [
</div>,
<div
class="ant-image"
style="width: 150px;"
style="width:150px"
>
<img
class="ant-image-img"
@ -498,7 +499,7 @@ exports[`renders ./components/image/demo/preview-group-visible.md extend context
Array [
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -535,7 +536,7 @@ Array [
</div>
</div>,
<div
style="display: none;"
style="display:none"
>
<div
class="ant-image"
@ -652,7 +653,7 @@ Array [
exports[`renders ./components/image/demo/preview-mask.md extend context correctly 1`] = `
<div
class="ant-image"
style="width: 96px;"
style="width:96px"
>
<img
class="ant-image-img"
@ -667,7 +668,7 @@ exports[`renders ./components/image/demo/preview-mask.md extend context correctl
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<span
aria-label="zoom-in"
@ -702,7 +703,7 @@ exports[`renders ./components/image/demo/preview-mask.md extend context correctl
exports[`renders ./components/image/demo/previewSrc.md extend context correctly 1`] = `
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"

39
components/image/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -3,7 +3,7 @@
exports[`renders ./components/image/demo/basic.md correctly 1`] = `
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -45,6 +45,7 @@ exports[`renders ./components/image/demo/controlled-preview.md correctly 1`] = `
Array [
<div>
scaleStep:
<!-- -->
<div
class="ant-input-number"
>
@ -133,17 +134,17 @@ Array [
</button>,
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
src="https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png?x-oss-process=image/blur,r_50,s_50/quality,q_1/resize,m_mfit,h_200,w_200"
style="display: none;"
style="display:none"
width="200"
/>
<div
class="ant-image-mask"
style="display: none;"
style="display:none"
>
<div
class="ant-image-mask-info"
@ -177,13 +178,13 @@ Array [
exports[`renders ./components/image/demo/fallback.md correctly 1`] = `
<div
class="ant-image"
style="width: 200px; height: 200px;"
style="width:200px;height:200px"
>
<img
class="ant-image-img"
height="200"
src="error"
style="height: 200px;"
style="height:200px"
width="200"
/>
<div
@ -223,11 +224,11 @@ exports[`renders ./components/image/demo/placeholder.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 12px;"
style="margin-right:12px"
>
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -240,7 +241,7 @@ exports[`renders ./components/image/demo/placeholder.md correctly 1`] = `
>
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -298,7 +299,7 @@ exports[`renders ./components/image/demo/preview-group.md correctly 1`] = `
Array [
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -336,7 +337,7 @@ Array [
</div>,
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -379,7 +380,7 @@ exports[`renders ./components/image/demo/preview-group-top-progress.md correctly
Array [
<div
class="ant-image"
style="width: 150px;"
style="width:150px"
>
<img
class="ant-image-img"
@ -417,7 +418,7 @@ Array [
</div>,
<div
class="ant-image"
style="width: 150px;"
style="width:150px"
>
<img
class="ant-image-img"
@ -455,7 +456,7 @@ Array [
</div>,
<div
class="ant-image"
style="width: 150px;"
style="width:150px"
>
<img
class="ant-image-img"
@ -498,7 +499,7 @@ exports[`renders ./components/image/demo/preview-group-visible.md correctly 1`]
Array [
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"
@ -535,7 +536,7 @@ Array [
</div>
</div>,
<div
style="display: none;"
style="display:none"
>
<div
class="ant-image"
@ -652,7 +653,7 @@ Array [
exports[`renders ./components/image/demo/preview-mask.md correctly 1`] = `
<div
class="ant-image"
style="width: 96px;"
style="width:96px"
>
<img
class="ant-image-img"
@ -667,7 +668,7 @@ exports[`renders ./components/image/demo/preview-mask.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<span
aria-label="zoom-in"
@ -702,7 +703,7 @@ exports[`renders ./components/image/demo/preview-mask.md correctly 1`] = `
exports[`renders ./components/image/demo/previewSrc.md correctly 1`] = `
<div
class="ant-image"
style="width: 200px;"
style="width:200px"
>
<img
class="ant-image-img"

17
components/image/__tests__/index.test.tsx
View File

@ -87,4 +87,21 @@ describe('Image', () => {
fireEvent.click(container.querySelector('.ant-image')!);
expect(baseElement.querySelector('.container')?.children.length).not.toBe(0);
});
it('Preview forceRender props', async () => {
const onLoadCb = jest.fn();
const PreviewImage: React.FC = () => (
<Image
preview={{
visible: false,
src,
forceRender: true,
}}
/>
);
const { baseElement } = render(<PreviewImage />);
expect(baseElement.querySelector('.ant-image-preview-root')).not.toBe(null);
baseElement.querySelector('.ant-image-preview-img')?.addEventListener('load', onLoadCb);
fireEvent.load(baseElement.querySelector('.ant-image-preview-img')!);
expect(onLoadCb).toHaveBeenCalled();
});
});

1
components/image/index.zh-CN.md
View File

@ -41,6 +41,7 @@ cover: https://gw.alipayobjects.com/zos/antfincdn/D1dXz9PZqa/image.svg
current?: number; // v4.12.0 仅支持 PreviewGroup
countRender?: (current: number, total: number) => string // v4.20.0 仅支持 PreviewGroup
scaleStep?: number;
forceRender?: boolean;
}
```

132
components/input-number/__tests__/__snapshots__/demo-extend.test.ts.snap
View File

@ -6,7 +6,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-group-wrapper"
@ -103,7 +103,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-group-wrapper"
@ -116,7 +116,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
>
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="width: 60px;"
style="width:60px"
>
<div
class="ant-select-selector"
@ -125,17 +125,16 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -150,19 +149,19 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div>
<div
class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown"
style="opacity:0"
>
<div>
<div
id="rc_select_test_list"
id="undefined_list"
role="listbox"
style="height: 0px; width: 0px; overflow: hidden;"
style="height:0;width:0;overflow:hidden"
>
<div
aria-label="+"
aria-selected="true"
id="rc_select_test_list_test"
id="undefined_list_0"
role="option"
>
add
@ -170,7 +169,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<div
aria-label="-"
aria-selected="false"
id="rc_select_test_list_test"
id="undefined_list_1"
role="option"
>
minus
@ -178,16 +177,16 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div
class="rc-virtual-list"
style="position: relative;"
style="position:relative"
>
<div
class="rc-virtual-list-holder"
style="max-height: 256px; overflow-y: auto;"
style="max-height:256px;overflow-y:auto;overflow-anchor:none"
>
<div>
<div
class="rc-virtual-list-holder-inner"
style="display: flex; flex-direction: column;"
style="display:flex;flex-direction:column"
>
<div
aria-selected="true"
@ -202,7 +201,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -219,7 +218,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -233,7 +232,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -337,7 +336,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
>
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="width: 60px;"
style="width:60px"
>
<div
class="ant-select-selector"
@ -346,17 +345,16 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -371,19 +369,19 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div>
<div
class="ant-select-dropdown ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown"
style="opacity:0"
>
<div>
<div
id="rc_select_test_list"
id="undefined_list"
role="listbox"
style="height: 0px; width: 0px; overflow: hidden;"
style="height:0;width:0;overflow:hidden"
>
<div
aria-label="$"
aria-selected="true"
id="rc_select_test_list_test"
id="undefined_list_0"
role="option"
>
USD
@ -391,7 +389,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<div
aria-label="€"
aria-selected="false"
id="rc_select_test_list_test"
id="undefined_list_1"
role="option"
>
EUR
@ -399,16 +397,16 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div
class="rc-virtual-list"
style="position: relative;"
style="position:relative"
>
<div
class="rc-virtual-list-holder"
style="max-height: 256px; overflow-y: auto;"
style="max-height:256px;overflow-y:auto;overflow-anchor:none"
>
<div>
<div
class="rc-virtual-list-holder-inner"
style="display: flex; flex-direction: column;"
style="display:flex;flex-direction:column"
>
<div
aria-selected="true"
@ -423,7 +421,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -440,7 +438,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -457,7 +455,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -474,7 +472,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-item-option-state"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
/>
</div>
@ -488,7 +486,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -518,7 +516,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-group-wrapper"
@ -640,7 +638,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
>
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow"
style="width: 150px;"
style="width:150px"
>
<div
class="ant-select-selector"
@ -650,15 +648,14 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -672,8 +669,8 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
</div>
<div>
<div
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty ant-slide-up-appear ant-slide-up-appear-prepare ant-slide-up"
style="opacity: 0;"
class="ant-select-dropdown ant-cascader-dropdown ant-select-dropdown-empty"
style="opacity:0"
>
<div>
<div
@ -748,7 +745,7 @@ exports[`renders ./components/input-number/demo/addon.md extend context correctl
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -1098,7 +1095,7 @@ exports[`renders ./components/input-number/demo/controls.md extend context corre
exports[`renders ./components/input-number/demo/digit.md extend context correctly 1`] = `
<div
class="ant-input-number"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-input-number-handler-wrap"
@ -1255,7 +1252,7 @@ Array [
</div>
</div>,
<div
style="margin-top: 20px;"
style="margin-top:20px"
>
<button
class="ant-btn ant-btn-primary"
@ -1275,7 +1272,7 @@ exports[`renders ./components/input-number/demo/formatter.md extend context corr
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number"
@ -1441,7 +1438,7 @@ exports[`renders ./components/input-number/demo/keyboard.md extend context corre
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number"
@ -1533,7 +1530,6 @@ exports[`renders ./components/input-number/demo/keyboard.md extend context corre
checked=""
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -1553,7 +1549,7 @@ exports[`renders ./components/input-number/demo/out-of-range.md extend context c
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number ant-input-number-out-of-range"
@ -1651,7 +1647,7 @@ exports[`renders ./components/input-number/demo/prefix.md extend context correct
Array [
<div
class="ant-input-number-affix-wrapper"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"
@ -1736,7 +1732,7 @@ Array [
<br />,
<div
class="ant-input-number-group-wrapper"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-input-number-wrapper ant-input-number-group"
@ -1852,7 +1848,7 @@ Array [
<br />,
<div
class="ant-input-number-affix-wrapper ant-input-number-affix-wrapper-disabled"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"
@ -1943,7 +1939,7 @@ exports[`renders ./components/input-number/demo/size.md extend context correctly
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number ant-input-number-lg"
@ -2024,7 +2020,7 @@ exports[`renders ./components/input-number/demo/size.md extend context correctly
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number"
@ -2189,15 +2185,15 @@ exports[`renders ./components/input-number/demo/size.md extend context correctly
exports[`renders ./components/input-number/demo/status.md extend context correctly 1`] = `
<div
class="ant-space ant-space-vertical"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number ant-input-number-status-error"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-input-number-handler-wrap"
@ -2272,11 +2268,11 @@ exports[`renders ./components/input-number/demo/status.md extend context correct
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number ant-input-number-status-warning"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-input-number-handler-wrap"
@ -2351,11 +2347,11 @@ exports[`renders ./components/input-number/demo/status.md extend context correct
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-affix-wrapper ant-input-number-affix-wrapper-status-error"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"
@ -2463,7 +2459,7 @@ exports[`renders ./components/input-number/demo/status.md extend context correct
>
<div
class="ant-input-number-affix-wrapper ant-input-number-affix-wrapper-status-warning"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"

80
components/input-number/__tests__/__snapshots__/demo.test.ts.snap
View File

@ -6,7 +6,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-group-wrapper"
@ -103,7 +103,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-group-wrapper"
@ -116,7 +116,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
>
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="width: 60px;"
style="width:60px"
>
<div
class="ant-select-selector"
@ -125,17 +125,16 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -151,7 +150,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -255,7 +254,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
>
<div
class="ant-select ant-select-single ant-select-show-arrow"
style="width: 60px;"
style="width:60px"
>
<div
class="ant-select-selector"
@ -264,17 +263,16 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
class="ant-select-selection-search"
>
<input
aria-activedescendant="rc_select_test_list_test"
aria-activedescendant="undefined_list_0"
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -290,7 +288,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -320,7 +318,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-group-wrapper"
@ -442,7 +440,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
>
<div
class="ant-select ant-cascader ant-select-single ant-select-allow-clear ant-select-show-arrow"
style="width: 150px;"
style="width:150px"
>
<div
class="ant-select-selector"
@ -452,15 +450,14 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
>
<input
aria-autocomplete="list"
aria-controls="rc_select_test_list"
aria-controls="undefined_list"
aria-haspopup="listbox"
aria-owns="rc_select_test_list"
aria-owns="undefined_list"
autocomplete="off"
class="ant-select-selection-search-input"
id="rc_select_test"
readonly=""
role="combobox"
style="opacity: 0;"
style="opacity:0"
type="search"
unselectable="on"
value=""
@ -475,7 +472,7 @@ exports[`renders ./components/input-number/demo/addon.md correctly 1`] = `
<span
aria-hidden="true"
class="ant-select-arrow"
style="user-select: none;"
style="user-select:none;-webkit-user-select:none"
unselectable="on"
>
<span
@ -825,7 +822,7 @@ exports[`renders ./components/input-number/demo/controls.md correctly 1`] = `
exports[`renders ./components/input-number/demo/digit.md correctly 1`] = `
<div
class="ant-input-number"
style="width: 200px;"
style="width:200px"
>
<div
class="ant-input-number-handler-wrap"
@ -982,7 +979,7 @@ Array [
</div>
</div>,
<div
style="margin-top: 20px;"
style="margin-top:20px"
>
<button
class="ant-btn ant-btn-primary"
@ -1002,7 +999,7 @@ exports[`renders ./components/input-number/demo/formatter.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number"
@ -1168,7 +1165,7 @@ exports[`renders ./components/input-number/demo/keyboard.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number"
@ -1260,7 +1257,6 @@ exports[`renders ./components/input-number/demo/keyboard.md correctly 1`] = `
checked=""
class="ant-checkbox-input"
type="checkbox"
value=""
/>
<span
class="ant-checkbox-inner"
@ -1280,7 +1276,7 @@ exports[`renders ./components/input-number/demo/out-of-range.md correctly 1`] =
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number ant-input-number-out-of-range"
@ -1378,7 +1374,7 @@ exports[`renders ./components/input-number/demo/prefix.md correctly 1`] = `
Array [
<div
class="ant-input-number-affix-wrapper"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"
@ -1463,7 +1459,7 @@ Array [
<br />,
<div
class="ant-input-number-group-wrapper"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-input-number-wrapper ant-input-number-group"
@ -1579,7 +1575,7 @@ Array [
<br />,
<div
class="ant-input-number-affix-wrapper ant-input-number-affix-wrapper-disabled"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"
@ -1670,7 +1666,7 @@ exports[`renders ./components/input-number/demo/size.md correctly 1`] = `
>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number ant-input-number-lg"
@ -1751,7 +1747,7 @@ exports[`renders ./components/input-number/demo/size.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-right: 8px;"
style="margin-right:8px"
>
<div
class="ant-input-number"
@ -1916,15 +1912,15 @@ exports[`renders ./components/input-number/demo/size.md correctly 1`] = `
exports[`renders ./components/input-number/demo/status.md correctly 1`] = `
<div
class="ant-space ant-space-vertical"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number ant-input-number-status-error"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-input-number-handler-wrap"
@ -1999,11 +1995,11 @@ exports[`renders ./components/input-number/demo/status.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number ant-input-number-status-warning"
style="width: 100%;"
style="width:100%"
>
<div
class="ant-input-number-handler-wrap"
@ -2078,11 +2074,11 @@ exports[`renders ./components/input-number/demo/status.md correctly 1`] = `
</div>
<div
class="ant-space-item"
style="margin-bottom: 8px;"
style="margin-bottom:8px"
>
<div
class="ant-input-number-affix-wrapper ant-input-number-affix-wrapper-status-error"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"
@ -2190,7 +2186,7 @@ exports[`renders ./components/input-number/demo/status.md correctly 1`] = `
>
<div
class="ant-input-number-affix-wrapper ant-input-number-affix-wrapper-status-warning"
style="width: 100%;"
style="width:100%"
>
<span
class="ant-input-number-prefix"

4
components/input/Group.tsx
View File

@ -2,6 +2,7 @@ import classNames from 'classnames';
import * as React from 'react';
import { useContext, useMemo } from 'react';
import { ConfigContext } from '../config-provider';
import type { FormItemStatusContextProps } from '../form/context';
import { FormItemInputContext } from '../form/context';
export interface GroupProps {
@ -33,7 +34,8 @@ const Group: React.FC<GroupProps> = props => {
);
const formItemContext = useContext(FormItemInputContext);
const groupFormItemContext = useMemo(
const groupFormItemContext = useMemo<FormItemStatusContextProps>(
() => ({
...formItemContext,
isFormItemInput: false,

17
components/input/Input.tsx
View File

@ -2,6 +2,7 @@ import CloseCircleFilled from '@ant-design/icons/CloseCircleFilled';
import classNames from 'classnames';
import type { InputProps as RcInputProps, InputRef } from 'rc-input';
import RcInput from 'rc-input';
import type { BaseInputProps } from 'rc-input/lib/interface';
import { composeRef } from 'rc-util/lib/ref';
import React, { forwardRef, useContext, useEffect, useRef } from 'react';
import { ConfigContext } from '../config-provider';
@ -85,7 +86,9 @@ export function triggerFocus(
element?: HTMLInputElement | HTMLTextAreaElement,
option?: InputFocusOptions,
) {
if (!element) return;
if (!element) {
return;
}
element.focus(option);
@ -98,13 +101,12 @@ export function triggerFocus(
case 'start':
element.setSelectionRange(0, 0);
break;
case 'end':
element.setSelectionRange(len, len);
break;
default:
element.setSelectionRange(0, len);
break;
}
}
}
@ -134,6 +136,7 @@ const Input = forwardRef<InputRef, InputProps>((props, ref) => {
allowClear,
addonAfter,
addonBefore,
onChange,
...rest
} = props;
const { getPrefixCls, direction, input } = React.useContext(ConfigContext);
@ -198,6 +201,11 @@ const Input = forwardRef<InputRef, InputProps>((props, ref) => {
onFocus?.(e);
};
const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
removePasswordTimeout();
onChange?.(e);
};
const suffixNode = (hasFeedback || suffix) && (
<>
{suffix}
@ -206,7 +214,7 @@ const Input = forwardRef<InputRef, InputProps>((props, ref) => {
);
// Allow clear
let mergedAllowClear;
let mergedAllowClear: BaseInputProps['allowClear'];
if (typeof allowClear === 'object' && allowClear?.clearIcon) {
mergedAllowClear = allowClear;
} else if (allowClear) {
@ -224,6 +232,7 @@ const Input = forwardRef<InputRef, InputProps>((props, ref) => {
onFocus={handleFocus}
suffix={suffixNode}
allowClear={mergedAllowClear}
onChange={handleChange}
addonAfter={
addonAfter && (
<NoFormStyle override status>

19
components/input/Password.tsx
View File

@ -3,13 +3,15 @@ import EyeOutlined from '@ant-design/icons/EyeOutlined';
import classNames from 'classnames';
import omit from 'rc-util/lib/omit';
import * as React from 'react';
import { useState } from 'react';
import type { ConfigConsumerProps } from '../config-provider';
import { ConfigConsumer } from '../config-provider';
import type { InputProps, InputRef } from './Input';
import Input from './Input';
const defaultIconRender = (visible: boolean) =>
visible ? <EyeOutlined /> : <EyeInvisibleOutlined />;
export interface PasswordProps extends InputProps {
readonly inputPrefixCls?: string;
readonly action?: string;
@ -30,13 +32,12 @@ const Password = React.forwardRef<InputRef, PasswordProps>((props, ref) => {
if (disabled) {
return;
}
setVisible(!visible);
setVisible(prevState => !prevState);
};
const getIcon = (prefixCls: string) => {
const { action, iconRender = () => null } = props;
const iconTrigger = ActionMap[action!] || '';
const { action = 'click', iconRender = defaultIconRender } = props;
const iconTrigger = ActionMap[action] || '';
const icon = iconRender(visible);
const iconProps = {
[iconTrigger]: onVisibleChange,
@ -62,7 +63,7 @@ const Password = React.forwardRef<InputRef, PasswordProps>((props, ref) => {
prefixCls: customizePrefixCls,
inputPrefixCls: customizeInputPrefixCls,
size,
visibilityToggle,
visibilityToggle = true,
...restProps
} = props;
@ -92,12 +93,6 @@ const Password = React.forwardRef<InputRef, PasswordProps>((props, ref) => {
return <ConfigConsumer>{renderPassword}</ConfigConsumer>;
});
Password.defaultProps = {
action: 'click',
visibilityToggle: true,
iconRender: (visible: boolean) => (visible ? <EyeOutlined /> : <EyeInvisibleOutlined />),
};
if (process.env.NODE_ENV !== 'production') {
Password.displayName = 'Password';
}

6
components/input/TextArea.tsx
View File

@ -1,7 +1,7 @@
import classNames from 'classnames';
import type { TextAreaProps as RcTextAreaProps } from 'rc-textarea';
import RcTextArea from 'rc-textarea';
import type ResizableTextArea from 'rc-textarea/lib/ResizableTextArea';
import type { ResizableTextAreaRef } from 'rc-textarea/lib/ResizableTextArea';
import useMergedState from 'rc-util/lib/hooks/useMergedState';
import omit from 'rc-util/lib/omit';
import * as React from 'react';
@ -56,7 +56,7 @@ export interface TextAreaProps extends RcTextAreaProps {
export interface TextAreaRef {
focus: (options?: InputFocusOptions) => void;
blur: () => void;
resizableTextArea?: ResizableTextArea;
resizableTextArea?: ResizableTextAreaRef;
}
const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
@ -193,7 +193,7 @@ const TextArea = React.forwardRef<TextAreaRef, TextAreaProps>(
},
getStatusClassNames(prefixCls, mergedStatus),
)}
style={showCount ? undefined : style}
style={showCount ? { resize: style?.resize } : style}
prefixCls={prefixCls}
onCompositionStart={onInternalCompositionStart}
onChange={handleChange}

4
components/input/__tests__/Password.test.tsx
View File

@ -71,10 +71,12 @@ describe('Input.Password', () => {
// https://github.com/ant-design/ant-design/issues/20541
it('should not show value attribute in input element', async () => {
jest.useFakeTimers();
const { container } = render(<Input.Password />);
fireEvent.change(container.querySelector('input')!, { target: { value: 'value' } });
await sleep();
jest.runAllTimers();
expect(container.querySelector('input')?.getAttribute('value')).toBeFalsy();
jest.useRealTimers();
});
// https://github.com/ant-design/ant-design/issues/24526

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