From c373710ce2f50b704aff88ed7a3509b562af857f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=BA=8C=E8=B4=A7=E6=9C=BA=E5=99=A8=E4=BA=BA?= Date: Mon, 26 Oct 2020 10:56:09 +0800 Subject: [PATCH] chore: Adjust collapse arrow position align with first line (#27363) * fix: border style of Input.Search when allowClear (#27325) * fix: border style of Input.Search when allowClear * fix css * update * change name * docs: 4.7.3 changelog (#27350) * docs: 4.7.3 changelog * docs: Patch 27325 * chore: improve useCombinedRefs (#27352) * docs: :memo: update introduce * chore: fix API table border * chore: Adjust collapse arrow position align with first line Co-authored-by: xrk Co-authored-by: Tom Xu Co-authored-by: afc163 --- CHANGELOG.en-US.md | 19 + CHANGELOG.zh-CN.md | 19 + components/_util/hooks/useCombinedRefs.tsx | 2 +- .../__tests__/__snapshots__/demo.test.js.snap | 2 +- components/collapse/style/index.less | 3 +- components/input/Search.tsx | 3 +- .../__snapshots__/Search.test.js.snap | 14 +- .../__tests__/__snapshots__/demo.test.js.snap | 357 +++++++++++++++++- components/input/demo/group.md | 9 +- components/input/demo/search-input.md | 14 +- components/input/style/affix.less | 13 + components/input/style/mixin.less | 26 ++ components/input/style/rtl.less | 22 +- components/input/style/search-input.less | 17 +- docs/react/introduce.en-US.md | 9 +- docs/react/introduce.zh-CN.md | 9 +- package.json | 2 +- site/theme/static/markdown.less | 12 +- 18 files changed, 493 insertions(+), 59 deletions(-) diff --git a/CHANGELOG.en-US.md b/CHANGELOG.en-US.md index 12d134dc76..1031dbc87f 100644 --- a/CHANGELOG.en-US.md +++ b/CHANGELOG.en-US.md @@ -15,6 +15,25 @@ timeline: true --- +## 4.7.3 + +`2020-10-24` + +- Form + - 🐞 Fix Form warning for non-boolean attribute `virtual` when use ConfigProvider. [#27343](https://github.com/ant-design/ant-design/pull/27343) + - 🛠 Adjust Form.Item `initialValue` sync status align with Form level `initialValues`. [#27319](https://github.com/ant-design/ant-design/pull/27319) +- Typography + - 🛠 Improve Typography `ellipsis` title display. [#27328](https://github.com/ant-design/ant-design/pull/27328) + - 💄 Fix Editable Typography in Card title style problems. [#27221](https://github.com/ant-design/ant-design/pull/27221) +- Input + - 🐞 Fix Input.Search duplicated `className` when `allowClear` is `true`. [#27261](https://github.com/ant-design/ant-design/pull/27261) + - 🐞 Fix Input.Search border style when enable `allowClear`. [#27261](https://github.com/ant-design/ant-design/pull/27325) +- 🐞 Fix Upload.List preview image fit size issue. [#27312](https://github.com/ant-design/ant-design/pull/27312) [@JuniorTour](https://github.com/JuniorTour) +- 🐞 Fix Notification no wrap with long text. [#27285](https://github.com/ant-design/ant-design/pull/27285) [@littleee](https://github.com/littleee) +- 🐞 Fix Menu inside flexable container will not shrink properly. [#27253](https://github.com/ant-design/ant-design/pull/27253) +- 🌐 Fix en_US, en_GB and ga_IE gramma. [#27259](https://github.com/ant-design/ant-design/pull/27259) [@yasikovsky](https://github.com/yasikovsky) +- 🐞 Fix Tag with customize `closeIcon` breaks line issue. [#27226](https://github.com/ant-design/ant-design/pull/27226) [@handycode](https://github.com/handycode) + ## 4.7.2 `2020-10-19` diff --git a/CHANGELOG.zh-CN.md b/CHANGELOG.zh-CN.md index 49b78dd9fe..e7d13241e4 100644 --- a/CHANGELOG.zh-CN.md +++ b/CHANGELOG.zh-CN.md @@ -15,6 +15,25 @@ timeline: true --- +## 4.7.3 + +`2020-10-24` + +- Form + - 🐞 修复 Form 在 ConfigProvider 下会警告 `non-boolean attribute 'virtual'` 的问题。[#27343](https://github.com/ant-design/ant-design/pull/27343) + - 🛠 调整 Form.Item `initialValue` 的同步时机改由与 `initialValues` 相同。[#27319](https://github.com/ant-design/ant-design/pull/27319) +- Typography + - 🛠 优化 Typography 省略时的 `title` 提示，现在会在 `...` 上展现剩余文本。[#27328](https://github.com/ant-design/ant-design/pull/27328) + - 💄 修复 Typography 在 Card title 中编辑样式问题。[#27221](https://github.com/ant-design/ant-design/pull/27221) +- Input + - 🐞 修复 Input.Search 指定 `allowClear` 时 `className` 重复出现的问题。[#27261](https://github.com/ant-design/ant-design/pull/27261) + - 🐞 修复 修复 Input.Search 激活 `allowClear` 时边框样式异常的问题。[#27325](https://github.com/ant-design/ant-design/pull/27325) +- 🐞 修复 Upload.List 图片预览显示不全的问题。[#27312](https://github.com/ant-design/ant-design/pull/27312) [@JuniorTour](https://github.com/JuniorTour) +- 🐞 修复 Notification 长文本不换行的问题。[#27285](https://github.com/ant-design/ant-design/pull/27285) [@littleee](https://github.com/littleee) +- 🐞 修复 Menu 在 flex 容器内不会正常收缩省略的问题。[#27253](https://github.com/ant-design/ant-design/pull/27253) +- 🌐 修复 en_US、en_GB、ga_IE 国际化语法问题。[#27259](https://github.com/ant-design/ant-design/pull/27259) [@yasikovsky](https://github.com/yasikovsky) +- 🐞 修复 Tag 标签自定义关闭图标会导致换行的问题。[#27226](https://github.com/ant-design/ant-design/pull/27226) [@handycode](https://github.com/handycode) + ## 4.7.2 `2020-10-19` diff --git a/components/_util/hooks/useCombinedRefs.tsx b/components/_util/hooks/useCombinedRefs.tsx index d1ea07de2e..559832471c 100644 --- a/components/_util/hooks/useCombinedRefs.tsx +++ b/components/_util/hooks/useCombinedRefs.tsx @@ -4,7 +4,7 @@ import { fillRef } from '../ref'; function useCombinedRefs( ...refs: Array | ((instance: T) => void) | null> ) { - const targetRef = React.useRef(); + const targetRef = React.useRef(); React.useEffect(() => { refs.forEach(ref => { diff --git a/components/auto-complete/__tests__/__snapshots__/demo.test.js.snap b/components/auto-complete/__tests__/__snapshots__/demo.test.js.snap index da9038498e..c7037e7ef6 100644 --- a/components/auto-complete/__tests__/__snapshots__/demo.test.js.snap +++ b/components/auto-complete/__tests__/__snapshots__/demo.test.js.snap @@ -1061,7 +1061,7 @@ exports[`renders ./components/auto-complete/demo/uncertain-category.md correctly class="ant-select-selection-search" > ((props, ref) => { className, size: customizeSize, suffix, + enterButton, ...restProps } = props; delete (restProps as any).onSearch; delete (restProps as any).loading; - delete (restProps as any).enterButton; const prefixCls = getPrefixCls('input-search', customizePrefixCls); const inputPrefixCls = getPrefixCls('input', customizeInputPrefixCls); @@ -125,6 +125,7 @@ const Search = React.forwardRef((props, ref) => { { [`${prefixCls}-rtl`]: direction === 'rtl', [`${prefixCls}-${size}`]: !!size, + [`${prefixCls}-with-button`]: !!enterButton, }, className, ); diff --git a/components/input/__tests__/__snapshots__/Search.test.js.snap b/components/input/__tests__/__snapshots__/Search.test.js.snap index 7e76616e7d..a2746d8e5d 100644 --- a/components/input/__tests__/__snapshots__/Search.test.js.snap +++ b/components/input/__tests__/__snapshots__/Search.test.js.snap @@ -95,7 +95,7 @@ exports[`Input.Search should support addonAfter 1`] = ` exports[`Input.Search should support addonAfter 2`] = ` - + + + + + + + + + + + + + + + + +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
, + + + + + + + + + + + + + + + ,
,
, ,
, - + + + + + + + + @@ -2414,13 +2731,13 @@ Array [
,
, ,
, ,
, (
- - + + + +
+ + +
diff --git a/components/input/demo/search-input.md b/components/input/demo/search-input.md index f1b9345360..f89379ed0a 100644 --- a/components/input/demo/search-input.md +++ b/components/input/demo/search-input.md @@ -33,12 +33,24 @@ const onSearch = value => console.log(value); ReactDOM.render( <> +



- +

.@{ant-prefix}-select-auto-complete .@{ant-prefix}-input { vertical-align: top; } + + .@{ant-prefix}-input-group-wrapper + .@{ant-prefix}-input-group-wrapper { + margin-left: -1px; + .@{ant-prefix}-input-affix-wrapper { + border-radius: 0; + } + } + + .@{ant-prefix}-input-group-wrapper:not(:last-child) { + &.@{ant-prefix}-input-search > .@{ant-prefix}-input-group { + & > .@{ant-prefix}-input-group-addon > .@{ant-prefix}-input-search-button { + border-radius: 0; + } + + & > .@{ant-prefix}-input { + border-radius: @border-radius-base 0 0 @border-radius-base; + } + } + } } } diff --git a/components/input/style/rtl.less b/components/input/style/rtl.less index b8b69f0524..08d8888163 100644 --- a/components/input/style/rtl.less +++ b/components/input/style/rtl.less @@ -153,6 +153,19 @@ border-radius: @border-radius-base 0 0 @border-radius-base; } } + + .@{ant-prefix}-input-group-wrapper-rtl + .@{ant-prefix}-input-group-wrapper-rtl { + margin-right: -1px; + margin-left: 0; + } + + .@{ant-prefix}-input-group-wrapper-rtl:not(:last-child) { + &.@{ant-prefix}-input-search > .@{ant-prefix}-input-group { + & > .@{ant-prefix}-input { + border-radius: 0 @border-radius-base @border-radius-base 0; + } + } + } } } @@ -164,9 +177,6 @@ direction: rtl; .@{ant-prefix}-input { - border-right: @border-width-base solid @border-color-base; - border-left: 0; - &:hover, &:focus { + .@{ant-prefix}-input-group-addon .@{search-prefix}-button:not(.@{ant-prefix}-btn-primary) { @@ -178,15 +188,15 @@ > .@{ant-prefix}-input-group { > .@{ant-prefix}-input-affix-wrapper { - border-right: @border-width-base solid @border-color-base; - border-left: 0; - &:hover, &-focused { border-right-color: @input-hover-border-color; } } + > .@{ant-prefix}-input-group-addon { + right: -1px; + left: auto; .@{search-prefix}-button { border-radius: @border-radius-base 0 0 @border-radius-base; } diff --git a/components/input/style/search-input.less b/components/input/style/search-input.less index cda271b593..282fb81b16 100644 --- a/components/input/style/search-input.less +++ b/components/input/style/search-input.less @@ -7,8 +7,6 @@ .@{search-prefix} { .@{ant-prefix}-input { - border-right: 0; - &:hover, &:focus { border-color: @input-hover-border-color; @@ -19,6 +17,10 @@ } } + .@{ant-prefix}-input-affix-wrapper { + border-radius: 0; + } + // fix slight height diff in Firefox: // https://ant.design/components/auto-complete-cn/#components-auto-complete-demo-certain-category .@{ant-prefix}-input-lg { @@ -26,10 +28,8 @@ } > .@{ant-prefix}-input-group { - > .@{ant-prefix}-input-affix-wrapper { - border-right: 0; - } > .@{ant-prefix}-input-group-addon { + left: -1px; padding: 0; border: 0; @@ -49,4 +49,11 @@ } } } + + &-button { + &:hover, + &:focus { + z-index: 1; + } + } } diff --git a/docs/react/introduce.en-US.md b/docs/react/introduce.en-US.md index 51e1f6cd4b..c8a93b73b6 100644 --- a/docs/react/introduce.en-US.md +++ b/docs/react/introduce.en-US.md @@ -17,9 +17,9 @@ Following the Ant Design specification, we developed a React UI library `antd` t vertical-align: middle; } .pic-plus span { - font-size: 30px; - color: #aaa; margin: 0 20px; + color: #aaa; + font-size: 30px; } @@ -46,9 +46,8 @@ Following the Ant Design specification, we developed a React UI library `antd` t Polyfills are needed for IE browsers. We recommend [@babel/preset-env](https://babeljs.io/docs/en/babel-preset-env) for it. You can set `targets` config if you are using [umi](http://umijs.org/). -`antd@3.x` supports both React 15 and 16 but we strongly suggest React 16 for better performance and fewer bugs. - -> We drop support of IE8 after `antd@2.0`, IE9/10 after `antd@4.0`, +> We drop support of IE8 after `antd@2.0`, +> We drop support of React 15 and IE9/10 after `antd@4.0`, ## Version diff --git a/docs/react/introduce.zh-CN.md b/docs/react/introduce.zh-CN.md index 69eb4b8d3a..abc1748b9d 100644 --- a/docs/react/introduce.zh-CN.md +++ b/docs/react/introduce.zh-CN.md @@ -17,9 +17,9 @@ title: Ant Design of React vertical-align: middle; } .pic-plus span { - font-size: 30px; - color: #aaa; margin: 0 20px; + color: #aaa; + font-size: 30px; } @@ -46,9 +46,8 @@ title: Ant Design of React 对于 IE 系列浏览器，需要提供相应的 Polyfill 支持，建议使用 [@babel/preset-env](https://babeljs.io/docs/en/babel-preset-env) 来解决浏览器兼容问题。如果你在使用 [umi](http://umijs.org/)，可以直接使用 [targets](https://umijs.org/zh/config/#targets) 配置。 -`antd@3.x` 对 React 15/16 两个版本提供支持，但是我们强烈建议你升级到 React 16，以便获得更好的性能和遇到更少的问题。 - -> `antd@2.0` 之后不再支持 IE8，`antd@4.0` 之后不再支持 IE9/10。 +> `antd@2.0` 之后不再支持 IE8。 +> `antd@4.0` 之后不再支持 React 15 和 IE9/10。 ## 版本 diff --git a/package.json b/package.json index 82a5e1b785..50233be997 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "antd", - "version": "4.7.2", + "version": "4.7.3", "description": "An enterprise-class UI design language and React components implementation", "title": "Ant Design", "keywords": [ diff --git a/site/theme/static/markdown.less b/site/theme/static/markdown.less index f6e7facb66..b2d37bac09 100644 --- a/site/theme/static/markdown.less +++ b/site/theme/static/markdown.less @@ -262,7 +262,7 @@ font-size: max(@font-size-base - 1px, 12px); font-family: @code-family; line-height: @line-height-base; - border: 1px solid @border-color-split; + border: 0; -webkit-overflow-scrolling: touch; th, @@ -270,11 +270,19 @@ padding: 12px; border-color: @border-color-split; border-width: 1px 0; + + &:first-child { + border-left: 1px solid @border-color-split; + } + + &:last-child { + border-right: 1px solid @border-color-split; + } } th { padding-top: 14px; - border-width: 0 0 2px 0; + border-width: 1px 0 2px 0; } tbody tr {