Latest updates from IceHrmPro
This commit is contained in:
+652
@@ -0,0 +1,652 @@
|
||||
---
|
||||
order: 6
|
||||
title: Change Log
|
||||
toc: false
|
||||
timeline: true
|
||||
---
|
||||
|
||||
`antd` strictly follows [Semantic Versioning 2.0.0](http://semver.org/).
|
||||
|
||||
#### Release Schedule
|
||||
|
||||
- Weekly release: patch version at the end of every week for routine bugfix (anytime for urgent bugfix).
|
||||
- Monthly release: minor version at the end of every month for new features.
|
||||
- Major version release is not included in this schedule for breaking change and new features.
|
||||
|
||||
---
|
||||
|
||||
## 4.1.4
|
||||
|
||||
`2020-04-18`
|
||||
|
||||
- 🐞 Fix dark theme and compact theme not working. [#23243](https://github.com/ant-design/ant-design/pull/23243)
|
||||
- 🐞 Fix Modal.info executed only once when has argument. [#23360](https://github.com/ant-design/ant-design/pull/23360)
|
||||
- 🐞 Fix Dropdown submenu background missing. [#23296](https://github.com/ant-design/ant-design/pull/23296)
|
||||
- 💄 Optimize PageHeader responsive behavior. [#23277](https://github.com/ant-design/ant-design/pull/23277)
|
||||
- 🐞 Fix TreeSelect render blank in compact mode. [#23231](https://github.com/ant-design/ant-design/pull/23231)
|
||||
- 🛎 Fix Checkbox and Switch console warning typo (validate -> a valid). [#23240](https://github.com/ant-design/ant-design/pull/23240) [@evancharlton](https://github.com/evancharlton)
|
||||
- 🐞 Fix Table `rowSelection` params issue when `childrenColumnName` configured. [#23205](https://github.com/ant-design/ant-design/pull/23205)
|
||||
- Input
|
||||
- 🐞 Fix Input `type="color"` height issue. [#23351](https://github.com/ant-design/ant-design/pull/23351)
|
||||
- 🐞 Fix Input width shaking when trigger clear icon. [#23259](https://github.com/ant-design/ant-design/pull/23259)
|
||||
- 🐞 Fix Input.Search `size` not affected by ConfigProvider `componentSize`. [#23331](https://github.com/ant-design/ant-design/pull/23331)
|
||||
- Select
|
||||
- 🐞 Fix multiple Select show remove icon when `disabled`. [#23295](https://github.com/ant-design/ant-design/pull/23295)
|
||||
- 🐞 Fix Select custom `suffixIcon` cannot be access. [#23274](https://github.com/ant-design/ant-design/pull/23274)
|
||||
- 🐞 Fix Select search input caret missing in Collapse. [#23250](https://github.com/ant-design/ant-design/pull/23250)
|
||||
- Globalization
|
||||
- 🇨🇳 Form validation messages support internalization and add zh_CN locale. [#23165](https://github.com/ant-design/ant-design/pull/23165) [@hengkx](https://github.com/hengkx)
|
||||
- 🌐 Add missing translations in he_IL. [#23302](https://github.com/ant-design/ant-design/pull/23302) [@MishaKav](https://github.com/MishaKav)
|
||||
- 🌐 Add missing translations in ru_RU. [#23303](https://github.com/ant-design/ant-design/pull/23303) [@MishaKav](https://github.com/MishaKav)
|
||||
- TypeScript
|
||||
- 🔷 Form.Item type upgrade. [#22962](https://github.com/ant-design/ant-design/pull/22962) [@fa93hws](https://github.com/fa93hws)
|
||||
- 🔷 Tree type upgrade. [#23348](https://github.com/ant-design/ant-design/pull/23348) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 Pass `popupClassName` prop to `rc-picker`. [#23214](https://github.com/ant-design/ant-design/pull/23214) [@tanmoyopenroot](https://github.com/tanmoyopenroot)
|
||||
- RTL
|
||||
- 💄 Fix Select RTL style. [#23235](https://github.com/ant-design/ant-design/pull/23235)
|
||||
- 💄 Fix Menu RTL style. [#23319](https://github.com/ant-design/ant-design/pull/23319)
|
||||
|
||||
## 4.1.3
|
||||
|
||||
`2020-04-13`
|
||||
|
||||
- 💄 Adjust Form.Item `label` height style in vertical layout. [#23192](https://github.com/ant-design/ant-design/pull/23192)
|
||||
- 🐞 Fix `Variable is undefined` when importing dark or compact theme and provide a `getThemeVariables` methold for getting theme variables easily. [#23171](https://github.com/ant-design/ant-design/pull/23171)
|
||||
- 🐞 Fix PageHeader style breaks when `title` is too long and improve it's responsive design. [#23133](https://github.com/ant-design/ant-design/pull/23133)
|
||||
- Tabs
|
||||
- 🐞 Fix Tabs `@tabs-card-height` less variable not working. [#23168](https://github.com/ant-design/ant-design/pull/23168)
|
||||
- 🐞 Fix Tabs cannot be displayed in Safari 13. [#23151](https://github.com/ant-design/ant-design/pull/23151) [@imhxc](https://github.com/imhxc)
|
||||
- Table
|
||||
- 🐞 Fix Table fixed columns cannot pin in Safari 12. [#23161](https://github.com/ant-design/ant-design/pull/23161)
|
||||
- 🐞 Fix Table `summary` padding in small size. [#23140](https://github.com/ant-design/ant-design/pull/23140) [@someyoungideas](https://github.com/someyoungideas)
|
||||
- 🐞 Fix Select align style with different size. [#23160](https://github.com/ant-design/ant-design/pull/23160)
|
||||
- 🐞 Fix RangePicker under Input.Group style issue. [#23149](https://github.com/ant-design/ant-design/pull/23149)
|
||||
- 🐞 Fix Pagination missing TypeScript definition of `showTitle`. [#23144](https://github.com/ant-design/ant-design/pull/23144) [@DongchengWang](https://github.com/DongchengWang)
|
||||
|
||||
## 4.1.2
|
||||
|
||||
`2020-04-10`
|
||||
|
||||
- Menu
|
||||
- 🐞 Fix Menu SubMenu background in dark mode. [#22981](https://github.com/ant-design/ant-design/pull/22981) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix long SubMenu title being overlayed by arrow icon. [#23028](https://github.com/ant-design/ant-design/pull/23028) [@wwyx778](https://github.com/wwyx778)
|
||||
- 🐞 Fix dark and compact theme cannot work together. [#22934](https://github.com/ant-design/ant-design/pull/22934) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix Notification invalid `paddig-top` value. [#22941](https://github.com/ant-design/ant-design/pull/22941)
|
||||
- Button
|
||||
- 🐞 Fix Button `loading` animation with icon. [#23102](https://github.com/ant-design/ant-design/pull/23102)
|
||||
- ⚠️ Improve Button invalid `type` warning. [#22933](https://github.com/ant-design/ant-design/pull/22933) [@fa93hws](https://github.com/fa93hws)
|
||||
- 🐞 Fix Statistic show `-0` when value is `-`. [@22950](https://github.com/ant-design/ant-design/pull/22950)
|
||||
- 🐞 Fix Modal.confirm `onOk` should not be triggered multiple times. [#22963](https://github.com/ant-design/ant-design/pull/22963)
|
||||
- Input
|
||||
- 🐞 Fix Input.Group Button style not aligned center. [#22975](https://github.com/ant-design/ant-design/pull/22975)
|
||||
- 🐞 Fix Input with `affix` background style in dark theme. [#23115](https://github.com/ant-design/ant-design/pull/23115)
|
||||
- 🐞 Fix Form.Item not correct reset error style when dynamic switch Form.Item. [#23041](https://github.com/ant-design/ant-design/pull/23041)
|
||||
- 💄 Adjust RangePicker arrow & suffix color style. [#23025](https://github.com/ant-design/ant-design/pull/23025)
|
||||
- Table
|
||||
- 🐞 Fix Table selection row with hover background style. [#23110](https://github.com/ant-design/ant-design/pull/23110)
|
||||
- 💄 Tweak Table hover background color. [#23113](https://github.com/ant-design/ant-design/pull/23113)
|
||||
- ⚠️ Table add warning info when async mode `dataSource` length not match with `pageSize`. [#23118](https://github.com/ant-design/ant-design/pull/23118)
|
||||
- Select
|
||||
- 💄 Match mulitiple Select cursor position to single Select. [#22978](https://github.com/ant-design/ant-design/pull/22978)
|
||||
- 🐞 Fix borderless Select still show border when Form.Item set `validateStatus`. [#23004](https://github.com/ant-design/ant-design/pull/23004)
|
||||
- 🐞 Fix Select style in IE11. [#23020](https://github.com/ant-design/ant-design/pull/23020)
|
||||
- 🐞 Fix Calendar missing `style` prop support. [#23081](https://github.com/ant-design/ant-design/pull/23081)
|
||||
- 🐞 Fix Tabs bottom card active tab wrong height style. [#23087](https://github.com/ant-design/ant-design/pull/23087)
|
||||
- 🐞 Fix RTL support of Anchor, Select, DatePicker, Grid, Mentions. [@xrkffgg](https://github.com/xrkffgg)
|
||||
- TypeScript
|
||||
- 🌟 Upload `UploadProps` support generic typing. [#22921](https://github.com/ant-design/ant-design/pull/22921) [@dpyzo0o](https://github.com/dpyzo0o)
|
||||
- 🐞 Fix Modal.confirm `okButtonProps` types. [#21165](https://github.com/ant-design/ant-design/pull/21165) [@nicu-chiciuc](https://github.com/nicu-chiciuc)
|
||||
- 🌟 Export Form `Store` interface. [#22755](https://github.com/ant-design/ant-design/pull/22755) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🌟 Improve enum types for Input, Tag, Badge. [#23026](https://github.com/ant-design/ant-design/pull/23026) [#22999](https://github.com/ant-design/ant-design/pull/22999) [#23006](https://github.com/ant-design/ant-design/pull/23006) [@fjc0k](https://github.com/fjc0k)
|
||||
- 🐞 Fix Pagination `position` type. [#23048](https://github.com/ant-design/ant-design/pull/23048) [@Arttse](https://github.com/Arttse)
|
||||
|
||||
## 4.1.1
|
||||
|
||||
`2020-04-05`
|
||||
|
||||
- 🐞 Fix Tabs panel focus outline style. [#22752](https://github.com/ant-design/ant-design/pull/22752) [@MrHeer](https://github.com/MrHeer)
|
||||
- 🐞 Fix Input affix with popup element can not get click focus. [#22887](https://github.com/ant-design/ant-design/pull/22887)
|
||||
- Table
|
||||
- 🆕 Table row selection dropdown support `getPopupContainer`. [#22787](https://github.com/ant-design/ant-design/pull/22787) [@mikeyshing88](https://github.com/mikeyshing88)
|
||||
- 🐞 Fix Table header size with filter or sorter when `size` is configured. [#22872](https://github.com/ant-design/ant-design/pull/22872)
|
||||
- 💄 Adjust nest Table style, compact only when just one table element. [#22868](https://github.com/ant-design/ant-design/pull/22868)
|
||||
- 🐞 Fix Table column `align` not working on head when `sorter` configured. [#22858](https://github.com/ant-design/ant-design/pull/22858)
|
||||
- 🐞 Fix Table filter config not work on jsx structure. [#22888](https://github.com/ant-design/ant-design/pull/22888)
|
||||
- 🐞 Adjust Table expanded row not fix width when scroll only. [#22832](https://github.com/ant-design/ant-design/pull/22832)
|
||||
- 🐞 Fix the column can't show when the `column.children` is `undefined`. [#22832](https://github.com/ant-design/ant-design/pull/22832)
|
||||
- 🐞 Fix Table still show filter icon when `filters` is `undefined`. [#22833](https://github.com/ant-design/ant-design/pull/22833)
|
||||
- 🐞 Fix Table unchanged `filters` should not trigger `onChange`. [#22829](https://github.com/ant-design/ant-design/pull/22829)
|
||||
- 🐞 Fix Table loading compatibility. [#22739](https://github.com/ant-design/ant-design/pull/22739)
|
||||
- 🐞 Fix Table scroll shadow style in Safari. [#22794](https://github.com/ant-design/ant-design/pull/22794)
|
||||
- 💄 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 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)
|
||||
- 🐞 Fix Affix throws `React warning of state update on unmounted component`. [#22790](https://github.com/ant-design/ant-design/pull/22790)
|
||||
- 🐞 Fix Textarea with `clearIcon` additional `margin` in Form.Item. [#22793](https://github.com/ant-design/ant-design/pull/22793)
|
||||
- 🐞 Fix List `footer` missing border when data is empty. [#22771](https://github.com/ant-design/ant-design/pull/22771)
|
||||
- 🐞 Fix Slider `tooltipPlacement` option API is changed to be correct again. [#22772](https://github.com/ant-design/ant-design/pull/22772) [@phoenixeliot](https://github.com/phoenixeliot)
|
||||
- 🛠 Refactor LocaleReceiver with new context api to avoid React strict mode warning. [#22762](https://github.com/ant-design/ant-design/pull/22762)
|
||||
- 🐞 Fix Radio and Checkbox required prop not passing to input. [#22761](https://github.com/ant-design/ant-design/pull/22761)
|
||||
- 🐞 Fix variable `--scroll-bar` is undefined. [#22754](https://github.com/ant-design/ant-design/pull/22754) [@mikeyshing88](https://github.com/mikeyshing88)
|
||||
- 🐞 Fix Menu and Spin style in compact mode. [#22908](https://github.com/ant-design/ant-design/pull/22908) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix Space item duplicate key. [#22745](https://github.com/ant-design/ant-design/pull/22745)
|
||||
- 🐞 Fix Select cursor style. [#22743](https://github.com/ant-design/ant-design/pull/22743)
|
||||
- 🇫🇷 DatePicker and TimePicker update French locale. [#22769](https://github.com/ant-design/ant-design/pull/22769) [@PaulJln](https://github.com/PaulJln)
|
||||
- RTL
|
||||
- 💄 Add Message RTL style. [#22513](https://github.com/ant-design/ant-design/pull/22513) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix Menu RTL style. [#22841](https://github.com/ant-design/ant-design/pull/22841)
|
||||
- 🐞 Fix Radio RTL style. [#22926](https://github.com/ant-design/ant-design/pull/22926) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix label display in Form RTL. [#22621](https://github.com/ant-design/ant-design/pull/22621) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix Space RTL style. [#22809](https://github.com/ant-design/ant-design/pull/22809) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- TypeScript
|
||||
- 🐞 Fix Table `FilterDropdownProps` TypeScript definition. [#22895](https://github.com/ant-design/ant-design/pull/22895) [@zhangyu1818](https://github.com/zhangyu1818)
|
||||
- 🐞 Fix Form `Store` and `StoreValue` TypeScript definition. [#22755](https://github.com/ant-design/ant-design/pull/22755) [@shaodahong](https://github.com/shaodahong)
|
||||
|
||||
## 4.1.0
|
||||
|
||||
`2020-03-29`
|
||||
|
||||
- 🔥 Support compact mode theme. [#22126](https://github.com/ant-design/ant-design/pull/22126) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🔥 New Space component to resolve inline component margin style. [#22363](https://github.com/ant-design/ant-design/pull/22363)
|
||||
- 🔥 DatePicker support quarter picker. [#22468](https://github.com/ant-design/ant-design/pull/22468)
|
||||
- 🆕 Tree/TreeSelect/Select support `virtual` prop to disable virtual scroll. [#21955](https://github.com/ant-design/ant-design/pull/21955)
|
||||
- 🆕 Improve Pagination switch experience. [#22711](https://github.com/ant-design/ant-design/pull/22711)
|
||||
- Pagination will show size changer when `total > 50`.
|
||||
- Unify Pagination items to fixed length.
|
||||
- Change default size options to `10, 20, 50, 100`.
|
||||
- Table
|
||||
- 🆕 Table pagination `position` add more option. [#22647](https://github.com/ant-design/ant-design/pull/22647) [@hengkx](https://github.com/hengkx)
|
||||
- 🆕 Table selection column support `renderCell`. [#21711](https://github.com/ant-design/ant-design/pull/21711)
|
||||
- 🆕 Table sorter adding hint tooltip and a new prop `showSorterTooltip`. [#21631](https://github.com/ant-design/ant-design/pull/21631) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🆕 Tag component support `icon` prop. [#22418](https://github.com/ant-design/ant-design/pull/22418) [@vtsybulin](https://github.com/vtsybulin)
|
||||
- 🆕 Grid add `useBreakpoint` hook. [#22226](https://github.com/ant-design/ant-design/pull/22226)
|
||||
- 🆕 Card support `tabProps`. [#22207](https://github.com/ant-design/ant-design/pull/22207)
|
||||
- 🆕 Pagination add `autoResize` prop. [#21959](https://github.com/ant-design/ant-design/pull/21959) [@wendellhu95](https://github.com/wendellhu95)
|
||||
- 🆕 Add render props support for Popover/Popconfirm. [#22034](https://github.com/ant-design/ant-design/pull/22034) [@nossbigg](https://github.com/nossbigg)
|
||||
- 🆕 TimePicker.RangePicker support `order` prop. [#21948](https://github.com/ant-design/ant-design/pull/21948)
|
||||
- 🆕 Carousel `dots` support object to pass `className`. [#21848](https://github.com/ant-design/ant-design/pull/21848)
|
||||
- 🆕 Form `validateMessages` support `${label}` variable. [#21835](https://github.com/ant-design/ant-design/pull/21835)
|
||||
- 🆕 Expose all Dropdown props in Breadcrumb.Item. [#20763](https://github.com/ant-design/ant-design/pull/20763) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- ⌨️ Improve Tabs Accessibility. [#22287](https://github.com/ant-design/ant-design/pull/22287)
|
||||
- Add Tabs `keyboard` prop.
|
||||
- Tabs `extraContent` don't trigger keyboard navigation now.
|
||||
- 🛠 Warning Form.Item with `defaultValue` when it's controlled. [#22571](https://github.com/ant-design/ant-design/pull/22571)
|
||||
- 🛠 Menu.Item Tooltip could be hidden by falsy `title` prop. [#22202](https://github.com/ant-design/ant-design/pull/22202)
|
||||
- 🛠 Typography `onExpand` function support event parameter. [#22092](https://github.com/ant-design/ant-design/pull/22092) [@BlazPocrnja](https://github.com/BlazPocrnja)
|
||||
- 🛠 Simplify Popconfirm and Popover dom structure. [#22052](https://github.com/ant-design/ant-design/pull/22052)
|
||||
- 🐞 Fix Autocomplete display `null` when `value` is `null`. [#21955](https://github.com/ant-design/ant-design/pull/21955)
|
||||
- 🐞 Adjust Drawer close button without `title` style to avoid overlap with scroll bar. [#22710](https://github.com/ant-design/ant-design/pull/22710)
|
||||
- 🐞 Fix Calendar style details. [#22676](https://github.com/ant-design/ant-design/pull/22676)
|
||||
- Table
|
||||
- 🐞 Fix Table fixed column shadow style in Safari. [#22680](https://github.com/ant-design/ant-design/pull/22680)
|
||||
- 🐞 Fix Table style affect nest table element. [#22643](https://github.com/ant-design/ant-design/pull/22643)
|
||||
- 🐞 Fix Table `emptyText` is not centered and show pagination when empty data. [#22548](https://github.com/ant-design/ant-design/pull/22548) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 Fix Table `rowSelection` event bubbling with `onRow`. [#22566](https://github.com/ant-design/ant-design/pull/22566) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 Fix Input with `suffix` only align style issue. [#22603](https://github.com/ant-design/ant-design/pull/22603)
|
||||
- 🐞 Fix Alert cannot work with Tooltip/Popover. [#22594](https://github.com/ant-design/ant-design/pull/22594)
|
||||
- 🐞 Fix nest dynamic Form.Item get react unmounted update warning. [#22575](https://github.com/ant-design/ant-design/pull/22575)
|
||||
- 💄 Adjust Tag `processing` status color. [#22303](https://github.com/ant-design/ant-design/pull/22303)
|
||||
- 💄 Remove Select dropdown group title mouse click style. [#22581](https://github.com/ant-design/ant-design/pull/22581)
|
||||
- 💄 Redesign Table filter menu buttons and fix Dropdown edge `padding` style. [#22072](https://github.com/ant-design/ant-design/pull/22072)
|
||||
- 💄 Move `@form-item-label-height` from form styles to theme variables. [#22600](https://github.com/ant-design/ant-design/pull/22600) [@slavakam](https://github.com/slavakam)
|
||||
- 💄 Add less variables `@link-focus-decoration` and `@link-focus-outline`. [#22511](https://github.com/ant-design/ant-design/pull/22511)
|
||||
- 💄 add separator cursor `disabled` of DatePicker. [#22563](https://github.com/ant-design/ant-design/pull/22563)
|
||||
- RTL
|
||||
- 💄 Optimize Checkbox `inner` RTL style issue. [#22627](https://github.com/ant-design/ant-design/pull/22627)
|
||||
- 🐞 Optimize Upload `picture-card` RTL style issue. [#22630](https://github.com/ant-design/ant-design/pull/22630)
|
||||
- 🐞 Fix Badge RTL number style issue. [#22665](https://github.com/ant-design/ant-design/pull/22665)
|
||||
- 🐞 Fix Select RTL style issue when select multiple options can be cleared. [#22596](https://github.com/ant-design/ant-design/pull/22596)
|
||||
- 🐞 Fix Progress RTL style issue. [#22558](https://github.com/ant-design/ant-design/pull/22558)
|
||||
- 🐞 Fix Badge RTL style issue. [#22551](https://github.com/ant-design/ant-design/pull/22551)
|
||||
- 🐞 Fix Input RTL style issue. [#22525](https://github.com/ant-design/ant-design/pull/22525)
|
||||
- 🐞 Fix Steps RTL style issue. [#22523](https://github.com/ant-design/ant-design/pull/22523)
|
||||
- 💄 Optimize Tabs RTL icon style issue. [#22653](https://github.com/ant-design/ant-design/pull/22653)
|
||||
- 💄 Optimize Input.Group RTL style issue. [#22624](https://github.com/ant-design/ant-design/pull/22624)
|
||||
- 💄 Optimize Timeline label mode RTL style issue. [#22652](https://github.com/ant-design/ant-design/pull/22652)
|
||||
- 💄 Optimization Select dropdown group RTL style issue. [#22584](https://github.com/ant-design/ant-design/pull/22584)
|
||||
- 💄 Optimization Dropdown.Button RTL style issue. [#22519](https://github.com/ant-design/ant-design/pull/22519)
|
||||
- Typescript
|
||||
- 🛠 replace deprecated `React.SFC` with `React.FC`. [#22691](https://github.com/ant-design/ant-design/pull/22691) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🐞 Fix Form.Item `children` definition. [#22662](https://github.com/ant-design/ant-design/pull/22662)
|
||||
|
||||
## 4.0.4
|
||||
|
||||
`2020-03-23`
|
||||
|
||||
- 🐞 Fix AutoComplete clear icon overlap issue on search icon. [#22310](https://github.com/ant-design/ant-design/pull/22310)
|
||||
- 🐞 Fix Button align issue when is `disabled` and wrapped by Tooltip. [#22461](https://github.com/ant-design/ant-design/pull/22461)
|
||||
- 🐞 Fix Cascader search need to press down arrow twice to select item. [#22216](https://github.com/ant-design/ant-design/pull/22216) [@Kermit-Xuan](https://github.com/Kermit-Xuan)
|
||||
- 🐞 Fix Carousel cannot works on Snowpack. [#22507](https://github.com/ant-design/ant-design/pull/22507)
|
||||
- 🐞 Fix ConfigProvider `componentSize` not works on DatePicker.RangePicker. [#22486](https://github.com/ant-design/ant-design/pull/22486)
|
||||
- 🐞 Fix Descriptions cannot fit to small container width. [#22407](https://github.com/ant-design/ant-design/pull/22407)
|
||||
- ⚡️ Optimization Form.Item with multiple noStyle children Form.Item message collection performance. [#22410](https://github.com/ant-design/ant-design/pull/22410)
|
||||
- 🐞 Fix Grid broken style using Col without `span`. [#22455](https://github.com/ant-design/ant-design/pull/22455)
|
||||
- 💄 Add InputNumber RTL style. [#22434](https://github.com/ant-design/ant-design/pull/22434)
|
||||
- Menu
|
||||
- 🛠 Menu inherit `line-height` from header. [#16142](https://github.com/ant-design/ant-design/pull/16142) [@sheerun](https://github.com/sheerun)
|
||||
- 🐞 Fix Menu unexpected scrollbar when show and hide. [#22248](https://github.com/ant-design/ant-design/pull/22248)
|
||||
- 🐞 Fix Progress Dashboard won't allow `gapDeg` to be `0`. [#22462](https://github.com/ant-design/ant-design/pull/22462) [@thisrabbit](https://github.com/thisrabbit)
|
||||
- 🛠 Adjust Radio.Group logic that `value` is `undefined` should be uncontrolled mode. [#22245](https://github.com/ant-design/ant-design/pull/22245)
|
||||
- ⚡️ Reduce Row unnecessary render when `gutter` is array. [#22475](https://github.com/ant-design/ant-design/pull/22475) [@dolfje](https://github.com/dolfje)
|
||||
- 💄 Tweak RangePicker arrow shadow style. [#22406](https://github.com/ant-design/ant-design/pull/22406)
|
||||
- 🐞 Fix Select dropdown menu vertical padding. [#22251](https://github.com/ant-design/ant-design/pull/22251)
|
||||
- 🐞 Fix Slider tooltip crash when with `nullable` value. [#22482](https://github.com/ant-design/ant-design/pull/22482)
|
||||
- Table
|
||||
- 🐞 Fix Table ColumnGroup with controlled `sorterOrder` not working issue. [#22450](https://github.com/ant-design/ant-design/pull/22450)
|
||||
- 🐞 Fix Table border radius style. [#22413](https://github.com/ant-design/ant-design/pull/22413) [@akshatmittal](https://github.com/akshatmittal)
|
||||
- 🐞 Fix Table fixed column height issue. [#22367](https://github.com/ant-design/ant-design/pull/22367)
|
||||
- 🐞Fix Table row expand icon show error in ipad. [#22334](https://github.com/ant-design/ant-design/pull/22334) [@BugHiding](https://github.com/BugHiding)
|
||||
- 🛠 Table `column.filter` support `boolean` value. [#22277](https://github.com/ant-design/ant-design/pull/22277) [@xudongdev](https://github.com/xudongdev)
|
||||
- 🐞 Fix Table filter no working when only set `onFilter`. [#22317](https://github.com/ant-design/ant-design/pull/22317)
|
||||
- 🐞 Fix TreeSelect `treeIcon` not working. [#22437](https://github.com/ant-design/ant-design/pull/22437)
|
||||
- 🐞 Refactor DirectoryTree to fix deprecated warning. [#22318](https://github.com/ant-design/ant-design/pull/22318)
|
||||
- 🐞 Fix Typography nest list style issue. [#22284](https://github.com/ant-design/ant-design/pull/22284)
|
||||
- 🐞 Adjust Upload `onChange` return `fileList` is immutable data to avoid render issue. [#22322](https://github.com/ant-design/ant-design/pull/22322)
|
||||
- 🌎 Localization
|
||||
- 🇩🇪 Updated German locale. [#22270](https://github.com/ant-design/ant-design/pull/22270) [@iChebbi](https://github.com/iChebbi)
|
||||
- 🇫🇷 Update French locale. [#22238](https://github.com/ant-design/ant-design/pull/22238) [@abenhamdine](https://github.com/abenhamdine)
|
||||
- Typescript
|
||||
- 🐞 Omit Table `getCheckboxProps` typeof `checked`. [#22391](https://github.com/ant-design/ant-design/pull/22391) [@geekrainy](https://github.com/geekrainy)
|
||||
|
||||
## 4.0.3
|
||||
|
||||
`2020-03-14`
|
||||
|
||||
- Menu
|
||||
- 🐞 Fix Menu horizontal Item with nest Icon miss margin style. [#22021](https://github.com/ant-design/ant-design/pull/22021)
|
||||
- 🐞 Fix Menu item wrong `title` when setting `getPopupContainer`. [#22182](https://github.com/ant-design/ant-design/pull/22182)
|
||||
- 💄 Optimize the style of Icon in Menu. [#22090](https://github.com/ant-design/ant-design/pull/22090) [@x1mrdonut1x](https://github.com/x1mrdonut1x)
|
||||
- 🐞 Fix Avatar in horizontal Menu `margin` issue. [#22038](https://github.com/ant-design/ant-design/pull/22038) [#22033](https://github.com/ant-design/ant-design/pull/22033)
|
||||
- Slider
|
||||
- 🐞 Fix an issue where the position of 'slider handle' is incorrect in the vertical case of Slider. [#22135](https://github.com/ant-design/ant-design/pull/22135) [@wendellhu95](https://github.com/wendellhu95)
|
||||
- 💄 Fix Slider missing `focus` style. [#22161](https://github.com/ant-design/ant-design/pull/22161)
|
||||
- Table
|
||||
- 🐞 Fix ConfigProvider not work on Table filter dropdown. [#22133](https://github.com/ant-design/ant-design/pull/22133)
|
||||
- 🐞 Fix Table nest tree column expandable style issue with fixed column. [#22131](https://github.com/ant-design/ant-design/pull/22131)
|
||||
- 🐞 Fix an issue where Table filtering throws `cannot read property 'map' of undefined`. [#22096](https://github.com/ant-design/ant-design/pull/22096) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 Fix Table expandable column not fixed when selection column is fixed. [#22087](https://github.com/ant-design/ant-design/pull/22087)
|
||||
- 🐞 Fix Table filter menu reset not working. [#22079](https://github.com/ant-design/ant-design/pull/22079) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 Fix Table filter sub menu max height with many items. [#22230](https://github.com/ant-design/ant-design/pull/22230)
|
||||
- Form
|
||||
- 💄 Optimize the responsive and box model performance of The Form. [#21907](https://github.com/ant-design/ant-design/pull/21907) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 Fix FormItem hooks render error. [#22053](https://github.com/ant-design/ant-design/pull/22053) [@kagawagao](https://github.com/kagawagao)
|
||||
- 🐞 Fixed the problem of using custom icons to wrap in Input.Group. [#22197](https://github.com/ant-design/ant-design/pull/22197) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Adjust Select single padding style to avoid tweak with dropdown. [#22167](https://github.com/ant-design/ant-design/pull/22167)
|
||||
- 💄 Fix Calendar header select ellipsis bug. [#22148](https://github.com/ant-design/ant-design/pull/22148)
|
||||
- 💄 Fixed Dropdown content and icons overlapping. [#22098](https://github.com/ant-design/ant-design/pull/22098) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix Select ellipsis bug in Firefox. [#22101](https://github.com/ant-design/ant-design/pull/22101)
|
||||
- 🐞 Remove PageHeader unnecessary `overflow: hidden` style,Optimize PageHeader extra buttons responsive design. [#22030](https://github.com/ant-design/ant-design/pull/22030)
|
||||
- 🐞 Fix TextArea `autoSize` don't scroll bottom in Firefox. [#22014](https://github.com/ant-design/ant-design/pull/22014)
|
||||
- 🇫🇷 The full fr_FR internationalized text. [#22122](https://github.com/ant-design/ant-design/pull/22122) [@PaulJln](https://github.com/PaulJln)
|
||||
- RTL
|
||||
- 💄 Optimize the style of Pagination in RTL mode. [#22155](https://github.com/ant-design/ant-design/pull/22155) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Fixed the icon style with Cascader RTL. [#22191](https://github.com/ant-design/ant-design/pull/22191) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Optimize the Checkbox.Group style in RTL mode. [#22186](https://github.com/ant-design/ant-design/pull/22186) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Optimize Radio.Button style issues in RTL mode. [#22066](https://github.com/ant-design/ant-design/pull/22066) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Optimize table-pinned style issues that are listed under RTL. [#21914](https://github.com/ant-design/ant-design/pull/21914) [@saeedrahimi](https://github.com/saeedrahimi)
|
||||
- 💄 Adjust the direction of the Dropdown icon in RTL mode. [#22104](https://github.com/ant-design/ant-design/pull/22104) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Optimize the Breadcrumb style in RTL mode. [#22159](https://github.com/ant-design/ant-design/pull/22159) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Optimize the style of the Steps component in RTL mode. [#22175](https://github.com/ant-design/ant-design/pull/22175) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Optimize styles in RTL mode with form feedback. [#22222](https://github.com/ant-design/ant-design/pull/22222)
|
||||
- TypeScript
|
||||
- 🔷 Update the `operation` type definition of FormList. [#22058](https://github.com/ant-design/ant-design/pull/22058) [@kagawagao](https://github.com/kagawagao)
|
||||
- 🔷 Update the definition of the `trigger` parameter for components such as Tooltip. [#22043](https://github.com/ant-design/ant-design/pull/22043) [@wendellhu95](https://github.com/wendellhu95)
|
||||
|
||||
## 4.0.2
|
||||
|
||||
`2020-03-08`
|
||||
|
||||
- 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)
|
||||
- ⚡️ 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
|
||||
- 🐞 Fix Table dropdown popup at abnormal direction. [#21905](https://github.com/ant-design/ant-design/pull/21905)
|
||||
- 🐞 Fix Table `expandIconColumnIndex` display order with `rowSelection`. [#21915](https://github.com/ant-design/ant-design/pull/21915)
|
||||
- 🐞 Fix Table `size="small"` header background color is not same as other size. [#21942](https://github.com/ant-design/ant-design/pull/21942)
|
||||
- 🐞 Fix Table `className` and `style` works on wrong node. [#21974](https://github.com/ant-design/ant-design/pull/21974)
|
||||
- Select
|
||||
- 🐞 Fix Select align issue with empty string value. [#21880](https://github.com/ant-design/ant-design/pull/21880)
|
||||
- 🐞 Fix small size Select tag text not align middle. [#21940](https://github.com/ant-design/ant-design/pull/21940) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- Menu
|
||||
- 🐞 Fix Menu bottom margin is missing. [#21867](https://github.com/ant-design/ant-design/pull/21867)
|
||||
- 🐞 Fix horizontal Menu extra margin of Menu.Item with only icon. [#21925](https://github.com/ant-design/ant-design/pull/21925)
|
||||
- 🐞 Fix Menu popup menu overflow issue when contains too many items. [#21930](https://github.com/ant-design/ant-design/pull/21930)
|
||||
- 🐞 Fix Badge animation when switch between 10 and 11. [#21834](https://github.com/ant-design/ant-design/pull/21834) [@wendellhu95](https://github.com/wendellhu95)
|
||||
- 🐞 Fix Radio.Button inside Tooltip throws `Function components cannot be given refs` warning. [#21895](https://github.com/ant-design/ant-design/pull/21895) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix Descriptions miss style when content is falsy. [#21901](https://github.com/ant-design/ant-design/pull/21901)
|
||||
- 🐞 Fix DatePicker cursor style on `seperator`. [#21937](https://github.com/ant-design/ant-design/pull/21937) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix ConfigProvider `prefixCls` not working on Input.Password. [#21953](https://github.com/ant-design/ant-design/pull/21953) [@tdida](https://github.com/tdida)
|
||||
- 🐞 Fix Carousel `dots` not align center. [#21960](https://github.com/ant-design/ant-design/pull/21960) [@liusiasi](https://github.com/liusiasi)
|
||||
- 🐞 Fix Input.Search border style in `rtl` mode. [#21946](https://github.com/ant-design/ant-design/pull/21946) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- Less
|
||||
- 🆕 Add `@outline-fade` variable. [#20227](https://github.com/ant-design/ant-design/pull/20227) [@Satloff](https://github.com/Satloff)
|
||||
- 🆕 Add `@form-item-label-height` variable. [#21912](https://github.com/ant-design/ant-design/pull/21912)
|
||||
- TypeScript
|
||||
- 🌟 Improve Form.Item `renderProps` definite. [#21911](https://github.com/ant-design/ant-design/pull/21911)
|
||||
|
||||
## 4.0.1
|
||||
|
||||
`2020-03-04`
|
||||
|
||||
- Form
|
||||
- 🐞 Fix Form help control will get `react@16.13` warning. [#21800](https://github.com/ant-design/ant-design/pull/21800) [#21702](https://github.com/ant-design/ant-design/pull/21702)
|
||||
- 🐞 Fix Form.Item exceed Form width when content is too long. [#21682](https://github.com/ant-design/ant-design/pull/21682)
|
||||
- Input
|
||||
- 🐞 Fix TextArea style get warning in `react@16.13`. [#21703](https://github.com/ant-design/ant-design/pull/21703)
|
||||
- 🐞 Fix Input.Search extra border when has `prefix`. [#21753](https://github.com/ant-design/ant-design/pull/21753)
|
||||
- Table
|
||||
- 🐞 Fix Table column with `filtered` not working. [#21825](https://github.com/ant-design/ant-design/pull/21825)
|
||||
- 🐞 Fix Table locale not work. [#21772](https://github.com/ant-design/ant-design/pull/21772)
|
||||
- 🐞 Fix Table.Column `sortOrder` is not working in JSX mode. [#21719](https://github.com/ant-design/ant-design/pull/21719)
|
||||
- 🐞 Fix Table fixed column with sorted status style issue. [#21679](https://github.com/ant-design/ant-design/pull/21679)
|
||||
- 🐞 Fix Dropdown menu arrow position. [#21768](https://github.com/ant-design/ant-design/pull/21768) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix List `bordered` and `split` props conflict. [#21784](https://github.com/ant-design/ant-design/pull/21784) [@MXWXZ](https://github.com/MXWXZ)
|
||||
- 🐞 Fix Menu.Item `a` tag hidden bug. [#21699](https://github.com/ant-design/ant-design/pull/21699) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 Fix `message.open` crash when `icon` is not passed. [#21747](https://github.com/ant-design/ant-design/pull/21747) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix Result `status` cannot assigned to string or number type. [#21691](https://github.com/ant-design/ant-design/pull/21691)
|
||||
- 🐞 Fix Descriptions warning for duplicate key. [#21688](https://github.com/ant-design/ant-design/pull/21688)
|
||||
- 💄 Optimize Calendar header style in small screen. [#21813](https://github.com/ant-design/ant-design/pull/21813)
|
||||
- 💄 Radio.Group not wrapping now. [#21813](https://github.com/ant-design/ant-design/pull/21813)
|
||||
- 🛠 Refactor icons import code to reduce webpack disabled tree shaking bundle size. [#21752](https://github.com/ant-design/ant-design/pull/21752)
|
||||
- Typescript
|
||||
- 🐞 Fix Radio.Button type error. [#21807](https://github.com/ant-design/ant-design/pull/21807) [@jhoneybee](https://github.com/jhoneybee)
|
||||
- 🐞 fix `TreeSelect.SHOW_*` type. [#21791](https://github.com/ant-design/ant-design/pull/21791) [@TennyZhuang](https://github.com/TennyZhuang)
|
||||
- 🐞 Fix TreeSelect missing `suffix` define. [#21714](https://github.com/ant-design/ant-design/pull/21714)
|
||||
- 🐞 Fix Drawer `forceRender` TypeScript definite. [#21774](https://github.com/ant-design/ant-design/pull/21774)
|
||||
- 🐞 Fix Tree `treeData` define. [#21756](https://github.com/ant-design/ant-design/pull/21756)
|
||||
- 🐞 Fix Form.Item `renderProps` return type define. [#21716](https://github.com/ant-design/ant-design/pull/21716)
|
||||
|
||||
## 4.0.0
|
||||
|
||||
`2020-02-28`
|
||||
|
||||
- 🏆 Ant Design v4 is out! Check [here](https://github.com/ant-design/ant-design/issues/21656) for more info.
|
||||
- 🐞 Breadcrumb use `path` as default key to fix `name` key conflict. [#21583](https://github.com/ant-design/ant-design/pull/21583) [@douxc](https://github.com/douxc)
|
||||
- 🌟 Timeline.Item support `label`. [#21560](https://github.com/ant-design/ant-design/pull/21560) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 Fix Table filter menu max height style with many items. [#21602](https://github.com/ant-design/ant-design/pull/21602)
|
||||
- 💄 Add the Calendar component's custom default font color for display content. [#21598](https://github.com/ant-design/ant-design/pull/21598) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🚮 Remove DatePicker legacy cell className for custom cell style. [#21589](https://github.com/ant-design/ant-design/pull/21589)
|
||||
- 🐞 Fix RangePicker style render bug in IE11. [#21587](https://github.com/ant-design/ant-design/pull/21587)
|
||||
- 🛠 Progress `strokeColor` now will ignore incorrect percent. [#21564](https://github.com/ant-design/ant-design/pull/21564) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix Progress `trailColor` not working when `type=line`. [#21552](https://github.com/ant-design/ant-design/pull/21552) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 Fix the background of the components in the pop-up components in the dark theme. [#21299](https://github.com/ant-design/ant-design/pull/21299)
|
||||
- 💄 Optimization under the dark theme color swatches transparency.
|
||||
- 🌟 new less variable `@popover-customize-border-color`, `@list-customize-card-bg`, `@table-expand-icon-bg`, `@steps-background`, `@pagination-item-input-bg` for theme customization.
|
||||
|
||||
## 4.0.0-rc.6
|
||||
|
||||
`2020-02-24`
|
||||
|
||||
- Form
|
||||
- 🌟 support `scrollToFirstError` to simplify submit scroll logic. [#21462](https://github.com/ant-design/ant-design/pull/21462)
|
||||
- 🐞 Fix Form.Item with `help` align style. [#21476](https://github.com/ant-design/ant-design/pull/21476)
|
||||
- 🐞 Fix Form throw error when using BraftEditor. [#21425](https://github.com/ant-design/ant-design/pull/21425)
|
||||
- 🐞 Fix Form fields shake when switching the validing info. [#21302](https://github.com/ant-design/ant-design/pull/21302) [@yoyo837](https://github.com/yoyo837)
|
||||
- Upload
|
||||
- 🌟 Upload added `removeIcon` and `downloadIcon` properties. [#21363](https://github.com/ant-design/ant-design/pull/21363) [@sdhr27](https://github.com/sdhr27)
|
||||
- 🐞 Fix Upload identify types of image logic errors. [#21473](https://github.com/ant-design/ant-design/pull/21473) [@holynewbie](https://github.com/holynewbie)
|
||||
- Input
|
||||
- 🐞 Fix Input with `readOnly` still clearable by `allowClear`. [#21494](https://github.com/ant-design/ant-design/pull/21494)
|
||||
- 🐞 Fix Input click with `prefix` / `suffix` not get focused. [#21413](https://github.com/ant-design/ant-design/pull/21413)
|
||||
- Table
|
||||
- 🐞 Fix Table selection crash when record children is `null`. [#21528](https://github.com/ant-design/ant-design/pull/21528)
|
||||
- 🐞 Fix Table fixed column style with `small` size. [#21431](https://github.com/ant-design/ant-design/pull/21431)
|
||||
- Descriptions
|
||||
- 🐞 Fix `label` does not have the problem of still rendering the label element when not using `bordered`. [#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 Fix Non-bordered titles under `vertical` are also a problem for `td`. [#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 Fix `vertical` and `bordered` layout issues. [#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 Fix the problem of `style` not working on `Item`. [#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 Fix `th` will also get the useless `-colon` className problem under `border`. [#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🌟 Select added `tagRender` for customized tag rendering. [#21064](https://github.com/ant-design/ant-design/pull/21064) [@fguitton](https://github.com/fguitton)
|
||||
- 💄 Picker `onPanelChange` will also trigger when panel value changed. [#21455](https://github.com/ant-design/ant-design/pull/21455)
|
||||
- 🐞 Fix Notification first call multiple time can not stack. [#21531](https://github.com/ant-design/ant-design/pull/21531)
|
||||
- 🐞 Fix TreeSelect popup do not update issue. [#21410](https://github.com/ant-design/ant-design/pull/21410)
|
||||
- 💄 Optimize Upload `showDownloadIcon` default doesn't show. [b4636](https://github.com/ant-design/ant-design/commit/b4636ab2dfdb006c14bdb3d5d7de09e1650c3567)
|
||||
- 💄 Tweak Divider inner text `padding` and add `@divider-text-padding`. [#21407](https://github.com/ant-design/ant-design/pull/21407)
|
||||
- Typescript
|
||||
- 🐞 Fix Form types. [#21483](https://github.com/ant-design/ant-design/pull/21483) [#21411](https://github.com/ant-design/ant-design/pull/21411)
|
||||
|
||||
## 4.0.0-rc.5
|
||||
|
||||
`2020-02-16`
|
||||
|
||||
- 🐞 Fix Form.Item `validateFirst` prevent form submit. [#21329](https://github.com/ant-design/ant-design/pull/21329)
|
||||
- 🐞 Fix InputNumber cursor position issue when deleting consecutive identical numbers. [#21344](https://github.com/ant-design/ant-design/pull/21344)
|
||||
- 💄 Remove Menu excess background color. [#21365](https://github.com/ant-design/ant-design/pull/21365)
|
||||
- 💄 Optimize the mouse style for the `disabled` state of the DatePicker component. [#21352](https://github.com/ant-design/ant-design/pull/21352)
|
||||
- 🐞 Fix Affix throws `Cannot read property getBoundingClientRect` in mobile device. [#21350](https://github.com/ant-design/ant-design/pull/21350)
|
||||
- 🐞 Fix the problem that the label width is incorrect when the screen is less than `xs`. [#21222](https://github.com/ant-design/ant-design/pull/21222)
|
||||
- 🐞 Fix Input `size` is `large` height style. [#21338](https://github.com/ant-design/ant-design/pull/21338)
|
||||
- 🐞 Fix Badge `color` not working when contains children. [#21333](https://github.com/ant-design/ant-design/pull/21333)
|
||||
- 🐞 Fix Alert close button extra padding. [#21325](https://github.com/ant-design/ant-design/pull/21325)
|
||||
- 💄 Tweak Steps 1px align issue. [#21306](https://github.com/ant-design/ant-design/pull/21306)
|
||||
- 💄 Fix legacy Button.Group `large` size style issue. [#21307](https://github.com/ant-design/ant-design/pull/21307)
|
||||
- 💄 Fix Input border radius with suffix, style in Firefox, TextArea allowClear style issues. [#21316](https://github.com/ant-design/ant-design/pull/21316)
|
||||
- 🐞 Pagination will pass `disabled` prop to prev/next buttons return by `itemRender`. [#21361](https://github.com/ant-design/ant-design/pull/21361)
|
||||
- 🇦🇿 Added Azerbaijani translation. [#21387](https://github.com/ant-design/ant-design/pull/21387) [@orkhan-huseyn](https://github.com/orkhan-huseyn)
|
||||
- Typescript
|
||||
- 🔷 Menu export `MenuItemGroupProps`. [#21356](https://github.com/ant-design/ant-design/pull/21356)
|
||||
- 🔷 Table export `ColumnProps`. [#21321](https://github.com/ant-design/ant-design/pull/21321)
|
||||
|
||||
## 4.0.0-rc.4
|
||||
|
||||
`2020-02-09`
|
||||
|
||||
- 📖 Add [color palette](https://preview-21101-ant-design.surge.sh/docs/spec/dark-cn#%E5%9F%BA%E7%A1%80%E8%89%B2%E6%9D%BF) and [palette generation tool](https://preview-21101-ant-design.surge.sh/docs/spec/dark-cn#%E8%89%B2%E6%9D%BF%E7%94%9F%E6%88%90%E5%B7%A5%E5%85%B7) for dark theme. [#21101](https://github.com/ant-design/ant-design/pull/21101)
|
||||
- 🌟 Add `style` field for `options` prop of Checkbox.Group and Radio.Group. [#21219](https://github.com/ant-design/ant-design/pull/21219)
|
||||
- 🌟 Add `validateFirst` prop for Form.Item. [#21178](https://github.com/ant-design/ant-design/pull/21178)
|
||||
- 🌟 Add `useModal` hook for Modal to support `context` access. [#20949](https://github.com/ant-design/ant-design/pull/20949)
|
||||
- 🌟 Add `useNotification` hook for Notification to support `context` access. [#21275](https://github.com/ant-design/ant-design/pull/21275)
|
||||
- 🌟 Add `bordered` prop for Select、TreeSelect、DatePicker、TimePicker and Cascader. [#21242](https://github.com/ant-design/ant-design/pull/21242)
|
||||
- 🌟 Add `selectAllLabels` prop for Transfer. [#21139](https://github.com/ant-design/ant-design/pull/21139) [@morenyang](https://github.com/morenyang)
|
||||
- 💄 Redesign the style of ink bar for Tabs. [#21256](https://github.com/ant-design/ant-design/pull/21256)
|
||||
- 💄 Add less variable `@form-item-label-font-size`. [#21216](https://github.com/ant-design/ant-design/pull/21216)
|
||||
- 🐞 Fix Badge style for Badge with Typography. [#21235](https://github.com/ant-design/ant-design/pull/21235)
|
||||
- 🐞 Fix Checkbox not work when Checkbox and Checkbox.Group are separated by other component. [#21146](https://github.com/ant-design/ant-design/pull/21146) [@morenyang](https://github.com/morenyang)
|
||||
- 🐞 Fix Collapse.Panel wrong content width when `extra` prop is set. [#21202](https://github.com/ant-design/ant-design/pull/21202) [@zhiyuc123](https://github.com/zhiyuc123)
|
||||
- Form
|
||||
- 🐞 Fix Form.Item `required` validation not work when name is not set. [#21168](https://github.com/ant-design/ant-design/pull/21168)
|
||||
- 🐞 Fix Form.Item data binding not work when `name` is `0`. [#21186](https://github.com/ant-design/ant-design/pull/21186) [@wanjas](https://github.com/wanjas)
|
||||
- 🐞 Fix Form.Item shaking when `help` prop change from valuable to `undefined`. [#21211](https://github.com/ant-design/ant-design/pull/21211)
|
||||
- Input
|
||||
- 🐞 Fix worng validating style when `prefix` is set. [#21121](https://github.com/ant-design/ant-design/pull/21121)
|
||||
- 🐞 Fix `size` prop not work when `prefix` or `affix` is set. [#21290](https://github.com/ant-design/ant-design/pull/21290) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 Fix Radio.Group style with Badge. [#21215](https://github.com/ant-design/ant-design/pull/21215)
|
||||
- 🐞 Fix Select no margin between lines when mode is `tags` or `multiple`. [#21175](https://github.com/ant-design/ant-design/pull/21175)
|
||||
- 🐞 Fix Slider dots focus style. [#21244](https://github.com/ant-design/ant-design/pull/21244) [@Kermit-Xuan](https://github.com/Kermit-Xuan)
|
||||
- 🐞 Fix Steps icon not align when `size="small"` and `labelPlacement="vertical"`. [#21258](https://github.com/ant-design/ant-design/pull/21258)
|
||||
- Table
|
||||
- 🐞 Fix `expandIcon` prop not work when data item has no `children` field. [#21169](https://github.com/ant-design/ant-design/pull/21169)
|
||||
- 🐞 Fix Column `sorter` prop not work. [#21194](https://github.com/ant-design/ant-design/pull/21194)
|
||||
- 🐞 Fix custom filter's typing not work. [#21218](https://github.com/ant-design/ant-design/pull/21218)
|
||||
- 🐞 Fix TimePicker `defaultOpenValue` prop not work. [#21198](https://github.com/ant-design/ant-design/pull/21198)
|
||||
- Transfer
|
||||
- 🐞 Fix wrong unit for checkbox label of header. [#21136](https://github.com/ant-design/ant-design/pull/21136) [@morenyang](https://github.com/morenyang)
|
||||
- 🐞 Fix icon not align in search input. [#21247](https://github.com/ant-design/ant-design/pull/21247)
|
||||
- 🐞 Fix Typography not focus at the end of textarea when editable is true. [#21268](https://github.com/ant-design/ant-design/pull/21268)
|
||||
|
||||
## 4.0.0-rc.3
|
||||
|
||||
`2020-01-27`
|
||||
|
||||
- 🛠 Use native Date instead of moment to get timestamp in Countdown component. [#21108](https://github.com/ant-design/ant-design/pull/21108) [@morenyang](https://github.com/morenyang)
|
||||
- 🐞 Fix Input `suffix / prefix` style issue with `addonBefore / addonAfter`. [#21105](https://github.com/ant-design/ant-design/pull/21105)
|
||||
- 💄 Improved Timeline component style in RTL mode. [#21068](https://github.com/ant-design/ant-design/pull/21068) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 Update `clearfix` mixin to remove legacy `zoom` descriptor. [#21109](https://github.com/ant-design/ant-design/pull/21109) [@morenyang](https://github.com/morenyang)
|
||||
- 💄Card component use `@font-size-base` instead of inline `14px`. [#21107](https://github.com/ant-design/ant-design/pull/21107) [@morenyang](https://github.com/morenyang)
|
||||
- 💄 Adjust Layout component to let `className` get higher priority. [#21074](https://github.com/ant-design/ant-design/pull/21074) [@yoyo837](https://github.com/yoyo837)
|
||||
- Typescript
|
||||
- 🐞 Fix Tree wrong event type of AntTreeNodeMouseEvent. [#21102](https://github.com/ant-design/ant-design/pull/21102) [@Jirka-Lhotka](https://github.com/Jirka-Lhotka)
|
||||
- 🐞 Fix Form.Item return type define. [#21067](https://github.com/ant-design/ant-design/pull/21067)
|
||||
|
||||
## 4.0.0-rc.2
|
||||
|
||||
`2020-01-21`
|
||||
|
||||
- 🛠 Refactor some demos to React hooks and TypeScript. [#21045](https://github.com/ant-design/ant-design/pull/21045)
|
||||
- 🐞 Fixed Input/Select components align issue. [#20869](https://github.com/ant-design/ant-design/pull/20869)
|
||||
- Dropdown
|
||||
- 🆕 Support `buttonsRender` to customize buttons. [#20815](https://github.com/ant-design/ant-design/pull/20815)
|
||||
- 🐞 Tooltip doesn't disappear on `disabled` Dropdown.Button in Chrome. [#20960](https://github.com/ant-design/ant-design/pull/20960)
|
||||
- Input
|
||||
- 🐞 Fixed Input `prefix` and `suffix` overlap with content issue. [#20872](https://github.com/ant-design/ant-design/pull/20872)
|
||||
- 🐞 Fixed Input `placeholder` color in Firefox. [#20850](https://github.com/ant-design/ant-design/issues/20850)
|
||||
- Table
|
||||
- 🐞 Fixed `onChange` return cached fresh sorter & filter state. [#20858](https://github.com/ant-design/ant-design/pull/20858)
|
||||
- 🐞 Fixed problem that all-checkbox is checked when all the checkboxes are disabled. [#20968](https://github.com/ant-design/ant-design/pull/20968)
|
||||
- 🐞 Fixed `locale.emptyText` not working. [#21024](https://github.com/ant-design/ant-design/pull/21024)
|
||||
- Select
|
||||
- 🐞 Fixed `placeholder` wrap and align issue. [#20883](https://github.com/ant-design/ant-design/pull/20883) [#20884](https://github.com/ant-design/ant-design/pull/20884)
|
||||
- 🐞 Fixed multiple Select left padding. [#20861](https://github.com/ant-design/ant-design/pull/20861)
|
||||
- 🐞 Fixed multiple Select clean icon overlap issue. [#20914](https://github.com/ant-design/ant-design/pull/20914)
|
||||
- Form
|
||||
- 🆕 Added scroll options as `scrollToField` argument. [#20774](https://github.com/ant-design/ant-design/pull/20774)
|
||||
- 🐞 Fixed Form.Item update `help` makes layout shake. [#20886](https://github.com/ant-design/ant-design/pull/20886)
|
||||
- 🐞 Fixed unexpected extra rerender when Form.Item is not a real Field. [#20963](https://github.com/ant-design/ant-design/pull/20963)
|
||||
- 🐞 Fixed Form.Item ignore `help=""` issue. [#21026](https://github.com/ant-design/ant-design/pull/21026)
|
||||
- 🐞 Fixed Form.Item `label` align bug in small screen. [#20836](https://github.com/ant-design/ant-design/issues/20836)
|
||||
- 🐞 Fixed message cut shadow issue. [#20856](https://github.com/ant-design/ant-design/issues/20856)
|
||||
- 🐞 Fixed Tooltip hidden when `title` is `0`. [#20894](https://github.com/ant-design/ant-design/pull/20894)
|
||||
- 🐞 Fixed List `actions` inconsistent position. [#20897](https://github.com/ant-design/ant-design/pull/20897)
|
||||
- 🆕 Add a visual list example for Tree. [#20911](https://github.com/ant-design/ant-design/pull/20911)
|
||||
- 🐞 Fixed AutoComplete example styling issue. [#20946](https://github.com/ant-design/ant-design/pull/20946)
|
||||
- 🗑 Removed AutoComplete useless `labelInValue`. [#20967](https://github.com/ant-design/ant-design/pull/20967)
|
||||
- 🐞 Fixed Drawer `footerStyle` prop cause react warning. [#20983](https://github.com/ant-design/ant-design/pull/20983)
|
||||
- 🐞 Fixed Breadcrumb style in `rtl` mode. [#21054](https://github.com/ant-design/ant-design/pull/21054)
|
||||
- 💄 Tweak Layout `className` order to end. [#21041](https://github.com/ant-design/ant-design/pull/21041)
|
||||
- TypeScript
|
||||
- 🐞 Export DatePicker related interface. [#20900](https://github.com/ant-design/ant-design/pull/20900)
|
||||
- Less variables
|
||||
- 🆕 Readded `@border-radius-sm`. [#20818](https://github.com/ant-design/ant-design/pull/20818)
|
||||
- 🆕 Added `@timeline-item-padding-bottom`. [#21013](https://github.com/ant-design/ant-design/pull/21013)
|
||||
- 🆕 Added `@layout-header-color`. [#21033](https://github.com/ant-design/ant-design/pull/21033)
|
||||
|
||||
## 4.0.0-rc.1
|
||||
|
||||
`2020-01-11`
|
||||
|
||||
- 🌟 Drawer Added `footer` and `footerStyle` properties. [#20690](https://github.com/ant-design/ant-design/pull/20690) [@DeanVanNiekerk](https://github.com/DeanVanNiekerk)
|
||||
- 🌟 Switch Added `@switch-min-width` and `@switch-sm-min-width` less variables. [#20829](https://github.com/ant-design/ant-design/pull/20829) [@abdih](https://github.com/abdih)
|
||||
- Table
|
||||
- 🐞 Fix expanded icon not work when `expandRowByClick` is set. [#20808](https://github.com/ant-design/ant-design/pull/20808)
|
||||
- 🐞 Fix expanded row width in scaled dom element and border style. [#20805](https://github.com/ant-design/ant-design/pull/20805)
|
||||
- 🐞 Fix background color css priority too high to override user customize style. [#20794](https://github.com/ant-design/ant-design/pull/20794)
|
||||
- 🐞 Fix `rowSelection` of `fixed` not work. [#20735](https://github.com/ant-design/ant-design/pull/20735)
|
||||
- 🐞 Fix fixed columns in Chrome show the vertical scrollbar. [#20705](https://github.com/ant-design/ant-design/pull/20705)
|
||||
- 🐞 Fix crash when columns with empty children. [#20703](https://github.com/ant-design/ant-design/pull/20703)
|
||||
- 💄 Tweak Calendar basic style month drop-down box width and notice items of word order and card mode, select the size of the box. [#20790](https://github.com/ant-design/ant-design/pull/20790) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- DatePicker
|
||||
- 💄 Optimize the `border-radius` of the rounded corners connection. [#20736](https://github.com/ant-design/ant-design/pull/20736)
|
||||
- 🐞 Fix selected style overlap. [#20736](https://github.com/ant-design/ant-design/pull/20736)
|
||||
- 🐞 Fix extra dividing line at the bottom. [#20736](https://github.com/ant-design/ant-design/pull/20736)
|
||||
- 🐞 Fix button style for DatePicker's default range. [#20760](https://github.com/ant-design/ant-design/pull/20760) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Input not block user input when value is `undefined`. [#20783](https://github.com/ant-design/ant-design/pull/20783)
|
||||
- 🐞 Fix Carousel card carousel orientation in left / right mode. [#20781](https://github.com/ant-design/ant-design/pull/20781) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix Grid responsive gutter under SSR initial value of `0`. [#20762](https://github.com/ant-design/ant-design/pull/20762)
|
||||
- 🐞 Fix InputNumber, Select and other components icon size. [#20765](https://github.com/ant-design/ant-design/pull/20765)
|
||||
- 🐞 Fix Badge `z-index` higher than Table fixed columns. [#20751](https://github.com/ant-design/ant-design/pull/20751)
|
||||
- 💄 Tweak font family to be same as tailwindcss. [#20747](https://github.com/ant-design/ant-design/pull/20747)
|
||||
- 🐞 Fix TextArea `autoSize` blink in FireFox. [#20737](https://github.com/ant-design/ant-design/pull/20737)
|
||||
- 🐞 Fix Form.Item not keep error message sync when hit rule changed. [#20725](https://github.com/ant-design/ant-design/pull/20725)
|
||||
- 🐞 Fix Form.Item add additional feedback style when `hasFeedback` is not set. [#20691](https://github.com/ant-design/ant-design/pull/20691)
|
||||
- 🐞 Fix Cascader search bug when `fieldNames` is existed and label/value share same name. [#20720](https://github.com/ant-design/ant-design/pull/20720)
|
||||
- 🐞 Fix Collapse background color with wrong less variable. [#20718](https://github.com/ant-design/ant-design/pull/20718) [@kuitos](https://github.com/kuitos)
|
||||
- 🐞 Fix Slider's Tooltip not follow handle. [#20699](https://github.com/ant-design/ant-design/pull/20699)
|
||||
- 🐞 Fix Card cover image get skretched. [#20701](https://github.com/ant-design/ant-design/pull/20701)
|
||||
- 🐞 Fix Typography automatic overflow with `suffix` property. [#20689](https://github.com/ant-design/ant-design/pull/20689) [@zouxiaomingya](https://github.com/zouxiaomingya)
|
||||
- 🐞 Fix AutoComplete with customize component with wrong style. [#20686](https://github.com/ant-design/ant-design/pull/20686)
|
||||
- 🐞 Fix Input.Group to be partial to a pixel in Form. [#20681](https://github.com/ant-design/ant-design/pull/20681)
|
||||
- TypeScript
|
||||
- 🐞 Export Form interfaces. [3a1c5](https://github.com/ant-design/ant-design/commit/3a1c51010fecfa59f63f5e09027805a141e9ec11)
|
||||
- 🐞 Fix Table types. [#20789](https://github.com/ant-design/ant-design/pull/20789)
|
||||
- 🐞 Fix Table.Column and Table.ColumnGroup definition. [#20695](https://github.com/ant-design/ant-design/pull/20695)
|
||||
|
||||
## 4.0.0-rc.0
|
||||
|
||||
`2020-01-04`
|
||||
|
||||
Ant Design 4.0-rc released! Here is the release [document](https://github.com/ant-design/ant-design/issues/20661).
|
||||
|
||||
⚠️ Migrate from v3 to v4 please ref to [migration document](/docs/react/migration-v4).
|
||||
|
||||
### New features and improvements
|
||||
|
||||
- 🌟 antd package size optimization, js gzipped dropped from 532.75KB to 289.89 KB. [#20356](https://github.com/ant-design/ant-design/pull/20356)
|
||||
- 💄 New dark theme support. [#20281](https://github.com/ant-design/ant-design/pull/20281)
|
||||
- 🌟 ConfigProvider supports `direction` internationalization setting`rtl`. [#19380](https://github.com/ant-design/ant-design/pull/19380)
|
||||
- 🌟 New Form component. [#17327](https://github.com/ant-design/ant-design/pull/17327)
|
||||
- 🌟 Form comes with data binding function.
|
||||
- 🌟 Field changes only affect the rendering of related field components and not the entire Form.
|
||||
- 🌟 Added `initialValues` to replace the original field initialization.
|
||||
- 🌟 Added `validateMessages` to support modify validation templates.
|
||||
- 🌟 Added `onFinish` and `onFinishFailed` to complete the overall component verification logic.
|
||||
- 🌟 Added `onFieldsChange` and `onValuesChange` for triggering controlled state.
|
||||
- 🌟 Provide hook support for `useForm`.
|
||||
- 🌟 Form.Item adds `name` property for data binding.
|
||||
- 🌟 Form.Item `validateTrigger` will only perform validation trigger and will not collect field values at the same time.
|
||||
- 🌟 Form.Item adds `rules` property for data validation.
|
||||
- 🌟 Form.Item adds `shouldUpdate` property to support render props.
|
||||
- 🌟 Form.Item adds `dependencies` property to simplify related field update logic.
|
||||
- 🌟 Form.Item adds `noStyle` property and adds unstyled data binding.
|
||||
- 🌟 Added Form.List component to simplify adding, deleting, modifying and checking operations.
|
||||
- 🌟 Added Form.Provider component to support multi-form linkage.
|
||||
- 🌟 New Table component. [#19678](https://github.com/ant-design/ant-design/pull/19678)
|
||||
- 🌟 Added `summary` support for summary lines.
|
||||
- 🌟 Now `fixedColumn`,`expandable`, and `scroll` can be mixed.
|
||||
- 🌟 Support multi-column sort.
|
||||
- 🌟 Support custom `body` and add virtual scrolling example.
|
||||
- 🌟 Expansion-related props moved into the `expandable` attribute and add `rowExpandable` prop.
|
||||
- 🎉 Use css `sticky` to achieve fixed effects to optimize performance.
|
||||
- 💄 Optimized `expand` animation effect.
|
||||
- 🌟 New DatePicker, TimePicker and Calendar components. [#20023](https://github.com/ant-design/ant-design/pull/20023)
|
||||
- 🌟 Support custom date library.
|
||||
- 🌟 Added `picker` support for setting selectors (no longer need to simulate selectors via controlled`mode`).
|
||||
- 🌟 Full range selector support: time, date, week, month, year.
|
||||
- 🌟 Range selector can now select start and end times individually.
|
||||
- 🌟 The range selector can be set to `disabled` separately for the start and end time.
|
||||
- 🌟 The range selector allows empty start and end times.
|
||||
- 🌟 Optimized manual input and keyboard interaction support.
|
||||
- 🌟 Added `inputReadOnly` to disable manual input.
|
||||
- 🌟 Remove Icon and use `@ ant-design / icons` instead. [#18217](https://github.com/ant-design/ant-design/pull/18217)
|
||||
- Skeleton
|
||||
- 🌟 Support Skeleton.Avatar placeholder component. [#19898](https://github.com/ant-design/ant-design/pull/19898) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🌟 Support Skeleton.Button placeholder component. [#19699](https://github.com/ant-design/ant-design/pull/19699) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🌟 Support Skeleton.Input placeholder component. [#20264](https://github.com/ant-design/ant-design/pull/20264) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🌟 Tree supports virtual scrolling. [#18172](https://github.com/ant-design/ant-design/pull/18172)
|
||||
- 🌟 Tree Enhanced accessibility support and keyboard interaction. [#18866](https://github.com/ant-design/ant-design/pull/18866)
|
||||
- 🌟 Select uses virtual scrolling and enhanced accessibility support and keyboard interaction. [#18658](https://github.com/ant-design/ant-design/pull/18658)
|
||||
- 🌟 Uncontrolled mode when `value` is `undefined` now.
|
||||
- 🌟 TreeSelect uses virtual scrolling and optimizes keyboard support. [#19040](https://github.com/ant-design/ant-design/pull/19040)
|
||||
- 🌟 Uncontrolled mode when `value` is `undefined` now.
|
||||
- 🌟 Button adds `default` and`link` styles for `danger`. [#19837](https://github.com/ant-design/ant-design/pull/19837)
|
||||
- 🌟 Form and ConfigProvider support `size` setting to include component size. [#20570](https://github.com/ant-design/ant-design/pull/20570)
|
||||
- 🌟 Typography adds `suffix` attribute. [#20224](https://github.com/ant-design/ant-design/pull/20224)
|
||||
- 🌟 Progress adds `steps` subcomponent. [#19613](https://github.com/ant-design/ant-design/pull/19613)
|
||||
- 🌟 TextArea supports `onResize`. [#20408](https://github.com/ant-design/ant-design/pull/20408)
|
||||
- 🌟 Added Alert.ErrorBoundary to provide friendly error interception and prompting. [#19923](https://github.com/ant-design/ant-design/pull/19923)
|
||||
- 🌟 Upload supports iconRender to customize icons. [#20034](https://github.com/ant-design/ant-design/pull/20034) [@qq645381995](https://github.com/qq645381995)
|
||||
- 🌟 Tag component preset status color. [#19399](https://github.com/ant-design/ant-design/pull/19399)
|
||||
- 🌟 Grid uses `flex` layout. [#16635](https://github.com/ant-design/ant-design/pull/16635)
|
||||
- 🐞 Fix the display error of Carousel component `dotposition` as`left | right`. [#20645](https://github.com/ant-design/ant-design/pull/20645) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 Fix Alert style text overflow. [#20318](https://github.com/ant-design/ant-design/pull/20318)
|
||||
- 🙅 Removed warning messages for deprecated APIs. [#17510](https://github.com/ant-design/ant-design/pull/17510)
|
||||
- 🙅 Added warning for Avatar, Button, Modal.method and Result components using v3 strings as icons. [#20226](https://github.com/ant-design/ant-design/pull/20226)
|
||||
- 💄 Add `@border-color-split-popover`、`@input-icon-hover-color`、`@select-clear-background`、`@cascader-menu-border-color-split`、`@modal-header-border-color-split`、`@skeleton-to-color`、`@transfer-item-hover-bg` and other less variables. [#20070](https://github.com/ant-design/ant-design/pull/20070)
|
||||
|
||||
## 3.x
|
||||
|
||||
Visit [GitHub](https://github.com/ant-design/ant-design/blob/3.x-stable/CHANGELOG.en-US.md) to read `3.x` change logs.
|
||||
|
||||
## 2.x
|
||||
|
||||
Visit [GitHub](https://github.com/ant-design/ant-design/blob/2.x-stable/CHANGELOG.en-US.md) to read `2.x` change logs.
|
||||
|
||||
## 1.11.4
|
||||
|
||||
Visit [GitHub](https://github.com/ant-design/ant-design/blob/1.x-stable/CHANGELOG.md) to read change logs from `0.x` to `1.x`.
|
||||
+653
@@ -0,0 +1,653 @@
|
||||
---
|
||||
order: 6
|
||||
title: 更新日志
|
||||
toc: false
|
||||
timeline: true
|
||||
---
|
||||
|
||||
`antd` 严格遵循 [Semantic Versioning 2.0.0](http://semver.org/lang/zh-CN/) 语义化版本规范。
|
||||
|
||||
#### 发布周期
|
||||
|
||||
- 修订版本号:每周末会进行日常 bugfix 更新。(如果有紧急的 bugfix,则任何时候都可发布)
|
||||
- 次版本号:每月发布一个带有新特性的向下兼容的版本。
|
||||
- 主版本号:含有破坏性更新和新特性,不在发布周期内。
|
||||
|
||||
---
|
||||
|
||||
## 4.1.4
|
||||
|
||||
`2020-04-18`
|
||||
|
||||
- 🐞 修复暗黑主题和紧凑主题不生效的问题。[#23243](https://github.com/ant-design/ant-design/pull/23243)
|
||||
- 🐞 修复 Modal.info 等方法的 `onOk` 函数有参数时只触发一次的问题。[#23360](https://github.com/ant-design/ant-design/pull/23360)
|
||||
- 🐞 修复 Dropdown 弹出菜单背景样式问题。[#23296](https://github.com/ant-design/ant-design/pull/23296)
|
||||
- 💄 优化 PageHeader 的响应式表现。[#23277](https://github.com/ant-design/ant-design/pull/23277)
|
||||
- 🐞 修复紧凑模式下树选择出现空白。[#23231](https://github.com/ant-design/ant-design/pull/23231)
|
||||
- 🛎 修改 Checkbox 和 Switch 中控制台输出的错别字 (validate -> a valid)。[#23240](https://github.com/ant-design/ant-design/pull/23240) [@evancharlton](https://github.com/evancharlton)
|
||||
- 🐞 修复 Table `rowSelection` 在设置 `childrenColumnName` 时事件参数不正确的问题。[#23205](https://github.com/ant-design/ant-design/pull/23205)
|
||||
- Input
|
||||
- 🐞 修复 Input `type="color"` 的高度问题。[#23351](https://github.com/ant-design/ant-design/pull/23351)
|
||||
- 🐞 修复 Input 设置 `allowClear` 内联展示时,触发清除按钮样式抖动的问题。[#23259](https://github.com/ant-design/ant-design/pull/23259)
|
||||
- 🐞 修复 Input.Search 全局设置 `size` 不生效问题。[#23331](https://github.com/ant-design/ant-design/pull/23331)
|
||||
- Select
|
||||
- 🐞 修复 Select 多选时设置 `disabled` 选项仍然会展示移除按钮的问题。[#23295](https://github.com/ant-design/ant-design/pull/23295)
|
||||
- 🐞 修复 Select 自定义 `suffixIcon` 无法交互的问题。[#23274](https://github.com/ant-design/ant-design/pull/23274)
|
||||
- 🐞 修复 Select 输入光标在 Collapse 内不显示的问题。[#23250](https://github.com/ant-design/ant-design/pull/23250)
|
||||
- 国际化
|
||||
- 🌐 Form 校验信息支持国际化并增加中文文案。[#23165](https://github.com/ant-design/ant-design/pull/23165) [@hengkx](https://github.com/hengkx)
|
||||
- 🌐 完善希伯来语(以色列) 国际化。[#23302](https://github.com/ant-design/ant-design/pull/23302) [@MishaKav](https://github.com/MishaKav)
|
||||
- 🌐 完善俄语国际化。[#23303](https://github.com/ant-design/ant-design/pull/23303) [@MishaKav](https://github.com/MishaKav)
|
||||
- TypeScript
|
||||
- 🔷 更新 Tree 的类型定义。[#23348](https://github.com/ant-design/ant-design/pull/23348) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🔷 更新 Form Item 的类型定义。[#22962](https://github.com/ant-design/ant-design/pull/22962) [@fa93hws](https://github.com/fa93hws)
|
||||
- 🐞 修复 Slider 组件 `value` 和 `defaultValue` 文档与 TypeScript 定义不一致的问题。[#23252](https://github.com/ant-design/ant-design/pull/23252) [@DongchengWang](https://github.com/DongchengWang)
|
||||
- RTL
|
||||
- 🐞 修复 Menu RTL 样式。[#23319](https://github.com/ant-design/ant-design/pull/23319)
|
||||
- 💄 修复 Select 的 RTL 样式。[#23235](https://github.com/ant-design/ant-design/pull/23235)
|
||||
|
||||
## 4.1.3
|
||||
|
||||
`2020-04-13`
|
||||
|
||||
- 💄 调整 Form.Item `label` 在垂直布局下的高度样式。[#23192](https://github.com/ant-design/ant-design/pull/23192)
|
||||
- 🐞 修复引用暗黑或紧凑主题时提示 `Variable is undefined` 的问题,并提供 `getThemeVariables` 方便获取对应主题变量。[#23171](https://github.com/ant-design/ant-design/pull/23171)
|
||||
- 🐞 修复 PageHeader `title` 超长时布局被破坏的问题并优化响应式表现。[#23133](https://github.com/ant-design/ant-design/pull/23133)
|
||||
- Tabs
|
||||
- 🐞 修复 Tabs `@tabs-card-height` less 变量无效的问题。[#23168](https://github.com/ant-design/ant-design/pull/23168)
|
||||
- 🐞 修复 Tabs 在 Safair 浏览器下无法显示的问题。[#23151](https://github.com/ant-design/ant-design/pull/23151) [@imhxc](https://github.com/imhxc)
|
||||
- Table
|
||||
- 🐞 修复 Table 固定列在 Safari 12 中不能固定的问题。[#23161](https://github.com/ant-design/ant-design/pull/23161)
|
||||
- 🐞 修复 Table `summary` 在小尺寸下的内边距样式。[#23140](https://github.com/ant-design/ant-design/pull/23140) [@someyoungideas](https://github.com/someyoungideas)
|
||||
- 🐞 修复 Select 不同尺寸下的对齐样式问题。[#23160](https://github.com/ant-design/ant-design/pull/23160)
|
||||
- 🐞 修复 RangePicker 在 Input.Group 内的样式问题。[#23149](https://github.com/ant-design/ant-design/pull/23149)
|
||||
- 🐞 修复 Pagination 缺少 `showTitle` TypeScript 定义的问题。[#23144](https://github.com/ant-design/ant-design/pull/23144) [@DongchengWang](https://github.com/DongchengWang)
|
||||
|
||||
## 4.1.2
|
||||
|
||||
`2020-04-10`
|
||||
|
||||
- Menu
|
||||
- 🐞 修复暗色 Menu 弹出菜单背景色为白色的问题。[#22981](https://github.com/ant-design/ant-design/pull/22981) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复 SubMenu 标题过长而导致被箭头图标部分覆盖的问题。[#23028](https://github.com/ant-design/ant-design/pull/23028) [@wwyx778](https://github.com/wwyx778)
|
||||
- 🐞 修复紧凑模式和暗黑模式无法同时开启的问题。[#22934](https://github.com/ant-design/ant-design/pull/22934) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复 Notification 非法的 `padding-top` 值。[#22941](https://github.com/ant-design/ant-design/pull/22941)
|
||||
- Button
|
||||
- 🐞 修复带图标 Button 的 `loading` 动画效果。 [#23102](https://github.com/ant-design/ant-design/pull/23102)
|
||||
- ⚠️ 优化 Button 非法 `type` 的控制台提示。[#22933](https://github.com/ant-design/ant-design/pull/22933)
|
||||
- 🐞 修复 Statistic 在值为 `-` 时会展示成 `-0` 的问题。[@22950](https://github.com/ant-design/ant-design/pull/22950)
|
||||
- 🐞 修复 Modal.confirm `onOk` 可以被触发多次的问题。[#22963](https://github.com/ant-design/ant-design/pull/22963)
|
||||
- Input
|
||||
- 🐞 修复 Input.Group 中 Button 不能对齐的问题。[#22975](https://github.com/ant-design/ant-design/pull/22975)
|
||||
- 🐞 修复 Input 在暗黑模式下使用 `affix` 的背景样式问题。[#23115](https://github.com/ant-design/ant-design/pull/23115)
|
||||
- 🐞 修复 Form.Item 在动态切换时没有正确重置错误样式的问题。[#23041](https://github.com/ant-design/ant-design/pull/23041)
|
||||
- 💄 微调 RangePicker 箭头和后缀的颜色样式。[#23025](https://github.com/ant-design/ant-design/pull/23025)
|
||||
- Table
|
||||
- 🐞 修复 Table 选择行在 hover 时的背景样式问题。[#23110](https://github.com/ant-design/ant-design/pull/23110)
|
||||
- 💄 微调 Table 行 hover 时的背景色。[#23113](https://github.com/ant-design/ant-design/pull/23113)
|
||||
- ⚠️ Table 在异步数据下 `dataSource` 长度与 `pageSize` 不匹配时,添加警告信息。[#23118](https://github.com/ant-design/ant-design/pull/23118)
|
||||
- Select
|
||||
- 💄 微调多选 Select 的光标位置使其与单选 Select 统一。[#22978](https://github.com/ant-design/ant-design/pull/22978)
|
||||
- 🐞 修复 无边框 Select 在 Form.Item 设置 `validateStatus` 时会出现边框的问题。[#23004](https://github.com/ant-design/ant-design/pull/23004)
|
||||
- 🐞 修复 Select 在 IE11 下的展示问题。[#23020](https://github.com/ant-design/ant-design/pull/23020)
|
||||
- 🐞 修复 Calendar 不支持 `style` 属性的问题。[#23081](https://github.com/ant-design/ant-design/pull/23081)
|
||||
- 🐞 修复 Tabs 下方卡片布局激活标签的高度问题。[#23087](https://github.com/ant-design/ant-design/pull/23087)
|
||||
- 🐞 修复 Anchor、Select、DatePicker、Grid、Mentions 组件的 RTL 支持。[@xrkffgg](https://github.com/xrkffgg)
|
||||
- TypeScript
|
||||
- 🌟 Upload `UploadProps` 支持泛型定义。[#22921](https://github.com/ant-design/ant-design/pull/22921) [@dpyzo0o](https://github.com/dpyzo0o)
|
||||
- 🐞 修复 Modal.confirm 的 `okButtonProps` 定义。[#21165](https://github.com/ant-design/ant-design/pull/21165) [@nicu-chiciuc](https://github.com/nicu-chiciuc)
|
||||
- 🌟 暴露 Form `Store` 接口。[#22755](https://github.com/ant-design/ant-design/pull/22755) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🌟 优化 Input、Tag、Badge 组件的枚举类型属性定义。[#23026](https://github.com/ant-design/ant-design/pull/23026) [#22999](https://github.com/ant-design/ant-design/pull/22999) [#23006](https://github.com/ant-design/ant-design/pull/23006) [@fjc0k](https://github.com/fjc0k)
|
||||
- 🐞 修复 Pagination `position` 定义。 [#23048](https://github.com/ant-design/ant-design/pull/23048) [@Arttse](https://github.com/Arttse)
|
||||
|
||||
## 4.1.1
|
||||
|
||||
`2020-04-05`
|
||||
|
||||
- 🐞 移除 Tabs 的内容区域的 focus 蓝色轮廓线。[#22752](https://github.com/ant-design/ant-design/pull/22752) [@MrHeer](https://github.com/MrHeer)
|
||||
- 🐞 修复 Input 前后缀添加弹出元素不能点击获得焦点的问题。[#22887](https://github.com/ant-design/ant-design/pull/22887)
|
||||
- Table
|
||||
- 🐞 修复 Table 行选择下拉菜单不支持 `getPopupContainer`。[#22787](https://github.com/ant-design/ant-design/pull/22787) [@mikeyshing88](https://github.com/mikeyshing88)
|
||||
- 🐞 修复 Table 配 `size` 时,使用过滤和排序的表头尺寸问题。[#22872](https://github.com/ant-design/ant-design/pull/22872)
|
||||
- 💄 调整嵌套 Table 样式,只有一个子 Table 时才移除边距。[#22868](https://github.com/ant-design/ant-design/pull/22868)
|
||||
- 🐞 修复 Table 列 `align` 在 `sorter` 开启时标题不居中的问题。[#22858](https://github.com/ant-design/ant-design/pull/22858)
|
||||
- 🐞 修复 Table 过滤设置在 jsx 结构下无效的问题。[#22888](https://github.com/ant-design/ant-design/pull/22888)
|
||||
- 🐞 调整 Table 在无固定列滚动时,展开行将跟随表格一同滚动。[#22832](https://github.com/ant-design/ant-design/pull/22832)
|
||||
- 🐞 修复当 `column.children` 为 `undefined` 时整列未显示的问题。[#22832](https://github.com/ant-design/ant-design/pull/22832)
|
||||
- 🐞 修复 Table 在 `filters` 为 `undefined` 时仍然展示过滤按钮的问题。[#22833](https://github.com/ant-design/ant-design/pull/22833)
|
||||
- 🐞 修复 Table `filters` 未变化时触发 `onChange` 事件的问题。[#22829](https://github.com/ant-design/ant-design/pull/22829)
|
||||
- 🐞 修复 Table `loading` 兼容性。[#22739](https://github.com/ant-design/ant-design/pull/22739)
|
||||
- 🐞 修复 Table 在 Safari 下滚动阴影的样式。[#22794](https://github.com/ant-design/ant-design/pull/22794)
|
||||
- 💄 调整 RangePicker 箭头样式。[#22847](https://github.com/ant-design/ant-design/pull/22847)
|
||||
- 🐞 修复 Text 使用 `ellipsis` 的对齐问题。[#22836](https://github.com/ant-design/ant-design/pull/22836)
|
||||
- 💄 优化 `@info-color` less 变量,默认为 `@primary-color`。[#22723](https://github.com/ant-design/ant-design/pull/22723)
|
||||
- 🐞 修复大号多选 Select 未选择时的高度问题。[#22904](https://github.com/ant-design/ant-design/pull/22904)
|
||||
- 🐞 修复 BackTop 在 iframe 里不生效并提升了组件性能。[#22788](https://github.com/ant-design/ant-design/pull/22788)
|
||||
- 🐞 修复 Radio less 变量名错误。[#22803](https://github.com/ant-design/ant-design/pull/22803) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 修复 Card Tabs 不支持小尺寸的问题。[#22666](https://github.com/ant-design/ant-design/pull/22666) [@MrHeer](https://github.com/MrHeer)
|
||||
- 🐞 修复 Affix 抛出 `React state update on unmounted component` 警告的问题。[#22790](https://github.com/ant-design/ant-design/pull/22790)
|
||||
- 🐞 修复 Textarea 配置 `clearIcon` 在 Form.Item 下会有额外的 `margin` 的问题。[#22793](https://github.com/ant-design/ant-design/pull/22793)
|
||||
- 🐞 修复 List 空数据时 `footer` 上分割线缺失的问题。[#22771](https://github.com/ant-design/ant-design/pull/22771)
|
||||
- 🐞 修复 Slider 中 `tooltipPlacement` 与 `vertical` 配置在顺序上问题。[#22772](https://github.com/ant-design/ant-design/pull/22772) [@phoenixeliot](https://github.com/phoenixeliot)
|
||||
- 🛠 用新的 React context 重构 LocaleReceiver 以避免严格模式下的警告信息。[#22762](https://github.com/ant-design/ant-design/pull/22762)
|
||||
- 🐞 修复 Radio 和 Checkbox 上 required 属性没有传给原生 input 的问题。[#22761](https://github.com/ant-design/ant-design/pull/22761)
|
||||
- 🐞 修复 CSS 变量 `--scroll-bar` 未定义的问题。[#22754](https://github.com/ant-design/ant-design/pull/22754) [@mikeyshing88](https://github.com/mikeyshing88)
|
||||
- 🐞 修复 Menu 和 Spin 在紧凑模式下样式。[#22908](https://github.com/ant-design/ant-design/pull/22908) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复 Space 子项重复的 `key`。[#22745](https://github.com/ant-design/ant-design/pull/22745)
|
||||
- 🐞 修复 Select 鼠标手型样式。[#22743](https://github.com/ant-design/ant-design/pull/22743)
|
||||
- 🇫🇷 DatePicker 和 TimePicker 法语国际化。[#22769](https://github.com/ant-design/ant-design/pull/22769) [@PaulJln](https://github.com/PaulJln)
|
||||
- RTL
|
||||
- 💄 新增 Message RTL 样式。[#22513](https://github.com/ant-design/ant-design/pull/22513) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 Radio RTL 样式。[#22926](https://github.com/ant-design/ant-design/pull/22926) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复 Menu RTL 样式问题。[#22841](https://github.com/ant-design/ant-design/pull/22841)
|
||||
- 🐞 修复 Form RTL 下 label 样式问题。[#22621](https://github.com/ant-design/ant-design/pull/22621) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 Space RTL 样式问题。[#22809](https://github.com/ant-design/ant-design/pull/22809) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- TypeScript
|
||||
- 🐞 修复 Table `FilterDropdownProps` 类型定义。[#22895](https://github.com/ant-design/ant-design/pull/22895) [@zhangyu1818](https://github.com/zhangyu1818)
|
||||
- 🐞 修复 Form `Store` 和 `StoreValue` 类型定义。[#22755](https://github.com/ant-design/ant-design/pull/22755) [@shaodahong](https://github.com/shaodahong)
|
||||
|
||||
## 4.1.0
|
||||
|
||||
`2020-03-29`
|
||||
|
||||
- 🔥 支持紧凑模式主题。[#22126](https://github.com/ant-design/ant-design/pull/22126) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🔥 新的 Space 组件以支持内联组件的间距样式。[#22363](https://github.com/ant-design/ant-design/pull/22363)
|
||||
- 🔥 DatePicker 支持季度选择器。[#22468](https://github.com/ant-design/ant-design/pull/22468)
|
||||
- 🆕 Tree/TreeSelect/Select 支持 `virtual` 属性以关闭虚拟滚动。[#21955](https://github.com/ant-design/ant-design/pull/21955)
|
||||
- 🆕 改进 Pagination 使用体验。[#22711](https://github.com/ant-design/ant-design/pull/22711)
|
||||
- Pagination 当 `total > 50` 时默认显示切换页数选择器。
|
||||
- 统一 Pagination 十页以内的页码个数使其宽度更统一。
|
||||
- Pagination 调整默认页数选项为 `10, 20, 50, 100`。
|
||||
- Table
|
||||
- 🆕 Table 分页位置增加更多选项。[#22647](https://github.com/ant-design/ant-design/pull/22647) [@hengkx](https://github.com/hengkx)
|
||||
- 🆕 Table 选择列支持 `renderCell`。[#21711](https://github.com/ant-design/ant-design/pull/21711)
|
||||
- 🆕 Table 排序增加下次排序的提示,并增加 `showSorterTooltip` 属性开关。[#21631](https://github.com/ant-design/ant-design/pull/21631) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🆕 Tag 支持 `icon` 属性。[#22418](https://github.com/ant-design/ant-design/pull/22418) [@vtsybulin](https://github.com/vtsybulin)
|
||||
- 🆕 Grid 添加 `useBreakpoint` hook. [#22226](https://github.com/ant-design/ant-design/pull/22226)
|
||||
- 🆕 Card 支持 `tabProps`。[#22207](https://github.com/ant-design/ant-design/pull/22207)
|
||||
- 🆕 Menu.Item 上的 Tooltip 现在可以使用 `title={null}` 来禁用。[#22202](https://github.com/ant-design/ant-design/pull/22202)
|
||||
- 🆕 Pagination supports `autoResize` prop。[#21959](https://github.com/ant-design/ant-design/pull/21959) [@wendellhu95](https://github.com/wendellhu95)
|
||||
- 🆕 Popover/Popconfirm 添加 render props 支持。[#22034](https://github.com/ant-design/ant-design/pull/22034) [@nossbigg](https://github.com/nossbigg)
|
||||
- 🆕 TimePicker.RangePicker 支持 `order` 属性用于设置排序行为。[#21948](https://github.com/ant-design/ant-design/pull/21948)
|
||||
- 🆕 Carousel `dots` 支持对象传递 `className`。[#21848](https://github.com/ant-design/ant-design/pull/21848)
|
||||
- 🆕 Form `validateMessages` 支持 `${label}` 变量。[#21835](https://github.com/ant-design/ant-design/pull/21835)
|
||||
- 🆕 暴露 Breadcrumb.Item 组件的所有 Dropdown 的可配置属性。[#20763](https://github.com/ant-design/ant-design/pull/20763) [@paranoidjk](https://github.com/paranoidjk)
|
||||
- ⌨️ 增强 Tabs 可访问性。[#22287](https://github.com/ant-design/ant-design/pull/22287)
|
||||
- 新增 Tabs keyboard 属性用于开关键盘切换功能。
|
||||
- Tabs `extraContent` 里的元素不再触发键盘切换功能。
|
||||
- 🛠 添加 Form.Item 在受控时使用 `defaultValue` 的警告信息。[#22571](https://github.com/ant-design/ant-design/pull/22571)
|
||||
- 🛠 Typography `onExpand` 添加事件参数。[#22092](https://github.com/ant-design/ant-design/pull/22092) [@BlazPocrnja](https://github.com/BlazPocrnja)
|
||||
- 🛠 简化 Popconfirm 和 Popover 的 dom 结构。[#22052](https://github.com/ant-design/ant-design/pull/22052)
|
||||
- 🐞 修复 Autocomplete `value` 为 `null` 时,值展示 `null` 的问题。[#21955](https://github.com/ant-design/ant-design/pull/21955)
|
||||
- 🐞 调整 Drawer 无 `title` 时关闭按钮样式以避免遮挡滚动条。[#22710](https://github.com/ant-design/ant-design/pull/22710)
|
||||
- 🐞 修复 Calendar 的一些样式细节问题。[#22676](https://github.com/ant-design/ant-design/pull/22676)
|
||||
- Table
|
||||
- 🐞 修复 Table 在 Safari 下固定列的阴影样式问题。[#22680](https://github.com/ant-design/ant-design/pull/22680)
|
||||
- 🐞 修复 Table 样式影响内嵌 table 的问题。[#22643](https://github.com/ant-design/ant-design/pull/22643)
|
||||
- 🐞 修复 Table 同时设置 `rowSelection` 和 `onRow` 事件冒泡问题。[#22566](https://github.com/ant-design/ant-design/pull/22566) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 修复 Table 空文本没有居中的问题与空数据依然展示了分页的问题。[#22548](https://github.com/ant-design/ant-design/pull/22548) [@hengkx](https://github.com/hengkx)
|
||||
- 🐞 修复 Input 只配置 `suffix` 时的样式对齐问题。[#22603](https://github.com/ant-design/ant-design/pull/22603)
|
||||
- 🐞 修复 Alert 无法和 Tooltip/Popover 一起使用的问题。[#22594](https://github.com/ant-design/ant-design/pull/22594)
|
||||
- 🐞 修复嵌套动态 Form.Item 会被 react 警告更新移除节点的信息。[#22575](https://github.com/ant-design/ant-design/pull/22575)
|
||||
- 💄 调整 Tag `processing` 状态颜色。[#22303](https://github.com/ant-design/ant-design/pull/22303)
|
||||
- 💄 移除 Select 下拉组标题的鼠标可点击样式。[#22581](https://github.com/ant-design/ant-design/pull/22581)
|
||||
- 💄 迁移 `@form-item-label-height` less 变量到主题变量中。[#22600](https://github.com/ant-design/ant-design/pull/22600) [@slavakam](https://github.com/slavakam)
|
||||
- 💄 优化 Table 筛选菜单按钮的样式并修复 Dropdown 二级菜单的上下边距。[#22072](https://github.com/ant-design/ant-design/pull/22072)
|
||||
- 💄 新增 less 变量 `@link-focus-decoration` 和 `@link-focus-outline`。[#22511](https://github.com/ant-design/ant-design/pull/22511)
|
||||
- 💄 新增 DatePicker `disabled` 时,分隔符鼠标禁用样式。[#22563](https://github.com/ant-design/ant-design/pull/22563)
|
||||
- RTL
|
||||
- 💄 优化 CheckBox `inner` RTL 样式问题。[#22627](https://github.com/ant-design/ant-design/pull/22627)
|
||||
- 🐞 优化 Upload `picture-card` RTL 样式问题。[#22630](https://github.com/ant-design/ant-design/pull/22630)
|
||||
- 🐞 修复 Badge RTL 数字显示样式问题。[#22665](https://github.com/ant-design/ant-design/pull/22665)
|
||||
- 🐞 修复 Select RTL 多选可清空时,选项样式问题。[#22596](https://github.com/ant-design/ant-design/pull/22596)
|
||||
- 🐞 修复 Progress RTL 样式问题。[#22558](https://github.com/ant-design/ant-design/pull/22558)
|
||||
- 🐞 修复 Badge RTL 样式问题。[#22551](https://github.com/ant-design/ant-design/pull/22551)
|
||||
- 🐞 修复 Input RTL 样式问题。[#22525](https://github.com/ant-design/ant-design/pull/22525)
|
||||
- 🐞 修复 Steps RTL 样式问题。[#22523](https://github.com/ant-design/ant-design/pull/22523)
|
||||
- 💄 优化 Tabs RTL 按钮样式问题。[#22653](https://github.com/ant-design/ant-design/pull/22653)
|
||||
- 💄 优化 Input.Group RTL 样式问题。[#22624](https://github.com/ant-design/ant-design/pull/22624)
|
||||
- 💄 优化 Timeline label RTL 样式问题。[#22652](https://github.com/ant-design/ant-design/pull/22652)
|
||||
- 💄 优化 Select group RTL 样式问题。[#22584](https://github.com/ant-design/ant-design/pull/22584)
|
||||
- 💄 优化 Dropdown.Button RTL 样式问题。[#22519](https://github.com/ant-design/ant-design/pull/22519)
|
||||
- Typescript
|
||||
- 🛠 替换废弃的 `React.SFC` 为 `React.FC`。[#22691](https://github.com/ant-design/ant-design/pull/22691) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🐞 修复 Form.Item `children` 的类型定义。[#22662](https://github.com/ant-design/ant-design/pull/22662)
|
||||
|
||||
## 4.0.4
|
||||
|
||||
`2020-03-23`
|
||||
|
||||
- 🐞 修复 AutoComplete 下使用 Search 时清除图标和搜索图标重叠样式异常的问题。[#22310](https://github.com/ant-design/ant-design/pull/22310)
|
||||
- 🐞 修复 Button 为 `disabled` 时被 Tooltip 包裹时的对齐问题。[#22461](https://github.com/ant-design/ant-design/pull/22461)
|
||||
- 🐞 修复 Cascader 搜索时需要按两次向下箭头才能选中问题。[#22216](https://github.com/ant-design/ant-design/pull/22216) [@Kermit-Xuan](https://github.com/Kermit-Xuan)
|
||||
- 🐞 修复 Carousel 无法使用 Snowpack 构建的问题。[#22507](https://github.com/ant-design/ant-design/pull/22507)
|
||||
- 🐞 修复 ConfigProvider `componentSize` 对 DatePicker.RangePicker 无效的问题。[#22486](https://github.com/ant-design/ant-design/pull/22486)
|
||||
- 🐞 修复 Descriptions 在小尺寸下无法自适应的问题。[#22407](https://github.com/ant-design/ant-design/pull/22407)
|
||||
- 🐞 修复 Grid 下使用不带 `span` 的 Col 时样式错乱的问题。[#22455](https://github.com/ant-design/ant-design/pull/22455)
|
||||
- ⚡️ 优化 Form.Item 有多个 `noStyle` 子 Form.Item 时信息收集性能。[#22410](https://github.com/ant-design/ant-design/pull/22410)
|
||||
- 💄 增加 InputNumber RTL 模式样式。[#22434](https://github.com/ant-design/ant-design/pull/22434)
|
||||
- Menu
|
||||
- 🛠 Menu 继承标题的 `line-height`。[#16142](https://github.com/ant-design/ant-design/pull/16142) [@sheerun](https://github.com/sheerun)
|
||||
- 🐞 修复 Menu 子菜单展开/收起时会出现滚动条的问题。[#22248](https://github.com/ant-design/ant-design/pull/22248)
|
||||
- 🐞 修复 Progress 仪表盘状进度条传入 `gapDeg` 为 `0` 时仍然有缺口的问题。[#22462](https://github.com/ant-design/ant-design/pull/22462) [@thisrabbit](https://github.com/thisrabbit)
|
||||
- 🛠 调整 Radio.Group 逻辑,`value` 为 `undefined` 时为非受控状态。[#22245](https://github.com/ant-design/ant-design/pull/22245)
|
||||
- 💄 微调 RangePicker 箭头阴影样式。[#22406](https://github.com/ant-design/ant-design/pull/22406)
|
||||
- ⚡️ 减少 Row 在 `gutter` 是数组时非必要的额外渲染。[#22475](https://github.com/ant-design/ant-design/pull/22475) [@dolfje](https://github.com/dolfje)
|
||||
- 🐞 修复 Select 下拉菜单的上下 padding。[#22251](https://github.com/ant-design/ant-design/pull/22251)
|
||||
- 🐞 修复 Slider 使用 `nullable` 值时弹出提示会崩溃的问题。[#22482](https://github.com/ant-design/ant-design/pull/22482)
|
||||
- Table
|
||||
- 🐞 修复 Table ColumnGroup 使用受控 `sorterOrder` 无效的问题。[#22450](https://github.com/ant-design/ant-design/pull/22450)
|
||||
- 🐞 修复 Table 边框圆角样式问题。[#22413](https://github.com/ant-design/ant-design/pull/22413) [@akshatmittal](https://github.com/akshatmittal)
|
||||
- 🐞 修复 Table 固定列高度样式问题。[#22367](https://github.com/ant-design/ant-design/pull/22367)
|
||||
- 🐞 修复 Table 展开行按钮在 ipad 下的样式问题。[#22334](https://github.com/ant-design/ant-design/pull/22334) [@BugHiding](https://github.com/BugHiding)
|
||||
- 🐞 修复 Table 在只设置 `onFilter` 时过滤无效的问题。[#22317](https://github.com/ant-design/ant-design/pull/22317)
|
||||
- 🛠 Table `column.filter` 的 value 定义可以支持 `boolean`。[#22277](https://github.com/ant-design/ant-design/pull/22277) [@xudongdev](https://github.com/xudongdev)
|
||||
- 🐞 重构 DirectoryTree 以修复废弃 API 警告信息。[#22318](https://github.com/ant-design/ant-design/pull/22318)
|
||||
- 🐞 修复 TreeSelect `treeIcon` 无效的问题。[#22437](https://github.com/ant-design/ant-design/pull/22437)
|
||||
- 🐞 修复 Typography 嵌套列表的样式问题。[#22284](https://github.com/ant-design/ant-design/pull/22284)
|
||||
- 🐞 调整 Upload `onChange` 返回参数 `fileList` 为不可变数据以解决渲染问题。[#22322](https://github.com/ant-design/ant-design/pull/22322)
|
||||
- 🌎 国际化
|
||||
- 🇩🇪 更新德语国际化。[#22270](https://github.com/ant-design/ant-design/pull/22270) [@iChebbi](https://github.com/iChebbi)
|
||||
- 🇫🇷 更新法语国际化。[#22238](https://github.com/ant-design/ant-design/pull/22238) [@abenhamdine](https://github.com/abenhamdine)
|
||||
- Typescript
|
||||
- 🐞 移除 Table `getCheckboxProps` 的 `checked` 类型定义。[#22391](https://github.com/ant-design/ant-design/pull/22391) [@geekrainy](https://github.com/geekrainy)
|
||||
|
||||
## 4.0.3
|
||||
|
||||
`2020-03-14`
|
||||
|
||||
- Menu
|
||||
- 🐞 修复 Menu 水平 Item 使用嵌套结构 Icon 会丢失 `margin` 的问题。[#22021](https://github.com/ant-design/ant-design/pull/22021)
|
||||
- 💄 优化 Menu 中 Icon 的样式。[#22090](https://github.com/ant-design/ant-design/pull/22090) [@x1mrdonut1x](https://github.com/x1mrdonut1x)
|
||||
- 🐞 修复 Menu 收起模式下设置 `getPopupContainer` 时标题显示错误的问题。[#22182](https://github.com/ant-design/ant-design/pull/22182)
|
||||
- 🐞 修复 Avatar 在水平 Menu 中的 `margin` 样式问题。[#22038](https://github.com/ant-design/ant-design/pull/22038) [#22033](https://github.com/ant-design/ant-design/pull/22033)
|
||||
- Slider
|
||||
- 🐞 修复 Slider 垂直情况下拖动节点的位置错误的问题。[#22135](https://github.com/ant-design/ant-design/pull/22135) [@wendellhu95](https://github.com/wendellhu95)
|
||||
- 💄 修复 Slider 丢失的 `focus` 样式。[#22161](https://github.com/ant-design/ant-design/pull/22161)
|
||||
- Table
|
||||
- 🐞 修复 Table 筛选功能抛出 `Cannot read property 'map' of undefined` 的问题。[#22096](https://github.com/ant-design/ant-design/pull/22096) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 修复 ConfigProvider 没有作用在 Table 过滤弹框上的问题。[#22133](https://github.com/ant-design/ant-design/pull/22133)
|
||||
- 🐞 修复 Table 树形结构下展开与固定列配合的样式问题。[#22131](https://github.com/ant-design/ant-design/pull/22131)
|
||||
- 🐞 修复 Table 选择列固定时展开列不固定的问题。[#22087](https://github.com/ant-design/ant-design/pull/22087)
|
||||
- 🐞 修复 Table 过滤菜单重置失效的问题。[#22079](https://github.com/ant-design/ant-design/pull/22079)
|
||||
- 🐞 修复 Table 筛选子菜单高度溢出屏幕的问题。[#22230](https://github.com/ant-design/ant-design/pull/22230)
|
||||
- Form
|
||||
- 💄 优化 Form 的响应式和盒模型表现。[#21907](https://github.com/ant-design/ant-design/pull/21907) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 修复 FormItem 在 hooks 中报错的问题。[#22053](https://github.com/ant-design/ant-design/pull/22053) [@kagawagao](https://github.com/kagawagao)
|
||||
- 🐞 修复 Input.Group 中使用 自定义图标换行的问题。[#22197](https://github.com/ant-design/ant-design/pull/22197) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 修复 Calendar 年月选择菜单内容被省略的问题。[#22148](https://github.com/ant-design/ant-design/pull/22148)
|
||||
- 💄 调整 Select 单选框 `padding` 样式以防止下拉框内容的抖动。[#22167](https://github.com/ant-design/ant-design/pull/22167)
|
||||
- 💄 修复 Dropdown 内容和图标重叠问题。[#22098](https://github.com/ant-design/ant-design/pull/22098) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 Select 在 Firefox 下异常省略的问题。[#22101](https://github.com/ant-design/ant-design/pull/22101)
|
||||
- 🐞 移除 PageHeader 中不必要的 `overflow: hidden` 样式以修复弹层隐藏问题,优化 PageHeader 右侧按钮的响应式表现。[#22030](https://github.com/ant-design/ant-design/pull/22030)
|
||||
- 🐞 修复 Radio 组无法正确换行的问题。[#22229](https://github.com/ant-design/ant-design/pull/22229)
|
||||
- 🐞 修复 TextArea `autoSize` 时在 Firefox 下不会自动滚动到底的问题。[#22014](https://github.com/ant-design/ant-design/pull/22014)
|
||||
- 🇫🇷 补全的 fr_FR 国际化文本。[#22122](https://github.com/ant-design/ant-design/pull/22122) [@PaulJln](https://github.com/PaulJln)
|
||||
- RTL
|
||||
- 💄 优化 Pagination 在 RTL 模式下的样式。[#22155](https://github.com/ant-design/ant-design/pull/22155) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 修复 Cascader RTL 模式下 icon 样式的错误的问题。[#22191](https://github.com/ant-design/ant-design/pull/22191) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 优化 Checkbox.Group 在 RTL 模式下样式。[#22186](https://github.com/ant-design/ant-design/pull/22186) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 优化 Radio.Button 在 RTL 模式下样式问题。[#22066](https://github.com/ant-design/ant-design/pull/22066) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 优化 Table 固定列在 RTL 下的样式问题。[#21914](https://github.com/ant-design/ant-design/pull/21914) [@saeedrahimi](https://github.com/saeedrahimi)
|
||||
- 💄 调整 Dropdown 在 RTL 模式的下拉图标方向。[#22104](https://github.com/ant-design/ant-design/pull/22104) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 优化 Breadcrumb 在 RTL 模式下样式。[#22159](https://github.com/ant-design/ant-design/pull/22159) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 优化 Steps 组件在 RTL 模式下的样式。[#22175](https://github.com/ant-design/ant-design/pull/22175) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 优化表单反馈下在 RTL 模式下的样式。[#22222](https://github.com/ant-design/ant-design/pull/22222)
|
||||
- TypeScript
|
||||
- 🔷 更新 FormList 的 `operation` 类型定义。[#22058](https://github.com/ant-design/ant-design/pull/22058) [@kagawagao](https://github.com/kagawagao)
|
||||
- 🔷 更新 Tooltip 等组件的 `trigger` 参数的定义。[#22043](https://github.com/ant-design/ant-design/pull/22043) [@wendellhu95](https://github.com/wendellhu95)
|
||||
|
||||
## 4.0.2
|
||||
|
||||
`2020-03-08`
|
||||
|
||||
- Form
|
||||
- 🐞 修复嵌套 Form.Item 移除会导致 React 报警告的问题。[#21896](https://github.com/ant-design/ant-design/pull/21896)
|
||||
- ⚡️ `Form.useForm` 现在将返回相同的实例以优化重复渲染的问题。[#21927](https://github.com/ant-design/ant-design/pull/21927)
|
||||
- ⚡️ 重构 Form.Item 渲染逻辑以使其子元素为纯组件时值变更只会渲染一次。[#21991](https://github.com/ant-design/ant-design/pull/21991)
|
||||
- ⚡️ FormContext 使用 memoized 值避免 Form.Item 产生额外的渲染。[#21980](https://github.com/ant-design/ant-design/pull/21980) [@qiqiboy](https://github.com/qiqiboy)
|
||||
- Table
|
||||
- 🐞 修复 Table 内浮层组件弹出方向异常的问题。[#21905](https://github.com/ant-design/ant-design/pull/21905)
|
||||
- 🐞 修复 Table `className` 和 `style` 作用在了错误的元素上的问题。[#21974](https://github.com/ant-design/ant-design/pull/21974)
|
||||
- 🐞 修复 Table `expandIconColumnIndex` 与 `rowSelection` 共用时的展示顺序问题。[#21915](https://github.com/ant-design/ant-design/pull/21915)
|
||||
- 🐞 修复 Table `size="small"` 时表头颜色和其他尺寸不一致的问题。[#21942](https://github.com/ant-design/ant-design/pull/21942)
|
||||
- Select
|
||||
- 🐞 修复 Select 在空字符串值时的样式对齐问题。[#21880](https://github.com/ant-design/ant-design/pull/21880)
|
||||
- 🐞 修复小号 Select 在多选模式下 `tag` 文字不居中的问题。[#21940](https://github.com/ant-design/ant-design/pull/21940) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- Menu
|
||||
- 🐞 修复 Menu 弹出菜单底部边距丢失的问题。[#21867](https://github.com/ant-design/ant-design/pull/21867)
|
||||
- 🐞 修复 Menu 水平模式下 Menu.Item 只有一个 Icon 时仍然有额外 `margin` 的问题。[#21925](https://github.com/ant-design/ant-design/pull/21925)
|
||||
- 🐞 修复 Menu 弹出菜单超出屏幕高度的问题。[#21930](https://github.com/ant-design/ant-design/pull/21930)
|
||||
- 🐞 修复 Badge 数字在 10 和 11 切换时的动画错误。[#21834](https://github.com/ant-design/ant-design/pull/21834) [@wendellhu95](https://github.com/wendellhu95)
|
||||
- 🐞 修复 Radio.Button 上使用 Tooltip 会报 `Function components cannot be given refs` 警告。[#21895](https://github.com/ant-design/ant-design/pull/21895)
|
||||
- 🐞 修复 Descriptions 内容为 falsy 值时样式丢失的问题。[#21901](https://github.com/ant-design/ant-design/pull/21901)
|
||||
- 🐞 修复 DatePicker 在分隔符上的鼠标手型。[#21937](https://github.com/ant-design/ant-design/pull/21937) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 ConfigProvider `prefixCls` 在 Input.Password 上不生效的问题。[#21953](https://github.com/ant-design/ant-design/pull/21953) [@tdida](https://github.com/tdida)
|
||||
- 🐞 修复 Carousel `dots` 控件不居中的问题。[#21960](https://github.com/ant-design/ant-design/pull/21960) [@liusiasi](https://github.com/liusiasi)
|
||||
- 🐞 修复 Input.Search 边框高亮样式在 `rtl` 模式下丢失的问题。[#21946](https://github.com/ant-design/ant-design/pull/21946) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- Less
|
||||
- 🆕 新增 `@outline-fade` 变量。[#20227](https://github.com/ant-design/ant-design/pull/20227) [@Satloff](https://github.com/Satloff)
|
||||
- 🆕 新增 `@form-item-label-height` 变量。[#21912](https://github.com/ant-design/ant-design/pull/21912)
|
||||
- TypeScript
|
||||
- 🌟 增强 Form.Item `renderProps` 定义。[#21911](https://github.com/ant-design/ant-design/pull/21911)
|
||||
|
||||
## 4.0.1
|
||||
|
||||
`2020-03-04`
|
||||
|
||||
- Form
|
||||
- 🐞 修复 Form help 受控时会导致 `react@16.13` 报警告的问题。[#21800](https://github.com/ant-design/ant-design/pull/21800) [#21702](https://github.com/ant-design/ant-design/pull/21702)
|
||||
- 🐞 修复 Form.Item 宽度在内容过长时会超出 Form 的样式问题。[#21682](https://github.com/ant-design/ant-design/pull/21682)
|
||||
- Input
|
||||
- 🐞 修复 TextArea 样式在 `react@16.13` 下会报警告的问题。[#21703](https://github.com/ant-design/ant-design/pull/21703)
|
||||
- 🐞 修复 Input.Search 有 `prefix` 时的右边框样式问题。[#21753](https://github.com/ant-design/ant-design/pull/21753)
|
||||
- Table
|
||||
- 🐞 修复 Table column 的 `filtered` 属性无效的问题。[#21825](https://github.com/ant-design/ant-design/pull/21825)
|
||||
- 🐞 修复 Table `locale` 无效的问题。[#21772](https://github.com/ant-design/ant-design/pull/21772)
|
||||
- 🐞 修复 Table.Column `sortOrder` 在 JSX 模式下无效的问题。[#21719](https://github.com/ant-design/ant-design/pull/21719)
|
||||
- 🐞 修复 Table 固定列在排序状态时的样式问题。[#21679](https://github.com/ant-design/ant-design/pull/21679)
|
||||
- 🐞 修复 Dropdown 菜单里箭头图标的位置。[#21768](https://github.com/ant-design/ant-design/pull/21768) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 List 组件 `bordered` 和 `split` 属性冲突的问题。[#21784](https://github.com/ant-design/ant-design/pull/21784) [@MXWXZ](https://github.com/MXWXZ)
|
||||
- 🐞 修复 Menu.Item 中 `a` 标签换行无法显示的问题。[#21699](https://github.com/ant-design/ant-design/pull/21699) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 修复 `message.open` 中 `icon` 为空时报错的问题。[#21747](https://github.com/ant-design/ant-design/pull/21747) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复 Result `status` 属性不能赋值 string 或者 number 类型的问题。[#21691](https://github.com/ant-design/ant-design/pull/21691)
|
||||
- 🐞 修复 Descriptions 报 `key` 重复的警告信息。[#21688](https://github.com/ant-design/ant-design/pull/21688)
|
||||
- 💄 优化 Calendar 在窄屏幕下的标题样式。[#21813](https://github.com/ant-design/ant-design/pull/21813)
|
||||
- 💄 Radio.Group 不再折行。[#21813](https://github.com/ant-design/ant-design/pull/21813)
|
||||
- 🛠 重构 icons 导入代码以降低没有开启 tree shaking 的打包尺寸。[#21752](https://github.com/ant-design/ant-design/pull/21752)
|
||||
- Typescript
|
||||
- 🐞 修复 Radio.Button 的类型定义。[#21807](https://github.com/ant-design/ant-design/pull/21807) [@jhoneybee](https://github.com/jhoneybee)
|
||||
- 🐞 修复了 `TreeSelect.SHOW_*` 的类型问题。[#21791](https://github.com/ant-design/ant-design/pull/21791) [@TennyZhuang](https://github.com/TennyZhuang)
|
||||
- 🐞 修复 TreeSelect 缺失 `suffix` 定义。[#21714](https://github.com/ant-design/ant-design/pull/21714)
|
||||
- 🐞 修复 Drawer `forceRender` 的 TypeScript 定义。[#21774](https://github.com/ant-design/ant-design/pull/21774)
|
||||
- 🐞 修复 Tree `treeData` 定义。[#21756](https://github.com/ant-design/ant-design/pull/21756)
|
||||
- 🐞 修复 Form.Item `renderProps` 的类型定义。[#21716](https://github.com/ant-design/ant-design/pull/21716)
|
||||
|
||||
## 4.0.0
|
||||
|
||||
`2020-02-28`
|
||||
|
||||
- 🏆 Ant Design v4 发布!点击[此处](https://github.com/ant-design/ant-design/issues/21656)查看更多信息。
|
||||
- 🐞 Breadcrumb 使用 `path` 作为默认 key 以修复 `name` 作为 key 重名的冲突问题。[#21583](https://github.com/ant-design/ant-design/pull/21583) [@douxc](https://github.com/douxc)
|
||||
- 🌟 Timeline.Item 支持 `label`。[#21560](https://github.com/ant-design/ant-design/pull/21560) [@shaodahong](https://github.com/shaodahong)
|
||||
- 🐞 修复 Table 筛选菜单高度溢出屏幕的问题。[#21602](https://github.com/ant-design/ant-design/pull/21602)
|
||||
- 💄 增加 Calendar 组件自定义显示内容的默认字体颜色。[#21598](https://github.com/ant-design/ant-design/pull/21598) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🚮 移除 DatePicker 针对自定义单元格的 3.x 的兼容类名。[#21589](https://github.com/ant-design/ant-design/pull/21589)
|
||||
- 🐞 修复 RangePicker 在 IE11 下的样式渲染问题。[#21587](https://github.com/ant-design/ant-design/pull/21587)
|
||||
- 🛠 Progress 中 `strokeColor` 属性现在会忽略错误的百分比参数。[#21564](https://github.com/ant-design/ant-design/pull/21564) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复 Progress `trailColor` 属性在 `type=line` 时无效果的问题。[#21552](https://github.com/ant-design/ant-design/pull/21552) [@AshoneA](https://github.com/AshoneA)
|
||||
- 🐞 修复暗色主题下,组件在弹出层组件下的背景样式问题。[#21299](https://github.com/ant-design/ant-design/pull/21299)
|
||||
- 💄 优化暗色主题下色板透明度。
|
||||
- 🌟 新增 less 变量 `@popover-customize-border-color`、`@list-customize-card-bg`、`@table-expand-icon-bg`、`@steps-background`、`@pagination-item-input-bg` 用于主题定制。
|
||||
|
||||
## 4.0.0-rc.6
|
||||
|
||||
`2020-02-24`
|
||||
|
||||
- Form
|
||||
- 🌟 支持 `scrollToFirstError` 属性以简化提交表单滚动到错误字段的编码量。[#21462](https://github.com/ant-design/ant-design/pull/21462)
|
||||
- 🐞 修复 Form.Item 设置 `help` 时的样式问题。[#21476](https://github.com/ant-design/ant-design/pull/21476)
|
||||
- 🐞 修复 Form 和 BraftEditor 同时使用时抛错的问题。[#21425](https://github.com/ant-design/ant-design/pull/21425)
|
||||
- 🐞 修复 Form 验证信息切换时表单项抖动。[#21302](https://github.com/ant-design/ant-design/pull/21302) [@yoyo837](https://github.com/yoyo837)
|
||||
- Upload
|
||||
- 🌟 Upload 组件 `showUploadList` 新增 `removeIcon` 和 `downloadIcon` 属性。[#21363](https://github.com/ant-design/ant-design/pull/21363) [@sdhr27](https://github.com/sdhr27)
|
||||
- 🐞 修复 Upload 识别图片类型逻辑错误。[#21473](https://github.com/ant-design/ant-design/pull/21473) [@holynewbie](https://github.com/holynewbie)
|
||||
- 💄 优化 Upload `showDownloadIcon` 默认不展示。[b4636](https://github.com/ant-design/ant-design/commit/b4636ab2dfdb006c14bdb3d5d7de09e1650c3567)
|
||||
- Input
|
||||
- 🐞 修复 Input 在设置 `readOnly` 时 `allowClear` 仍然可以清除的问题。[#21494](https://github.com/ant-design/ant-design/pull/21494)
|
||||
- 🐞 修复 Input 点击 `prefix` / `suffix` 不会获得焦点的问题。[#21413](https://github.com/ant-design/ant-design/pull/21413)
|
||||
- Table
|
||||
- 🐞 修复 Table 选择在树形结构子节点为 `null` 会崩溃的问题。[#21528](https://github.com/ant-design/ant-design/pull/21528)
|
||||
- 🐞 修复 Table 在 `small` 尺寸下固定列的样式问题。[#21431](https://github.com/ant-design/ant-design/pull/21431)
|
||||
- Descriptions
|
||||
- 🐞 修复非 `bordered` 时,`label` 不存在仍然会渲染 label 元素的问题。[#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 修复 `vertical` 下且非 `bordered` 标题也是 `td` 的问题。[#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 修复 `vertical` 且 `bordered` 布局混乱的问题。[#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 修复 `style` 无法作用于 `Item` 的问题。[#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🐞 修复 `border` 下 `th` 还会额外获得无用的 `-colon` className 的问题。[#21542](https://github.com/ant-design/ant-design/pull/21542)
|
||||
- 🌟 Select 增加 `tagRender` 支持自定义 tag 内容。[#21064](https://github.com/ant-design/ant-design/pull/21064) [@fguitton](https://github.com/fguitton)
|
||||
- 💄 调整 Picker 的 `onPanelChange` 在面板值变化时也会触发。[#21455](https://github.com/ant-design/ant-design/pull/21455)
|
||||
- 🐞 修复 Notification 第一次重复调用无法堆叠的问题。[#21531](https://github.com/ant-design/ant-design/pull/21531)
|
||||
- 🐞 修复 TreeSelect 弹出层不更新的问题。[#21410](https://github.com/ant-design/ant-design/pull/21410)
|
||||
- 💄 优化 Divider 内嵌文字的默认 `padding`,并新增 `@divider-text-padding` 变量。[#21407](https://github.com/ant-design/ant-design/pull/21407)
|
||||
- Typescript
|
||||
- 🐞 修复 Form 组件类型。[#21483](https://github.com/ant-design/ant-design/pull/21483) [#21411](https://github.com/ant-design/ant-design/pull/21411)
|
||||
|
||||
## 4.0.0-rc.5
|
||||
|
||||
`2020-02-16`
|
||||
|
||||
- 🐞 修复 Form.Item 设置 `validateFirst` 导致表单无法提交的问题。[#21329](https://github.com/ant-design/ant-design/pull/21329)
|
||||
- 🐞 解决了 InputNumber 删除连续相同数字时的光标位置问题。[#21344](https://github.com/ant-design/ant-design/pull/21344)
|
||||
- 💄 Menu 移除掉多余的背景色。[#21365](https://github.com/ant-design/ant-design/pull/21365)
|
||||
- 💄 优化 DatePicker 组件 `disabled` 状态的鼠标样式。[#21352](https://github.com/ant-design/ant-design/pull/21352)
|
||||
- 🐞 修复 Affix 在移动设备下抛错 `Cannot read property getBoundingClientRect` 的问题。[#21350](https://github.com/ant-design/ant-design/pull/21350)
|
||||
- 🐞 修复 Form 在屏幕小于 `xs` 时标签宽度不正确的问题。[#21222](https://github.com/ant-design/ant-design/pull/21222)
|
||||
- 🐞 修复 Input 在 `size` 为 `large` 时的高度问题。[#21338](https://github.com/ant-design/ant-design/pull/21338)
|
||||
- 🐞 修复 Badge 包裹模式下 `color` 属性失效的问题。[#21333](https://github.com/ant-design/ant-design/pull/21333)
|
||||
- 🐞 修复 Alert 关闭按钮额外的 `padding`。[#21325](https://github.com/ant-design/ant-design/pull/21325)
|
||||
- 💄 微调 Steps 文本 1px 使其居中对齐。[#21306](https://github.com/ant-design/ant-design/pull/21306)
|
||||
- 💄 修复遗留的 Button.Group `large` 尺寸的样式问题。[#21307](https://github.com/ant-design/ant-design/pull/21307)
|
||||
- 💄 修正 TextArea `allowClear` 中的输入边框半径的样式问题和 Input `suffix` 在 Firefox 下的样式问题。[#21316](https://github.com/ant-design/ant-design/pull/21316)
|
||||
- 🐞 Pagination 自定义 `itemRender` 返回的上一页下一页现在会补充 `disabled` 属性。[#21361](https://github.com/ant-design/ant-design/pull/21361)
|
||||
- 🇦🇿 添加了阿塞拜疆语翻译。[#21387](https://github.com/ant-design/ant-design/pull/21387) [@orkhan-huseyn](https://github.com/orkhan-huseyn)
|
||||
- Typescript
|
||||
- 🔷 Menu 导出 `MenuItemGroupProps`。[#21356](https://github.com/ant-design/ant-design/pull/21356)
|
||||
- 🔷 Table 导出 `ColumnProps`。[#21321](https://github.com/ant-design/ant-design/pull/21321)
|
||||
|
||||
## 4.0.0-rc.4
|
||||
|
||||
`2020-02-09`
|
||||
|
||||
- 📖 官网提供了暗色模式下的 [色板](https://preview-21101-ant-design.surge.sh/docs/spec/dark-cn#%E5%9F%BA%E7%A1%80%E8%89%B2%E6%9D%BF) 和 [色板生成工具](https://preview-21101-ant-design.surge.sh/docs/spec/dark-cn#%E8%89%B2%E6%9D%BF%E7%94%9F%E6%88%90%E5%B7%A5%E5%85%B7)。[#21101](https://github.com/ant-design/ant-design/pull/21101)
|
||||
- 🌟 Checkbox.Group 和 Radio.Group 的 `options` 属性中新增 `style` 字段,用于设置可选项的样式。[#21219](https://github.com/ant-design/ant-design/pull/21219)
|
||||
- 🌟 Form.Item 新增 `validateFirst` 属性,用于设置当某一规则校验不通过时,是否停止剩下规则的校验。[#21178](https://github.com/ant-design/ant-design/pull/21178)
|
||||
- 🌟 Modal 新增 `useModal` hook,以支持 `context` 访问。[#20949](https://github.com/ant-design/ant-design/pull/20949)
|
||||
- 🌟 Notification 新增 `useNotification` hook,以支持 `context` 访问。[#21275](https://github.com/ant-design/ant-design/pull/21275)
|
||||
- 🌟 Select、TreeSelect、DatePicker、TimePicker 和 Cascader 新增 `bordered` 属性,用于设置组件是否有边框。[#21242](https://github.com/ant-design/ant-design/pull/21242)
|
||||
- 🌟 Transfer 新增 `selectAllLabels` 属性,用于自定义头部选择框的文案。[#21139](https://github.com/ant-design/ant-design/pull/21139) [@morenyang](https://github.com/morenyang)
|
||||
- 💄 重新设计了 Tabs 火柴棍的样式。[#21256](https://github.com/ant-design/ant-design/pull/21256)
|
||||
- 💄 新增 `@form-item-label-font-size` less 变量。[#21216](https://github.com/ant-design/ant-design/pull/21216)
|
||||
- 🐞 修复 Badge 在 Typography 下数字错位的问题。[#21235](https://github.com/ant-design/ant-design/pull/21235)
|
||||
- 🐞 修复 Checkbox 和 Checkbox.Group 之间被其他组件隔断时多选框无法选中的问题。[#21146](https://github.com/ant-design/ant-design/pull/21146) [@morenyang](https://github.com/morenyang)
|
||||
- 🐞 修复 Collapse.Panel 设置了 `extra` 属性时内容宽度变窄的问题。[#21202](https://github.com/ant-design/ant-design/pull/21202) [@zhiyuc123](https://github.com/zhiyuc123)
|
||||
- Form
|
||||
- 🐞 修复 Form.Item 没有设置 `name` 属性时必填校验不生效的问题。[#21168](https://github.com/ant-design/ant-design/pull/21168)
|
||||
- 🐞 修复 Form.Item 的 `name` 属性为 `0` 时数据绑定不生效的问题。[#21186](https://github.com/ant-design/ant-design/pull/21186) [@wanjas](https://github.com/wanjas)
|
||||
- 🐞 修复 Form.Item 的 `help` 属性从有到无时会造成布局抖动的问题。[#21211](https://github.com/ant-design/ant-design/pull/21211)
|
||||
- Input
|
||||
- 🐞 修复设置了前缀时校验样式不正确的问题。[#21121](https://github.com/ant-design/ant-design/pull/21121)
|
||||
- 🐞 修复设置了前缀或后缀时 `size` 属性不生效的问题。[#21290](https://github.com/ant-design/ant-design/pull/21290) [@yoyo837](https://github.com/yoyo837)
|
||||
- 🐞 修复 Radio.Group 中使用 Badge 的样式问题。[#21215](https://github.com/ant-design/ant-design/pull/21215)
|
||||
- 🐞 修复 Select 在多选或标签模式下上下行之间没有外间距的问题。[#21175](https://github.com/ant-design/ant-design/pull/21175)
|
||||
- 🐞 修复 Slider 的锚点聚焦样式错误的问题。[#21244](https://github.com/ant-design/ant-design/pull/21244) [@Kermit-Xuan](https://github.com/Kermit-Xuan)
|
||||
- 🐞 修复 Steps 在 `size="small"` 和 `labelPlacement="vertical"` 时图标没有对齐的问题。[#21258](https://github.com/ant-design/ant-design/pull/21258)
|
||||
- Table
|
||||
- 🐞 修复数据项没有 `children` 字段时 `expandIcon` 属性不生效的问题。[#21169](https://github.com/ant-design/ant-design/pull/21169)
|
||||
- 🐞 修复 Column 的 `sorter` 属性不生效的问题。[#21194](https://github.com/ant-design/ant-design/pull/21194)
|
||||
- 🐞 修复自定义筛选无法输入的问题。[#21218](https://github.com/ant-design/ant-design/pull/21218)
|
||||
- 🐞 修复 TimePicker 的 `defaultOpenValue` 属性不生效的问题。[#21198](https://github.com/ant-design/ant-design/pull/21198)
|
||||
- Transfer
|
||||
- 🐞 修复头部选择框文案的单位展示不正确的问题。[#21136](https://github.com/ant-design/ant-design/pull/21136) [@morenyang](https://github.com/morenyang)
|
||||
- 🐞 修复搜索框中的搜索图标没有垂直居中的问题。[#21247](https://github.com/ant-design/ant-design/pull/21247)
|
||||
- 🐞 修复 Typography 在可编辑状态时光标没有在输入框末尾的问题。[#21268](https://github.com/ant-design/ant-design/pull/21268)
|
||||
|
||||
## 4.0.0-rc.3
|
||||
|
||||
`2020-01-27`
|
||||
|
||||
- 🛠 移除 Countdown 组件的 `moment` 依赖。[#21108](https://github.com/ant-design/ant-design/pull/21108) [@morenyang](https://github.com/morenyang)
|
||||
- 🐞 修复 Input `suffix / prefix` 样式与 `addonBefore / addonAfter` 冲突的问题。[#21105](https://github.com/ant-design/ant-design/pull/21105)
|
||||
- 💄 完善 Timeline 组件 RTL 模式下的样式。[#21068](https://github.com/ant-design/ant-design/pull/21068) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 💄 更新基本样式 `clearfix` 移除过时的 `zoom` 属性。[#21109](https://github.com/ant-design/ant-design/pull/21109) [@morenyang](https://github.com/morenyang)
|
||||
- 💄 Card 组件使用 `@font-size-base` 变量以代替固定的 `14px`。[#21107](https://github.com/ant-design/ant-design/pull/21107) [@morenyang](https://github.com/morenyang)
|
||||
- 💄 调整 Layout 组件传入的 `className` 到最后以提高其优先级。[#21074](https://github.com/ant-design/ant-design/pull/21074) [@yoyo837](https://github.com/yoyo837)
|
||||
- Typescript
|
||||
- 🐞 修复 Tree 中 AntTreeNodeMouseEvent 的定义问题。[#21102](https://github.com/ant-design/ant-design/pull/21102) [@Jirka-Lhotka](https://github.com/Jirka-Lhotka)
|
||||
- 🐞 修复 Form.Item 返回的类型定义。[#21067](https://github.com/ant-design/ant-design/pull/21067)
|
||||
|
||||
## 4.0.0-rc.2
|
||||
|
||||
`2020-01-21`
|
||||
|
||||
- 🛠 部分演示改写成 React hooks 和 TypeScript。[#21045](https://github.com/ant-design/ant-design/pull/21045)
|
||||
- 🐞 修复 Input/Select 等组件的 `1px` 对齐问题。[#20869](https://github.com/ant-design/ant-design/pull/20869)
|
||||
- Dropdown
|
||||
- 🆕 新增 `buttonsRender` 用于定制按钮,如给左侧按钮增加 Tooltip。[#20815](https://github.com/ant-design/ant-design/pull/20815)
|
||||
- 🐞 修复禁用的 Dropdown.Button 在 Chrome 下 Tooltip 不会消失的问题。[#20960](https://github.com/ant-design/ant-design/pull/20960)
|
||||
- Input
|
||||
- 🐞 修复 Input `prefix` 和 `suffix` 和输入内容重叠的问题。[#20872](https://github.com/ant-design/ant-design/pull/20872)
|
||||
- 🐞 修复 Input `placeholder` 在 Firefox 下的颜色问题。[#20850](https://github.com/ant-design/ant-design/issues/20850)
|
||||
- Table
|
||||
- 🐞 修复 `onChange` 返回缓存排序、过滤状态的问题。[#20858](https://github.com/ant-design/ant-design/pull/20858)
|
||||
- 🐞 修复全选在所有选项为禁用时为勾选状态的问题。[#20968](https://github.com/ant-design/ant-design/pull/20968)
|
||||
- 🐞 修复 `locale.emptyText` 不生效的问题。[#21024](https://github.com/ant-design/ant-design/pull/21024)
|
||||
- Select
|
||||
- 🐞 修复 `placeholder` 的换行和对齐问题。[#20883](https://github.com/ant-design/ant-design/pull/20883) [#20884](https://github.com/ant-design/ant-design/pull/20884)
|
||||
- 🐞 修复多选 Select 的左边距。[#20861](https://github.com/ant-design/ant-design/pull/20861)
|
||||
- 🐞 修复多选 Select 清除按钮和选项重叠的问题。[#20914](https://github.com/ant-design/ant-design/pull/20914)
|
||||
- Form
|
||||
- 🆕 `scrollToField` 方法支持传入滚动相关参数。[#20774](https://github.com/ant-design/ant-design/pull/20774)
|
||||
- 🐞 修复 Form.Item 改变 `help` 会导致布局闪动的问题。[#20886](https://github.com/ant-design/ant-design/pull/20886)
|
||||
- 🐞 修复 Form.Item 即便不是一个真正的 Field 也会触发重新渲染的问题。[#20963](https://github.com/ant-design/ant-design/pull/20963)
|
||||
- 🐞 修复 Form.Item 不处理 `help=""` 的问题。[#21026](https://github.com/ant-design/ant-design/pull/21026)
|
||||
- 🐞 修复 Form.Item `label` 在屏幕小于 xs 并且 `span` 不是 24 的时候对齐不正确。[#20836](https://github.com/ant-design/ant-design/issues/20836)
|
||||
- 🐞 修复 message 隐藏时阴影切边的问题。[#20856](https://github.com/ant-design/ant-design/issues/20856)
|
||||
- 🐞 修复 Tooltip `title` 为 `0` 时没有显示问题。[#20894](https://github.com/ant-design/ant-design/pull/20894)
|
||||
- 🐞 修复 List `actions` 位置不在右边的问题。[#20897](https://github.com/ant-design/ant-design/pull/20897)
|
||||
- 🆕 新增一个 Tree 的虚拟滚动演示。[#20911](https://github.com/ant-design/ant-design/pull/20911)
|
||||
- 🐞 修复 AutoComplete 演示样式错位的问题。[#20946](https://github.com/ant-design/ant-design/pull/20946)
|
||||
- 🗑 移除掉 AutoComplete 中无用的 `labelInValue` 定义。[#20967](https://github.com/ant-design/ant-design/pull/20967)
|
||||
- 🐞 修复 Drawer 组件添加 `footerStyle` 属性后控制台报错。[#20983](https://github.com/ant-design/ant-design/pull/20983)
|
||||
- 🐞 修复 Breadcrumb 在 `rtl` 模式下的样式问题。[#21054](https://github.com/ant-design/ant-design/pull/21054)
|
||||
- 💄 调整 Layout `className` 的顺序到最后。[#21041](https://github.com/ant-design/ant-design/pull/21041)
|
||||
- TypeScript
|
||||
- 🐞 开放 DatePicker 的相关接口定义。[#20900](https://github.com/ant-design/ant-design/pull/20900)
|
||||
- Less 变量
|
||||
- 🆕 重新加回 `@border-radius-sm` 变量。[#20818](https://github.com/ant-design/ant-design/pull/20818)
|
||||
- 🆕 新增 `@timeline-item-padding-bottom` 变量。[#21013](https://github.com/ant-design/ant-design/pull/21013)
|
||||
- 🆕 新增 `@layout-header-color` 变量。[#21033](https://github.com/ant-design/ant-design/pull/21033)
|
||||
|
||||
## 4.0.0-rc.1
|
||||
|
||||
`2020-01-11`
|
||||
|
||||
- 🌟 Drawer 增加 `footer` 及 `footerStyle` 属性。[#20690](https://github.com/ant-design/ant-design/pull/20690) [@DeanVanNiekerk](https://github.com/DeanVanNiekerk)
|
||||
- 🌟 Switch 增加 `@switch-min-width` 和 `@switch-sm-min-width` less 变量。[#20829](https://github.com/ant-design/ant-design/pull/20829) [@abdih](https://github.com/abdih)
|
||||
- Table
|
||||
- 🐞 修复在 `expandRowByClick` 下展开 Icon 点击失效。[#20808](https://github.com/ant-design/ant-design/pull/20808)
|
||||
- 🐞 修复在缩放下的展开行宽度样式。[#20805](https://github.com/ant-design/ant-design/pull/20805)
|
||||
- 🐞 修复背景色优先级高导致用户自定义样式被覆盖的问题。[#20794](https://github.com/ant-design/ant-design/pull/20794)
|
||||
- 🐞 修复在 `rowSelection` 下 `fixed` 属性失效。[#20735](https://github.com/ant-design/ant-design/pull/20735)
|
||||
- 🐞 修复固定列在 Chrome 下放大时出现纵向滚动条问题。[#20705](https://github.com/ant-design/ant-design/pull/20705)
|
||||
- 🐞 修复 `columns` 为空时 Table 报错问题。[#20703](https://github.com/ant-design/ant-design/pull/20703)
|
||||
- 💄 优化 Calendar 基本样式月份下拉框宽度、通知事项的文字顺序以及卡片模式,选择框的尺寸。[#20790](https://github.com/ant-design/ant-design/pull/20790) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- DatePicker
|
||||
- 💄 优化圆角连接处 `border-radius`。[#20736](https://github.com/ant-design/ant-design/pull/20736)
|
||||
- 🐞 修复选中样式重叠。[#20736](https://github.com/ant-design/ant-design/pull/20736)
|
||||
- 🐞 修复底部额外分割线。[#20736](https://github.com/ant-design/ant-design/pull/20736)
|
||||
- 🐞 修复预设范围的按钮样式。[#20760](https://github.com/ant-design/ant-design/pull/20760) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 Input 值为 `undefined` 时不能输入的问题。[#20783](https://github.com/ant-design/ant-design/pull/20783)
|
||||
- 🐞 修复 Carousel 组件 left/right 模式下卡片轮播方向。[#20781](https://github.com/ant-design/ant-design/pull/20781) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 Grid 响应式 gutter 在 SSR 下初始值为 `0` zIndex 的问题。[#20762](https://github.com/ant-design/ant-design/pull/20762)
|
||||
- 🐞 修复 InputNumber、Select、Table 等组件的图标大小问题。[#20765](https://github.com/ant-design/ant-design/pull/20765)
|
||||
- 🐞 修复 Badge 在 Table 固定列中穿透的问题。[#20751](https://github.com/ant-design/ant-design/pull/20751)
|
||||
- 💄 微调默认字体和 tailwindcss 一致。[#20747](https://github.com/ant-design/ant-design/pull/20747)
|
||||
- 🐞 修复 TextArea `autoSize` 在 FireFox 浏览器下闪烁问题。[#20737](https://github.com/ant-design/ant-design/pull/20737)
|
||||
- 🐞 修复 Form.Item 动态校验下错误提示不同步的问题。[#20725](https://github.com/ant-design/ant-design/pull/20725)
|
||||
- 🐞 修复 Form.Item 不设置 `hasFeedback` 时校验,图标闪动问题。[#20691](https://github.com/ant-design/ant-design/pull/20691)
|
||||
- 🐞 修复 Cascader `fieldNames` 中 `label` 和 `value` 共用一个值时搜索功能失效的问题。[#20720](https://github.com/ant-design/ant-design/pull/20720)
|
||||
- 🐞 修复 Collapse 背景使用错误的 less 变量。[#20718](https://github.com/ant-design/ant-design/pull/20718) [@kuitos](https://github.com/kuitos)
|
||||
- 🐞 修复 Slider 中 Tooltip 不跟随鼠标的问题。[#20699](https://github.com/ant-design/ant-design/pull/20699)
|
||||
- 🐞 修复 Card 封面图片被拉伸的问题。[#20701](https://github.com/ant-design/ant-design/pull/20701)
|
||||
- 🐞 修复 Typography 使用 `suffix` 属性时溢出问题。[#20689](https://github.com/ant-design/ant-design/pull/20689) [@zouxiaomingya](https://github.com/zouxiaomingya)
|
||||
- 🐞 修复 AutoComplete 下使用 Input 时的样式错误。[#20686](https://github.com/ant-design/ant-design/pull/20686)
|
||||
- 🐞 修复 Form 下 Input.Group 偏上一像素的问题。[#20681](https://github.com/ant-design/ant-design/pull/20681)
|
||||
- TypeScript
|
||||
- 🐞 导出 Form 接口类型。[3a1c5](https://github.com/ant-design/ant-design/commit/3a1c51010fecfa59f63f5e09027805a141e9ec11)
|
||||
- 🐞 修复 Table 类型缺失。[#20789](https://github.com/ant-design/ant-design/pull/20789)
|
||||
- 🐞 修复 Table.Column 及 Table.ColumnGroup 定义。[#20695](https://github.com/ant-design/ant-design/pull/20695)
|
||||
|
||||
## 4.0.0-rc.0
|
||||
|
||||
`2020-01-04`
|
||||
|
||||
Ant Design 4.0-rc 发布,发布文档请查看[此处](https://github.com/ant-design/ant-design/issues/20661)。
|
||||
|
||||
⚠️ 从 v3 迁移到 v4 请参考[迁移文档](/docs/react/migration-v4)。
|
||||
|
||||
### 新增功能及改进
|
||||
|
||||
- 🌟 antd 打包尺寸优化,js gzipped 从 532.75KB 下降到 289.89 KB。[#20356](https://github.com/ant-design/ant-design/pull/20356)
|
||||
- 💄 新增黑暗主题支持。[#20281](https://github.com/ant-design/ant-design/pull/20281)
|
||||
- 🌟 ConfigProvider 支持 `direction` 国际化设置 `rtl`。[#19380](https://github.com/ant-design/ant-design/pull/19380)
|
||||
- 🌟 全新 Form 组件。[#17327](https://github.com/ant-design/ant-design/pull/17327)
|
||||
- 🌟 Form 组件自带数据绑定功能。
|
||||
- 🌟 字段值改动只会影响相关组件的渲染而非整个 Form。
|
||||
- 🌟 新增 `initialValues` 以代替原 field 初始化字段。
|
||||
- 🌟 新增 `validateMessages` 以支持修改校验模板。
|
||||
- 🌟 新增 `onFinish` 与 `onFinishFailed` 完成整体组件校验逻辑。
|
||||
- 🌟 新增 `onFieldsChange` 与 `onValuesChange` 以用于受控状态触发。
|
||||
- 🌟 提供 `useForm` 的 hook 支持。
|
||||
- 🌟 Form.Item 新增 `name` 属性以进行数据绑定。
|
||||
- 🌟 Form.Item `validateTrigger` 将只进行校验触发而不会同时收集字段值。
|
||||
- 🌟 Form.Item 新增 `rules` 属性以进行数据校验。
|
||||
- 🌟 Form.Item 新增 `shouldUpdate` 属性以支持 render props。
|
||||
- 🌟 Form.Item 新增 `dependencies` 属性以简化相关字段更新逻辑。
|
||||
- 🌟 Form.Item 新增 `noStyle` 属性以及添加无样式数据绑定。
|
||||
- 🌟 新增 Form.List 组件以简化增删改查操作。
|
||||
- 🌟 新增 Form.Provider 组件以支持多表联动。
|
||||
- 🌟 全新 Table 组件。[#19678](https://github.com/ant-design/ant-design/pull/19678)
|
||||
- 🌟 添加 `summary` 支持总结行。
|
||||
- 🌟 现在 `fixedColumn`、`expandable`、`scroll` 可以混合使用。
|
||||
- 🌟 支持多列排序。
|
||||
- 🌟 支持自定义 `body` 并添加虚拟滚动例子。
|
||||
- 🌟 展开相关功能归入 `expandable` 属性并添加 `rowExpandable` 支持。
|
||||
- 🎉 使用 css `sticky` 实现固定效果以优化性能。
|
||||
- 💄 优化 `expand` 动画效果。
|
||||
- 🌟 全新 DatePicker、 TimePicker 与 Calendar 组件。[#20023](https://github.com/ant-design/ant-design/pull/20023)
|
||||
- 🌟 支持自定义日期库。
|
||||
- 🌟 添加 `picker` 支持设置选择器(不再需要通过受控 `mode` 模拟选择器)。
|
||||
- 🌟 全范围选择器支持:时间、日期、周、月、年。
|
||||
- 🌟 范围选择器现在可以单独选择开始与结束时间。
|
||||
- 🌟 范围选择器可以为开始与结束时间单独设置 `disabled`。
|
||||
- 🌟 范围选择器可以允许开始与结束时间为空。
|
||||
- 🌟 优化手工输入与键盘交互支持。
|
||||
- 🌟 支持 `inputReadOnly` 禁用手动输入。
|
||||
- 🌟 移除 Icon,使用 `@ant-design/icons` 代替。[#18217](https://github.com/ant-design/ant-design/pull/18217)
|
||||
- Skeleton
|
||||
- 🌟 支持 Skeleton.Avatar 占位组件。[#19898](https://github.com/ant-design/ant-design/pull/19898) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🌟 支持 Skeleton.Button 占位组件。[#19699](https://github.com/ant-design/ant-design/pull/19699) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🌟 支持 Skeleton.Input 占位组件。[#20264](https://github.com/ant-design/ant-design/pull/20264) [@Rustin-Liu](https://github.com/Rustin-Liu)
|
||||
- 🌟 Tree 支持虚拟滚动。[#18172](https://github.com/ant-design/ant-design/pull/18172)
|
||||
- 🌟 Tree 增强无障碍支持以及键盘交互。[#18866](https://github.com/ant-design/ant-design/pull/18866)
|
||||
- 🌟 Select 使用虚拟滚动并增强无障碍支持以及键盘交互。[#18658](https://github.com/ant-design/ant-design/pull/18658)
|
||||
- 🌟 `value` 为 `undefined` 时,改为非受控模式。
|
||||
- 🌟 TreeSelect 使用虚拟滚动并优化键盘支持。[#19040](https://github.com/ant-design/ant-design/pull/19040)
|
||||
- 🌟 `value` 为 `undefined` 时,改为非受控模式。
|
||||
- 🌟 Button 添加 `danger` 的 `default` 和 `link` 样式。[#19837](https://github.com/ant-design/ant-design/pull/19837)
|
||||
- 🌟 Form 与 ConfigProvider 支持 `size` 设置包含组件尺寸。[#20570](https://github.com/ant-design/ant-design/pull/20570)
|
||||
- 🌟 Typography 增加 `suffix` 属性。[#20224](https://github.com/ant-design/ant-design/pull/20224)
|
||||
- 🌟 Progress 增加 `steps` 子组件。[#19613](https://github.com/ant-design/ant-design/pull/19613)
|
||||
- 🌟 TextArea 支持 `onResize`。[#20408](https://github.com/ant-design/ant-design/pull/20408)
|
||||
- 🌟 新增 Alert.ErrorBoundary 用于提供友好的出错拦截和提示。[#19923](https://github.com/ant-design/ant-design/pull/19923)
|
||||
- 🌟 Upload 支持 iconRender 以自定义 icon。[#20034](https://github.com/ant-design/ant-design/pull/20034) [@qq645381995](https://github.com/qq645381995)
|
||||
- 🌟 Tag 组件预设状态颜色。[#19399](https://github.com/ant-design/ant-design/pull/19399)
|
||||
- 🌟 Grid 使用 `flex` 布局。[#16635](https://github.com/ant-design/ant-design/pull/16635)
|
||||
- 🐞 修复 Carousel 组件 `dotposition` 为 `left | right` 的显示错误。[#20645](https://github.com/ant-design/ant-design/pull/20645) [@xrkffgg](https://github.com/xrkffgg)
|
||||
- 🐞 修复 Alert 组件文本溢出的问题。[#20318](https://github.com/ant-design/ant-design/pull/20318)
|
||||
- 🙅 移除废弃 API 的警告信息。[#17510](https://github.com/ant-design/ant-design/pull/17510)
|
||||
- 🙅 为使用 v3 字符串作为 icon 的 Avatar, Button, Modal.method 和 Result 组件增加 warning。[#20226](https://github.com/ant-design/ant-design/pull/20226)
|
||||
- 💄 添加 `@border-color-split-popover`、`@input-icon-hover-color`、`@select-clear-background`、`@cascader-menu-border-color-split`、`@modal-header-border-color-split`、`@skeleton-to-color`、`@transfer-item-hover-bg` 等 less 变量。[#20070](https://github.com/ant-design/ant-design/pull/20070)
|
||||
|
||||
## 3.x
|
||||
|
||||
去 [GitHub](https://github.com/ant-design/ant-design/blob/3.x-stable/CHANGELOG.zh-CN.md) 查看 `3.x` 的 Change Log。
|
||||
|
||||
## 2.x
|
||||
|
||||
去 [GitHub](https://github.com/ant-design/ant-design/blob/2.x-stable/CHANGELOG.zh-CN.md) 查看 `2.x` 的 Change Log。
|
||||
|
||||
## 1.11.4
|
||||
|
||||
去 [GitHub](https://github.com/ant-design/ant-design/blob/1.x-stable/CHANGELOG.md) 查看 `0.x` 到 `1.x` 的 Change Log。
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
MIT LICENSE
|
||||
|
||||
Copyright (c) 2015-present Ant UED, https://xtech.antfin.com/
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining
|
||||
a copy of this software and associated documentation files (the
|
||||
"Software"), to deal in the Software without restriction, including
|
||||
without limitation the rights to use, copy, modify, merge, publish,
|
||||
distribute, sublicense, and/or sell copies of the Software, and to
|
||||
permit persons to whom the Software is furnished to do so, subject to
|
||||
the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be
|
||||
included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
||||
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
||||
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
||||
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
||||
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
||||
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
||||
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
+167
@@ -0,0 +1,167 @@
|
||||
<p align="center">
|
||||
<a href="http://ant.design">
|
||||
<img width="200" src="https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg">
|
||||
</a>
|
||||
</p>
|
||||
|
||||
<h1 align="center">Ant Design</h1>
|
||||
|
||||
<div align="center">
|
||||
|
||||
An enterprise-class UI design language and React UI library.
|
||||
|
||||
[![CircleCI status][circleci-image]][circleci-url] [![CI status][github-action-image]][github-action-url] [![codecov][codecov-image]][codecov-url] [![NPM version][npm-image]][npm-url] [![NPM downloads][download-image]][download-url]
|
||||
|
||||
[![david deps][david-image]][david-url] [![david devDeps][david-dev-image]][david-dev-url] [![Total alerts][lgtm-image]][lgtm-url] [![FOSSA Status][fossa-image]][fossa-url] [![Issues need help][help-wanted-image]][help-wanted-url]
|
||||
|
||||
[![Follow Twitter][twitter-image]][twitter-url] [![Gitter][gitter-english-image]][gitter-english-url] [![Gitter][gitter-chinese-image]][gitter-chinese-url]
|
||||
|
||||
[npm-image]: http://img.shields.io/npm/v/antd.svg?style=flat-square
|
||||
[npm-url]: http://npmjs.org/package/antd
|
||||
[circleci-image]: https://img.shields.io/travis/com/ant-design/ant-design.svg?style=flat-square
|
||||
[circleci-url]: https://travis-ci.com/ant-design/ant-design
|
||||
[github-action-image]: https://github.com/ant-design/ant-design/workflows/test/badge.svg
|
||||
[github-action-url]: https://github.com/ant-design/ant-design/actions?query=workflow%3Atest
|
||||
[codecov-image]: https://img.shields.io/codecov/c/github/ant-design/ant-design/master.svg?style=flat-square
|
||||
[codecov-url]: https://codecov.io/gh/ant-design/ant-design/branch/master
|
||||
[david-image]: https://david-dm.org/ant-design/ant-design/status.svg?style=flat-square
|
||||
[david-dev-url]: https://david-dm.org/ant-design/ant-design?type=dev
|
||||
[david-dev-image]: https://david-dm.org/ant-design/ant-design/dev-status.svg?style=flat-square
|
||||
[david-url]: https://david-dm.org/ant-design/ant-design
|
||||
[download-image]: https://img.shields.io/npm/dm/antd.svg?style=flat-square
|
||||
[download-url]: https://npmjs.org/package/antd
|
||||
[lgtm-image]: https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design
|
||||
[lgtm-url]: https://lgtm.com/projects/g/ant-design/ant-design/alerts/
|
||||
[lgtm-image]: https://flat.badgen.net/lgtm/alerts/g/ant-design/ant-design
|
||||
[lgtm-url]: https://lgtm.com/projects/g/ant-design/ant-design/alerts/
|
||||
[fossa-image]: https://app.fossa.io/api/projects/git%2Bgithub.com%2Fant-design%2Fant-design.svg?type=shield
|
||||
[fossa-url]: https://app.fossa.io/projects/git%2Bgithub.com%2Fant-design%2Fant-design?ref=badge_shield
|
||||
[help-wanted-image]: https://flat.badgen.net/github/label-issues/ant-design/ant-design/help%20wanted/open
|
||||
[help-wanted-url]: https://github.com/ant-design/ant-design/issues?q=is%3Aopen+is%3Aissue+label%3A%22help+wanted%22
|
||||
[twitter-image]: https://img.shields.io/twitter/follow/AntDesignUI.svg?label=Ant%20Design&style=social
|
||||
[twitter-url]: https://twitter.com/AntDesignUI
|
||||
[gitter-english-image]: https://img.shields.io/gitter/room/ant-design/ant-design-english.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjEyMzUiIGhlaWdodD0iNjUwIiB2aWV3Qm94PSIwIDAgNzQxMCAzOTAwIj4NCjxyZWN0IHdpZHRoPSI3NDEwIiBoZWlnaHQ9IjM5MDAiIGZpbGw9IiNiMjIyMzQiLz4NCjxwYXRoIGQ9Ik0wLDQ1MEg3NDEwbTAsNjAwSDBtMCw2MDBINzQxMG0wLDYwMEgwbTAsNjAwSDc0MTBtMCw2MDBIMCIgc3Ryb2tlPSIjZmZmIiBzdHJva2Utd2lkdGg9IjMwMCIvPg0KPHJlY3Qgd2lkdGg9IjI5NjQiIGhlaWdodD0iMjEwMCIgZmlsbD0iIzNjM2I2ZSIvPg0KPGcgZmlsbD0iI2ZmZiI%2BDQo8ZyBpZD0iczE4Ij4NCjxnIGlkPSJzOSI%2BDQo8ZyBpZD0iczUiPg0KPGcgaWQ9InM0Ij4NCjxwYXRoIGlkPSJzIiBkPSJNMjQ3LDkwIDMxNy41MzQyMzAsMzA3LjA4MjAzOSAxMzIuODczMjE4LDE3Mi45MTc5NjFIMzYxLjEyNjc4MkwxNzYuNDY1NzcwLDMwNy4wODIwMzl6Ii8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB5PSI0MjAiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHk9Ijg0MCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTI2MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjcyIgeT0iMTY4MCIvPg0KPC9nPg0KPHVzZSB4bGluazpocmVmPSIjczQiIHg9IjI0NyIgeT0iMjEwIi8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzOSIgeD0iNDk0Ii8%2BDQo8L2c%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzMTgiIHg9Ijk4OCIvPg0KPHVzZSB4bGluazpocmVmPSIjczkiIHg9IjE5NzYiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3M1IiB4PSIyNDcwIi8%2BDQo8L2c%2BDQo8L3N2Zz4%3D
|
||||
[gitter-english-url]: https://gitter.im/ant-design/ant-design-english?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge
|
||||
[gitter-chinese-image]: https://img.shields.io/gitter/room/ant-design/ant-design.svg?style=flat-square&logoWidth=20&logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgd2lkdGg9IjkwMCIgaGVpZ2h0PSI2MDAiIHZpZXdCb3g9IjAgMCAzMCAyMCI%2BDQo8ZGVmcz4NCjxwYXRoIGlkPSJzIiBkPSJNMCwtMSAwLjU4Nzc4NSwwLjgwOTAxNyAtMC45NTEwNTcsLTAuMzA5MDE3SDAuOTUxMDU3TC0wLjU4Nzc4NSwwLjgwOTAxN3oiIGZpbGw9IiNmZmRlMDAiLz4NCjwvZGVmcz4NCjxyZWN0IHdpZHRoPSIzMCIgaGVpZ2h0PSIyMCIgZmlsbD0iI2RlMjkxMCIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNSw1KSBzY2FsZSgzKSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsMikgcm90YXRlKDIzLjAzNjI0MykiLz4NCjx1c2UgeGxpbms6aHJlZj0iI3MiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDEyLDQpIHJvdGF0ZSg0NS44Njk4OTgpIi8%2BDQo8dXNlIHhsaW5rOmhyZWY9IiNzIiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMiw3KSByb3RhdGUoNjkuOTQ1Mzk2KSIvPg0KPHVzZSB4bGluazpocmVmPSIjcyIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMTAsOSkgcm90YXRlKDIwLjY1OTgwOCkiLz4NCjwvc3ZnPg%3D%3D
|
||||
[gitter-chinese-url]: https://gitter.im/ant-design/ant-design?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge
|
||||
|
||||
</div>
|
||||
|
||||
[](http://ant.design)
|
||||
|
||||
English | [Português](./README-pt_BR.md) | [简体中文](./README-zh_CN.md)
|
||||
|
||||
## ✨ Features
|
||||
|
||||
- 🌈 Enterprise-class UI designed for web applications.
|
||||
- 📦 A set of high-quality React components out of the box.
|
||||
- 🛡 Written in TypeScript with predictable static types.
|
||||
- ⚙️ Whole package of design resources and development tools.
|
||||
- 🌍 Internationalization support for dozens of languages.
|
||||
- 🎨 Powerful theme customization in every detail.
|
||||
|
||||
## 🖥 Environment Support
|
||||
|
||||
- Modern browsers and Internet Explorer 11+ (with [polyfills](https://ant.design/docs/react/getting-started#Compatibility))
|
||||
- Server-side Rendering
|
||||
- [Electron](https://www.electronjs.org/)
|
||||
|
||||
| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Electron |
|
||||
| --- | --- | --- | --- | --- |
|
||||
| IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
|
||||
|
||||
## 📦 Install
|
||||
|
||||
```bash
|
||||
npm install antd
|
||||
```
|
||||
|
||||
```bash
|
||||
yarn add antd
|
||||
```
|
||||
|
||||
## 🔨 Usage
|
||||
|
||||
```jsx
|
||||
import { Button, DatePicker } from 'antd';
|
||||
|
||||
const App = () => (
|
||||
<>
|
||||
<Button type="primary">PRESS ME</Button>
|
||||
<DatePicker />
|
||||
</>
|
||||
);
|
||||
```
|
||||
|
||||
And import style manually:
|
||||
|
||||
```jsx
|
||||
import 'antd/dist/antd.css'; // or 'antd/dist/antd.less'
|
||||
```
|
||||
|
||||
Or use [babel-plugin-import](https://ant.design/docs/react/getting-started#Import-on-Demand).
|
||||
|
||||
### TypeScript
|
||||
|
||||
See [Use in TypeScript](https://ant.design/docs/react/use-in-typescript).
|
||||
|
||||
## 🌍 Internationalization
|
||||
|
||||
See [i18n](http://ant.design/docs/react/i18n).
|
||||
|
||||
## 🔗 Links
|
||||
|
||||
- [Home page](http://ant.design/)
|
||||
- [Components](http://ant.design/docs/react/introduce)
|
||||
- [Ant Design Pro](http://pro.ant.design/)
|
||||
- [Change Log](CHANGELOG.en-US.md)
|
||||
- [rc-components](http://react-component.github.io/)
|
||||
- [Mobile UI](http://mobile.ant.design)
|
||||
- [Ant Design Icons](https://github.com/ant-design/ant-design-icons)
|
||||
- [Ant Design Colors](https://github.com/ant-design/ant-design-colors)
|
||||
- [Ant Design Pro Layout](https://github.com/ant-design/ant-design-pro-layout)
|
||||
- [Ant Design Pro Blocks](https://github.com/ant-design/pro-blocks)
|
||||
- [Dark Theme](https://github.com/ant-design/ant-design-dark-theme)
|
||||
- [Landing Pages](https://landing.ant.design)
|
||||
- [Motion](https://motion.ant.design)
|
||||
- [Scaffold Market](http://scaffold.ant.design)
|
||||
- [Developer Instruction](https://github.com/ant-design/ant-design/wiki/Development)
|
||||
- [Versioning Release Note](https://github.com/ant-design/ant-design/wiki/%E8%BD%AE%E5%80%BC%E8%A7%84%E5%88%99%E5%92%8C%E7%89%88%E6%9C%AC%E5%8F%91%E5%B8%83%E6%B5%81%E7%A8%8B)
|
||||
- [FAQ](https://ant.design/docs/react/faq)
|
||||
- [CodeSandbox Template](https://u.ant.design/codesandbox-repro) for bug reports
|
||||
- [Awesome Ant Design](https://github.com/websemantics/awesome-ant-design)
|
||||
- [Customize Theme](http://ant.design/docs/react/customize-theme)
|
||||
- [How to Apply for Being A Collaborator](https://github.com/ant-design/ant-design/wiki/Collaborators#how-to-apply-for-being-a-collaborator)
|
||||
|
||||
## ⌨️ Development
|
||||
|
||||
Use Gitpod, a free online dev environment for GitHub.
|
||||
|
||||
[](https://gitpod.io/#https://github.com/ant-design/ant-design)
|
||||
|
||||
Or clone locally:
|
||||
|
||||
```bash
|
||||
$ git clone git@github.com:ant-design/ant-design.git
|
||||
$ cd ant-design
|
||||
$ npm install
|
||||
$ npm start
|
||||
```
|
||||
|
||||
Open your browser and visit http://127.0.0.1:8001 , see more at [Development](https://github.com/ant-design/ant-design/wiki/Development).
|
||||
|
||||
## 🤝 Contributing [](http://makeapullrequest.com)
|
||||
|
||||
Read our [contributing guide](https://ant.design/docs/react/contributing) and let's build a better antd together.
|
||||
|
||||
We welcome all contributions. Please read our [CONTRIBUTING.md](https://github.com/ant-design/ant-design/blob/master/.github/CONTRIBUTING.md) first. You can submit any ideas as [pull requests](https://github.com/ant-design/ant-design/pulls) or as [GitHub issues](https://github.com/ant-design/ant-design/issues). If you'd like to improve code, check out the [Development Instructions](https://github.com/ant-design/ant-design/wiki/Development) and have a good time! :)
|
||||
|
||||
If you are a collaborator, please follow our [Pull Request principle](https://github.com/ant-design/ant-design/wiki/PR-principle) to create a Pull Request by [collaborator template](https://github.com/ant-design/ant-design/compare?expand=1&template=collaborator.md).
|
||||
|
||||
[](https://issuehunt.io/repos/34526884)
|
||||
|
||||
## ❤️ Sponsors and Backers [](https://opencollective.com/ant-design#support) [](https://opencollective.com/ant-design#support)
|
||||
|
||||
[](https://opencollective.com/ant-design#support)
|
||||
|
||||
[](https://opencollective.com/ant-design#support)
|
||||
+104455
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
+29
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
+27500
File diff suppressed because it is too large
Load Diff
+1
File diff suppressed because one or more lines are too long
+2
@@ -0,0 +1,2 @@
|
||||
@import "../lib/style/compact.less";
|
||||
@import "../lib/style/components.less";
|
||||
+9
File diff suppressed because one or more lines are too long
+27500
File diff suppressed because it is too large
Load Diff
+1
File diff suppressed because one or more lines are too long
+27788
File diff suppressed because it is too large
Load Diff
+1
File diff suppressed because one or more lines are too long
+2
@@ -0,0 +1,2 @@
|
||||
@import "../lib/style/dark.less";
|
||||
@import "../lib/style/components.less";
|
||||
+9
File diff suppressed because one or more lines are too long
+2
@@ -0,0 +1,2 @@
|
||||
@import "../lib/style/default.less";
|
||||
@import "../lib/style/components.less";
|
||||
+96832
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
+2
@@ -0,0 +1,2 @@
|
||||
@import "../lib/style/index.less";
|
||||
@import "../lib/style/components.less";
|
||||
+9
File diff suppressed because one or more lines are too long
+29
File diff suppressed because one or more lines are too long
+1
File diff suppressed because one or more lines are too long
+7
@@ -0,0 +1,7 @@
|
||||
const { compactThemeSingle } = require('./theme');
|
||||
const defaultTheme = require('./default-theme');
|
||||
|
||||
module.exports = {
|
||||
...defaultTheme,
|
||||
...compactThemeSingle
|
||||
}
|
||||
+7
@@ -0,0 +1,7 @@
|
||||
const { darkThemeSingle } = require('./theme');
|
||||
const defaultTheme = require('./default-theme');
|
||||
|
||||
module.exports = {
|
||||
...defaultTheme,
|
||||
...darkThemeSingle
|
||||
}
|
||||
+774
@@ -0,0 +1,774 @@
|
||||
module.exports = {
|
||||
"blue-base": "#1890ff",
|
||||
"blue-1": "color(~`colorPalette('@{blue-6}', 1) `)",
|
||||
"blue-2": "color(~`colorPalette('@{blue-6}', 2) `)",
|
||||
"blue-3": "color(~`colorPalette('@{blue-6}', 3) `)",
|
||||
"blue-4": "color(~`colorPalette('@{blue-6}', 4) `)",
|
||||
"blue-5": "color(~`colorPalette('@{blue-6}', 5) `)",
|
||||
"blue-6": "@blue-base",
|
||||
"blue-7": "color(~`colorPalette('@{blue-6}', 7) `)",
|
||||
"blue-8": "color(~`colorPalette('@{blue-6}', 8) `)",
|
||||
"blue-9": "color(~`colorPalette('@{blue-6}', 9) `)",
|
||||
"blue-10": "color(~`colorPalette('@{blue-6}', 10) `)",
|
||||
"purple-base": "#722ed1",
|
||||
"purple-1": "color(~`colorPalette('@{purple-6}', 1) `)",
|
||||
"purple-2": "color(~`colorPalette('@{purple-6}', 2) `)",
|
||||
"purple-3": "color(~`colorPalette('@{purple-6}', 3) `)",
|
||||
"purple-4": "color(~`colorPalette('@{purple-6}', 4) `)",
|
||||
"purple-5": "color(~`colorPalette('@{purple-6}', 5) `)",
|
||||
"purple-6": "@purple-base",
|
||||
"purple-7": "color(~`colorPalette('@{purple-6}', 7) `)",
|
||||
"purple-8": "color(~`colorPalette('@{purple-6}', 8) `)",
|
||||
"purple-9": "color(~`colorPalette('@{purple-6}', 9) `)",
|
||||
"purple-10": "color(~`colorPalette('@{purple-6}', 10) `)",
|
||||
"cyan-base": "#13c2c2",
|
||||
"cyan-1": "color(~`colorPalette('@{cyan-6}', 1) `)",
|
||||
"cyan-2": "color(~`colorPalette('@{cyan-6}', 2) `)",
|
||||
"cyan-3": "color(~`colorPalette('@{cyan-6}', 3) `)",
|
||||
"cyan-4": "color(~`colorPalette('@{cyan-6}', 4) `)",
|
||||
"cyan-5": "color(~`colorPalette('@{cyan-6}', 5) `)",
|
||||
"cyan-6": "@cyan-base",
|
||||
"cyan-7": "color(~`colorPalette('@{cyan-6}', 7) `)",
|
||||
"cyan-8": "color(~`colorPalette('@{cyan-6}', 8) `)",
|
||||
"cyan-9": "color(~`colorPalette('@{cyan-6}', 9) `)",
|
||||
"cyan-10": "color(~`colorPalette('@{cyan-6}', 10) `)",
|
||||
"green-base": "#52c41a",
|
||||
"green-1": "color(~`colorPalette('@{green-6}', 1) `)",
|
||||
"green-2": "color(~`colorPalette('@{green-6}', 2) `)",
|
||||
"green-3": "color(~`colorPalette('@{green-6}', 3) `)",
|
||||
"green-4": "color(~`colorPalette('@{green-6}', 4) `)",
|
||||
"green-5": "color(~`colorPalette('@{green-6}', 5) `)",
|
||||
"green-6": "@green-base",
|
||||
"green-7": "color(~`colorPalette('@{green-6}', 7) `)",
|
||||
"green-8": "color(~`colorPalette('@{green-6}', 8) `)",
|
||||
"green-9": "color(~`colorPalette('@{green-6}', 9) `)",
|
||||
"green-10": "color(~`colorPalette('@{green-6}', 10) `)",
|
||||
"magenta-base": "#eb2f96",
|
||||
"magenta-1": "color(~`colorPalette('@{magenta-6}', 1) `)",
|
||||
"magenta-2": "color(~`colorPalette('@{magenta-6}', 2) `)",
|
||||
"magenta-3": "color(~`colorPalette('@{magenta-6}', 3) `)",
|
||||
"magenta-4": "color(~`colorPalette('@{magenta-6}', 4) `)",
|
||||
"magenta-5": "color(~`colorPalette('@{magenta-6}', 5) `)",
|
||||
"magenta-6": "@magenta-base",
|
||||
"magenta-7": "color(~`colorPalette('@{magenta-6}', 7) `)",
|
||||
"magenta-8": "color(~`colorPalette('@{magenta-6}', 8) `)",
|
||||
"magenta-9": "color(~`colorPalette('@{magenta-6}', 9) `)",
|
||||
"magenta-10": "color(~`colorPalette('@{magenta-6}', 10) `)",
|
||||
"pink-base": "#eb2f96",
|
||||
"pink-1": "color(~`colorPalette('@{pink-6}', 1) `)",
|
||||
"pink-2": "color(~`colorPalette('@{pink-6}', 2) `)",
|
||||
"pink-3": "color(~`colorPalette('@{pink-6}', 3) `)",
|
||||
"pink-4": "color(~`colorPalette('@{pink-6}', 4) `)",
|
||||
"pink-5": "color(~`colorPalette('@{pink-6}', 5) `)",
|
||||
"pink-6": "@pink-base",
|
||||
"pink-7": "color(~`colorPalette('@{pink-6}', 7) `)",
|
||||
"pink-8": "color(~`colorPalette('@{pink-6}', 8) `)",
|
||||
"pink-9": "color(~`colorPalette('@{pink-6}', 9) `)",
|
||||
"pink-10": "color(~`colorPalette('@{pink-6}', 10) `)",
|
||||
"red-base": "#f5222d",
|
||||
"red-1": "color(~`colorPalette('@{red-6}', 1) `)",
|
||||
"red-2": "color(~`colorPalette('@{red-6}', 2) `)",
|
||||
"red-3": "color(~`colorPalette('@{red-6}', 3) `)",
|
||||
"red-4": "color(~`colorPalette('@{red-6}', 4) `)",
|
||||
"red-5": "color(~`colorPalette('@{red-6}', 5) `)",
|
||||
"red-6": "@red-base",
|
||||
"red-7": "color(~`colorPalette('@{red-6}', 7) `)",
|
||||
"red-8": "color(~`colorPalette('@{red-6}', 8) `)",
|
||||
"red-9": "color(~`colorPalette('@{red-6}', 9) `)",
|
||||
"red-10": "color(~`colorPalette('@{red-6}', 10) `)",
|
||||
"orange-base": "#fa8c16",
|
||||
"orange-1": "color(~`colorPalette('@{orange-6}', 1) `)",
|
||||
"orange-2": "color(~`colorPalette('@{orange-6}', 2) `)",
|
||||
"orange-3": "color(~`colorPalette('@{orange-6}', 3) `)",
|
||||
"orange-4": "color(~`colorPalette('@{orange-6}', 4) `)",
|
||||
"orange-5": "color(~`colorPalette('@{orange-6}', 5) `)",
|
||||
"orange-6": "@orange-base",
|
||||
"orange-7": "color(~`colorPalette('@{orange-6}', 7) `)",
|
||||
"orange-8": "color(~`colorPalette('@{orange-6}', 8) `)",
|
||||
"orange-9": "color(~`colorPalette('@{orange-6}', 9) `)",
|
||||
"orange-10": "color(~`colorPalette('@{orange-6}', 10) `)",
|
||||
"yellow-base": "#fadb14",
|
||||
"yellow-1": "color(~`colorPalette('@{yellow-6}', 1) `)",
|
||||
"yellow-2": "color(~`colorPalette('@{yellow-6}', 2) `)",
|
||||
"yellow-3": "color(~`colorPalette('@{yellow-6}', 3) `)",
|
||||
"yellow-4": "color(~`colorPalette('@{yellow-6}', 4) `)",
|
||||
"yellow-5": "color(~`colorPalette('@{yellow-6}', 5) `)",
|
||||
"yellow-6": "@yellow-base",
|
||||
"yellow-7": "color(~`colorPalette('@{yellow-6}', 7) `)",
|
||||
"yellow-8": "color(~`colorPalette('@{yellow-6}', 8) `)",
|
||||
"yellow-9": "color(~`colorPalette('@{yellow-6}', 9) `)",
|
||||
"yellow-10": "color(~`colorPalette('@{yellow-6}', 10) `)",
|
||||
"volcano-base": "#fa541c",
|
||||
"volcano-1": "color(~`colorPalette('@{volcano-6}', 1) `)",
|
||||
"volcano-2": "color(~`colorPalette('@{volcano-6}', 2) `)",
|
||||
"volcano-3": "color(~`colorPalette('@{volcano-6}', 3) `)",
|
||||
"volcano-4": "color(~`colorPalette('@{volcano-6}', 4) `)",
|
||||
"volcano-5": "color(~`colorPalette('@{volcano-6}', 5) `)",
|
||||
"volcano-6": "@volcano-base",
|
||||
"volcano-7": "color(~`colorPalette('@{volcano-6}', 7) `)",
|
||||
"volcano-8": "color(~`colorPalette('@{volcano-6}', 8) `)",
|
||||
"volcano-9": "color(~`colorPalette('@{volcano-6}', 9) `)",
|
||||
"volcano-10": "color(~`colorPalette('@{volcano-6}', 10) `)",
|
||||
"geekblue-base": "#2f54eb",
|
||||
"geekblue-1": "color(~`colorPalette('@{geekblue-6}', 1) `)",
|
||||
"geekblue-2": "color(~`colorPalette('@{geekblue-6}', 2) `)",
|
||||
"geekblue-3": "color(~`colorPalette('@{geekblue-6}', 3) `)",
|
||||
"geekblue-4": "color(~`colorPalette('@{geekblue-6}', 4) `)",
|
||||
"geekblue-5": "color(~`colorPalette('@{geekblue-6}', 5) `)",
|
||||
"geekblue-6": "@geekblue-base",
|
||||
"geekblue-7": "color(~`colorPalette('@{geekblue-6}', 7) `)",
|
||||
"geekblue-8": "color(~`colorPalette('@{geekblue-6}', 8) `)",
|
||||
"geekblue-9": "color(~`colorPalette('@{geekblue-6}', 9) `)",
|
||||
"geekblue-10": "color(~`colorPalette('@{geekblue-6}', 10) `)",
|
||||
"lime-base": "#a0d911",
|
||||
"lime-1": "color(~`colorPalette('@{lime-6}', 1) `)",
|
||||
"lime-2": "color(~`colorPalette('@{lime-6}', 2) `)",
|
||||
"lime-3": "color(~`colorPalette('@{lime-6}', 3) `)",
|
||||
"lime-4": "color(~`colorPalette('@{lime-6}', 4) `)",
|
||||
"lime-5": "color(~`colorPalette('@{lime-6}', 5) `)",
|
||||
"lime-6": "@lime-base",
|
||||
"lime-7": "color(~`colorPalette('@{lime-6}', 7) `)",
|
||||
"lime-8": "color(~`colorPalette('@{lime-6}', 8) `)",
|
||||
"lime-9": "color(~`colorPalette('@{lime-6}', 9) `)",
|
||||
"lime-10": "color(~`colorPalette('@{lime-6}', 10) `)",
|
||||
"gold-base": "#faad14",
|
||||
"gold-1": "color(~`colorPalette('@{gold-6}', 1) `)",
|
||||
"gold-2": "color(~`colorPalette('@{gold-6}', 2) `)",
|
||||
"gold-3": "color(~`colorPalette('@{gold-6}', 3) `)",
|
||||
"gold-4": "color(~`colorPalette('@{gold-6}', 4) `)",
|
||||
"gold-5": "color(~`colorPalette('@{gold-6}', 5) `)",
|
||||
"gold-6": "@gold-base",
|
||||
"gold-7": "color(~`colorPalette('@{gold-6}', 7) `)",
|
||||
"gold-8": "color(~`colorPalette('@{gold-6}', 8) `)",
|
||||
"gold-9": "color(~`colorPalette('@{gold-6}', 9) `)",
|
||||
"gold-10": "color(~`colorPalette('@{gold-6}', 10) `)",
|
||||
"preset-colors": "pink, magenta, red, volcano, orange, yellow, gold, cyan, lime, green, blue, geekblue,\n purple",
|
||||
"theme": "default",
|
||||
"ant-prefix": "ant",
|
||||
"html-selector": "html",
|
||||
"primary-color": "@blue-6",
|
||||
"info-color": "@primary-color",
|
||||
"success-color": "@green-6",
|
||||
"processing-color": "@blue-6",
|
||||
"error-color": "@red-5",
|
||||
"highlight-color": "@red-5",
|
||||
"warning-color": "@gold-6",
|
||||
"normal-color": "#d9d9d9",
|
||||
"white": "#fff",
|
||||
"black": "#000",
|
||||
"primary-1": "color(~`colorPalette('@{primary-color}', 1) `)",
|
||||
"primary-2": "color(~`colorPalette('@{primary-color}', 2) `)",
|
||||
"primary-3": "color(~`colorPalette('@{primary-color}', 3) `)",
|
||||
"primary-4": "color(~`colorPalette('@{primary-color}', 4) `)",
|
||||
"primary-5": "color(\n ~`colorPalette('@{primary-color}', 5) `\n)",
|
||||
"primary-6": "@primary-color",
|
||||
"primary-7": "color(~`colorPalette('@{primary-color}', 7) `)",
|
||||
"primary-8": "color(~`colorPalette('@{primary-color}', 8) `)",
|
||||
"primary-9": "color(~`colorPalette('@{primary-color}', 9) `)",
|
||||
"primary-10": "color(~`colorPalette('@{primary-color}', 10) `)",
|
||||
"body-background": "#fff",
|
||||
"component-background": "#fff",
|
||||
"popover-background": "@component-background",
|
||||
"popover-customize-border-color": "@border-color-split",
|
||||
"font-family": "-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,\n 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',\n 'Noto Color Emoji'",
|
||||
"code-family": "'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, Courier, monospace",
|
||||
"text-color": "fade(@black, 65%)",
|
||||
"text-color-secondary": "fade(@black, 45%)",
|
||||
"text-color-inverse": "@white",
|
||||
"icon-color": "inherit",
|
||||
"icon-color-hover": "fade(@black, 75%)",
|
||||
"heading-color": "fade(#000, 85%)",
|
||||
"heading-color-dark": "fade(@white, 100%)",
|
||||
"text-color-dark": "fade(@white, 85%)",
|
||||
"text-color-secondary-dark": "fade(@white, 65%)",
|
||||
"text-selection-bg": "@primary-color",
|
||||
"font-variant-base": "tabular-nums",
|
||||
"font-feature-settings-base": "tnum",
|
||||
"font-size-base": "14px",
|
||||
"font-size-lg": "@font-size-base + 2px",
|
||||
"font-size-sm": "12px",
|
||||
"heading-1-size": "ceil(@font-size-base * 2.71)",
|
||||
"heading-2-size": "ceil(@font-size-base * 2.14)",
|
||||
"heading-3-size": "ceil(@font-size-base * 1.71)",
|
||||
"heading-4-size": "ceil(@font-size-base * 1.42)",
|
||||
"line-height-base": "1.5715",
|
||||
"border-radius-base": "2px",
|
||||
"border-radius-sm": "@border-radius-base",
|
||||
"padding-lg": "24px",
|
||||
"padding-md": "16px",
|
||||
"padding-sm": "12px",
|
||||
"padding-xs": "8px",
|
||||
"padding-xss": "4px",
|
||||
"control-padding-horizontal": "@padding-sm",
|
||||
"control-padding-horizontal-sm": "@padding-xs",
|
||||
"margin-lg": "24px",
|
||||
"margin-md": "16px",
|
||||
"margin-sm": "12px",
|
||||
"margin-xs": "8px",
|
||||
"margin-xss": "4px",
|
||||
"height-base": "32px",
|
||||
"height-lg": "40px",
|
||||
"height-sm": "24px",
|
||||
"item-active-bg": "@primary-1",
|
||||
"item-hover-bg": "#f5f5f5",
|
||||
"iconfont-css-prefix": "anticon",
|
||||
"link-color": "@primary-color",
|
||||
"link-hover-color": "color(~`colorPalette('@{link-color}', 5) `)",
|
||||
"link-active-color": "color(~`colorPalette('@{link-color}', 7) `)",
|
||||
"link-decoration": "none",
|
||||
"link-hover-decoration": "none",
|
||||
"link-focus-decoration": "none",
|
||||
"link-focus-outline": "0",
|
||||
"ease-base-out": "cubic-bezier(0.7, 0.3, 0.1, 1)",
|
||||
"ease-base-in": "cubic-bezier(0.9, 0, 0.3, 0.7)",
|
||||
"ease-out": "cubic-bezier(0.215, 0.61, 0.355, 1)",
|
||||
"ease-in": "cubic-bezier(0.55, 0.055, 0.675, 0.19)",
|
||||
"ease-in-out": "cubic-bezier(0.645, 0.045, 0.355, 1)",
|
||||
"ease-out-back": "cubic-bezier(0.12, 0.4, 0.29, 1.46)",
|
||||
"ease-in-back": "cubic-bezier(0.71, -0.46, 0.88, 0.6)",
|
||||
"ease-in-out-back": "cubic-bezier(0.71, -0.46, 0.29, 1.46)",
|
||||
"ease-out-circ": "cubic-bezier(0.08, 0.82, 0.17, 1)",
|
||||
"ease-in-circ": "cubic-bezier(0.6, 0.04, 0.98, 0.34)",
|
||||
"ease-in-out-circ": "cubic-bezier(0.78, 0.14, 0.15, 0.86)",
|
||||
"ease-out-quint": "cubic-bezier(0.23, 1, 0.32, 1)",
|
||||
"ease-in-quint": "cubic-bezier(0.755, 0.05, 0.855, 0.06)",
|
||||
"ease-in-out-quint": "cubic-bezier(0.86, 0, 0.07, 1)",
|
||||
"border-color-base": "hsv(0, 0, 85%)",
|
||||
"border-color-split": "hsv(0, 0, 94%)",
|
||||
"border-color-inverse": "@white",
|
||||
"border-width-base": "1px",
|
||||
"border-style-base": "solid",
|
||||
"outline-blur-size": "0",
|
||||
"outline-width": "2px",
|
||||
"outline-color": "@primary-color",
|
||||
"outline-fade": "20%",
|
||||
"background-color-light": "hsv(0, 0, 98%)",
|
||||
"background-color-base": "hsv(0, 0, 96%)",
|
||||
"disabled-color": "fade(#000, 25%)",
|
||||
"disabled-bg": "@background-color-base",
|
||||
"disabled-color-dark": "fade(#fff, 35%)",
|
||||
"shadow-color": "rgba(0, 0, 0, 0.15)",
|
||||
"shadow-color-inverse": "@component-background",
|
||||
"box-shadow-base": "@shadow-2",
|
||||
"shadow-1-up": "0 -6px 16px -8px rgba(0, 0, 0, 0.08), 0 -9px 28px 0 rgba(0, 0, 0, 0.05),\n 0 -12px 48px 16px rgba(0, 0, 0, 0.03)",
|
||||
"shadow-1-down": "0 6px 16px -8px rgba(0, 0, 0, 0.08), 0 9px 28px 0 rgba(0, 0, 0, 0.05),\n 0 12px 48px 16px rgba(0, 0, 0, 0.03)",
|
||||
"shadow-1-left": "-6px 0 16px -8px rgba(0, 0, 0, 0.08), -9px 0 28px 0 rgba(0, 0, 0, 0.05),\n -12px 0 48px 16px rgba(0, 0, 0, 0.03)",
|
||||
"shadow-1-right": "6px 0 16px -8px rgba(0, 0, 0, 0.08), 9px 0 28px 0 rgba(0, 0, 0, 0.05),\n 12px 0 48px 16px rgba(0, 0, 0, 0.03)",
|
||||
"shadow-2": "0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),\n 0 9px 28px 8px rgba(0, 0, 0, 0.05)",
|
||||
"btn-font-weight": "400",
|
||||
"btn-border-radius-base": "@border-radius-base",
|
||||
"btn-border-radius-sm": "@border-radius-base",
|
||||
"btn-border-width": "@border-width-base",
|
||||
"btn-border-style": "@border-style-base",
|
||||
"btn-shadow": "0 2px 0 rgba(0, 0, 0, 0.015)",
|
||||
"btn-primary-shadow": "0 2px 0 rgba(0, 0, 0, 0.045)",
|
||||
"btn-text-shadow": "0 -1px 0 rgba(0, 0, 0, 0.12)",
|
||||
"btn-primary-color": "#fff",
|
||||
"btn-primary-bg": "@primary-color",
|
||||
"btn-default-color": "@text-color",
|
||||
"btn-default-bg": "@component-background",
|
||||
"btn-default-border": "@border-color-base",
|
||||
"btn-danger-color": "#fff",
|
||||
"btn-danger-bg": "@error-color",
|
||||
"btn-danger-border": "@error-color",
|
||||
"btn-disable-color": "@disabled-color",
|
||||
"btn-disable-bg": "@disabled-bg",
|
||||
"btn-disable-border": "@border-color-base",
|
||||
"btn-default-ghost-color": "@component-background",
|
||||
"btn-default-ghost-bg": "transparent",
|
||||
"btn-default-ghost-border": "@component-background",
|
||||
"btn-font-size-lg": "@font-size-lg",
|
||||
"btn-font-size-sm": "@font-size-base",
|
||||
"btn-padding-horizontal-base": "@padding-md - 1px",
|
||||
"btn-padding-horizontal-lg": "@btn-padding-horizontal-base",
|
||||
"btn-padding-horizontal-sm": "@padding-xs - 1px",
|
||||
"btn-height-base": "@height-base",
|
||||
"btn-height-lg": "@height-lg",
|
||||
"btn-height-sm": "@height-sm",
|
||||
"btn-circle-size": "@btn-height-base",
|
||||
"btn-circle-size-lg": "@btn-height-lg",
|
||||
"btn-circle-size-sm": "@btn-height-sm",
|
||||
"btn-square-size": "@btn-height-base",
|
||||
"btn-square-size-lg": "@btn-height-lg",
|
||||
"btn-square-size-sm": "@btn-height-sm",
|
||||
"btn-square-only-icon-size": "@font-size-base + 2px",
|
||||
"btn-square-only-icon-size-sm": "@font-size-base",
|
||||
"btn-square-only-icon-size-lg": "@btn-font-size-lg + 2px",
|
||||
"btn-group-border": "@primary-5",
|
||||
"btn-link-ghost-color": "@component-background",
|
||||
"checkbox-size": "16px",
|
||||
"checkbox-color": "@primary-color",
|
||||
"checkbox-check-color": "#fff",
|
||||
"checkbox-check-bg": "@checkbox-check-color",
|
||||
"checkbox-border-width": "@border-width-base",
|
||||
"descriptions-bg": "#fafafa",
|
||||
"descriptions-title-margin-bottom": "20px",
|
||||
"descriptions-default-padding": "@padding-md @padding-lg",
|
||||
"descriptions-middle-padding": "@padding-sm @padding-lg",
|
||||
"descriptions-small-padding": "@padding-xs @padding-md",
|
||||
"dropdown-selected-color": "@primary-color",
|
||||
"dropdown-menu-submenu-disabled-bg": "@component-background",
|
||||
"empty-font-size": "@font-size-base",
|
||||
"radio-size": "16px",
|
||||
"radio-dot-color": "@primary-color",
|
||||
"radio-dot-disabled-color": "fade(@black, 20%)",
|
||||
"radtio-solid-checked-color": "@component-background",
|
||||
"radio-solid-checked-color": "@radtio-solid-checked-color",
|
||||
"radio-button-bg": "@btn-default-bg",
|
||||
"radio-button-checked-bg": "@btn-default-bg",
|
||||
"radio-button-color": "@btn-default-color",
|
||||
"radio-button-hover-color": "@primary-5",
|
||||
"radio-button-active-color": "@primary-7",
|
||||
"radio-disabled-button-checked-bg": "tint(@black, 90%)",
|
||||
"radio-disabled-button-checked-color": "@text-color-inverse",
|
||||
"screen-xs": "480px",
|
||||
"screen-xs-min": "@screen-xs",
|
||||
"screen-sm": "576px",
|
||||
"screen-sm-min": "@screen-sm",
|
||||
"screen-md": "768px",
|
||||
"screen-md-min": "@screen-md",
|
||||
"screen-lg": "992px",
|
||||
"screen-lg-min": "@screen-lg",
|
||||
"screen-xl": "1200px",
|
||||
"screen-xl-min": "@screen-xl",
|
||||
"screen-xxl": "1600px",
|
||||
"screen-xxl-min": "@screen-xxl",
|
||||
"screen-xs-max": "(@screen-sm-min - 1px)",
|
||||
"screen-sm-max": "(@screen-md-min - 1px)",
|
||||
"screen-md-max": "(@screen-lg-min - 1px)",
|
||||
"screen-lg-max": "(@screen-xl-min - 1px)",
|
||||
"screen-xl-max": "(@screen-xxl-min - 1px)",
|
||||
"grid-columns": "24",
|
||||
"grid-gutter-width": "0",
|
||||
"layout-body-background": "#f0f2f5",
|
||||
"layout-header-background": "#001529",
|
||||
"layout-header-height": "64px",
|
||||
"layout-header-padding": "0 50px",
|
||||
"layout-header-color": "@text-color",
|
||||
"layout-footer-padding": "24px 50px",
|
||||
"layout-footer-background": "@layout-body-background",
|
||||
"layout-sider-background": "@layout-header-background",
|
||||
"layout-trigger-height": "48px",
|
||||
"layout-trigger-background": "#002140",
|
||||
"layout-trigger-color": "#fff",
|
||||
"layout-zero-trigger-width": "36px",
|
||||
"layout-zero-trigger-height": "42px",
|
||||
"layout-sider-background-light": "#fff",
|
||||
"layout-trigger-background-light": "#fff",
|
||||
"layout-trigger-color-light": "@text-color",
|
||||
"zindex-badge": "auto",
|
||||
"zindex-table-fixed": "auto",
|
||||
"zindex-affix": "10",
|
||||
"zindex-back-top": "10",
|
||||
"zindex-picker-panel": "10",
|
||||
"zindex-popup-close": "10",
|
||||
"zindex-modal": "1000",
|
||||
"zindex-modal-mask": "1000",
|
||||
"zindex-message": "1010",
|
||||
"zindex-notification": "1010",
|
||||
"zindex-popover": "1030",
|
||||
"zindex-dropdown": "1050",
|
||||
"zindex-picker": "1050",
|
||||
"zindex-tooltip": "1060",
|
||||
"animation-duration-slow": "0.3s",
|
||||
"animation-duration-base": "0.2s",
|
||||
"animation-duration-fast": "0.1s",
|
||||
"collapse-panel-border-radius": "@border-radius-base",
|
||||
"dropdown-menu-bg": "@component-background",
|
||||
"dropdown-vertical-padding": "5px",
|
||||
"dropdown-edge-child-vertical-padding": "4px",
|
||||
"dropdown-font-size": "@font-size-base",
|
||||
"dropdown-line-height": "22px",
|
||||
"label-required-color": "@highlight-color",
|
||||
"label-color": "@heading-color",
|
||||
"form-warning-input-bg": "@input-bg",
|
||||
"form-item-margin-bottom": "24px",
|
||||
"form-item-trailing-colon": "true",
|
||||
"form-vertical-label-padding": "0 0 8px",
|
||||
"form-vertical-label-margin": "0",
|
||||
"form-item-label-font-size": "@font-size-base",
|
||||
"form-item-label-height": "@input-height-base",
|
||||
"form-item-label-colon-margin-right": "8px",
|
||||
"form-item-label-colon-margin-left": "2px",
|
||||
"form-error-input-bg": "@input-bg",
|
||||
"input-height-base": "@height-base",
|
||||
"input-height-lg": "@height-lg",
|
||||
"input-height-sm": "@height-sm",
|
||||
"input-padding-horizontal": "@control-padding-horizontal - 1px",
|
||||
"input-padding-horizontal-base": "@input-padding-horizontal",
|
||||
"input-padding-horizontal-sm": "@control-padding-horizontal-sm - 1px",
|
||||
"input-padding-horizontal-lg": "@input-padding-horizontal",
|
||||
"input-padding-vertical-base": "max(\n round((@input-height-base - @font-size-base * @line-height-base) / 2 * 10) / 10 -\n @border-width-base,\n 3px\n)",
|
||||
"input-padding-vertical-sm": "max(\n round((@input-height-sm - @font-size-base * @line-height-base) / 2 * 10) / 10 - @border-width-base,\n 0\n)",
|
||||
"input-padding-vertical-lg": "ceil((@input-height-lg - @font-size-lg * @line-height-base) / 2 * 10) /\n 10 - @border-width-base",
|
||||
"input-placeholder-color": "hsv(0, 0, 75%)",
|
||||
"input-color": "@text-color",
|
||||
"input-icon-color": "@input-color",
|
||||
"input-border-color": "@border-color-base",
|
||||
"input-bg": "@component-background",
|
||||
"input-number-hover-border-color": "@input-hover-border-color",
|
||||
"input-number-handler-active-bg": "#f4f4f4",
|
||||
"input-number-handler-hover-bg": "@primary-5",
|
||||
"input-number-handler-bg": "@component-background",
|
||||
"input-number-handler-border-color": "@border-color-base",
|
||||
"input-addon-bg": "@background-color-light",
|
||||
"input-hover-border-color": "@primary-5",
|
||||
"input-disabled-bg": "@disabled-bg",
|
||||
"input-outline-offset": "0 0",
|
||||
"input-icon-hover-color": "fade(@black, 85%)",
|
||||
"mentions-dropdown-bg": "@component-background",
|
||||
"mentions-dropdown-menu-item-hover-bg": "@mentions-dropdown-bg",
|
||||
"select-border-color": "@border-color-base",
|
||||
"select-item-selected-font-weight": "600",
|
||||
"select-dropdown-bg": "@component-background",
|
||||
"select-item-selected-bg": "@primary-1",
|
||||
"select-item-active-bg": "@item-hover-bg",
|
||||
"select-dropdown-vertical-padding": "@dropdown-vertical-padding",
|
||||
"select-dropdown-font-size": "@dropdown-font-size",
|
||||
"select-dropdown-line-height": "@dropdown-line-height",
|
||||
"select-dropdown-height": "32px",
|
||||
"select-background": "@component-background",
|
||||
"select-clear-background": "@select-background",
|
||||
"select-selection-item-bg": "@background-color-base",
|
||||
"select-selection-item-border-color": "@border-color-split",
|
||||
"select-single-item-height-lg": "40px",
|
||||
"select-multiple-item-height": "@input-height-base - @input-padding-vertical-base * 2",
|
||||
"select-multiple-item-height-lg": "32px",
|
||||
"select-multiple-item-spacing-half": "ceil(@input-padding-vertical-base / 2)",
|
||||
"cascader-bg": "@component-background",
|
||||
"cascader-item-selected-bg": "@primary-1",
|
||||
"cascader-menu-bg": "@component-background",
|
||||
"cascader-menu-border-color-split": "@border-color-split",
|
||||
"cascader-dropdown-vertical-padding": "@dropdown-vertical-padding",
|
||||
"cascader-dropdown-edge-child-vertical-padding": "@dropdown-edge-child-vertical-padding",
|
||||
"cascader-dropdown-font-size": "@dropdown-font-size",
|
||||
"cascader-dropdown-line-height": "@dropdown-line-height",
|
||||
"anchor-bg": "@component-background",
|
||||
"anchor-border-color": "@border-color-split",
|
||||
"tooltip-max-width": "250px",
|
||||
"tooltip-color": "#fff",
|
||||
"tooltip-bg": "rgba(0, 0, 0, 0.75)",
|
||||
"tooltip-arrow-width": "5px",
|
||||
"tooltip-distance": "@tooltip-arrow-width - 1px + 4px",
|
||||
"tooltip-arrow-color": "@tooltip-bg",
|
||||
"popover-bg": "@component-background",
|
||||
"popover-color": "@text-color",
|
||||
"popover-min-width": "177px",
|
||||
"popover-min-height": "32px",
|
||||
"popover-arrow-width": "6px",
|
||||
"popover-arrow-color": "@popover-bg",
|
||||
"popover-arrow-outer-color": "@popover-bg",
|
||||
"popover-distance": "@popover-arrow-width + 4px",
|
||||
"popover-padding-horizontal": "@padding-md",
|
||||
"modal-body-padding": "@padding-lg",
|
||||
"modal-header-bg": "@component-background",
|
||||
"modal-header-padding": "@padding-md @padding-lg",
|
||||
"modal-header-border-color-split": "@border-color-split",
|
||||
"modal-header-close-size": "56px",
|
||||
"modal-content-bg": "@component-background",
|
||||
"modal-heading-color": "@heading-color",
|
||||
"modal-footer-bg": "transparent",
|
||||
"modal-footer-border-color-split": "@border-color-split",
|
||||
"modal-footer-padding-vertical": "10px",
|
||||
"modal-footer-padding-horizontal": "16px",
|
||||
"modal-mask-bg": "fade(@black, 45%)",
|
||||
"modal-confirm-body-padding": "32px 32px 24px",
|
||||
"progress-default-color": "@processing-color",
|
||||
"progress-remaining-color": "@background-color-base",
|
||||
"progress-text-color": "@text-color",
|
||||
"progress-radius": "100px",
|
||||
"progress-steps-item-bg": "#f3f3f3",
|
||||
"menu-inline-toplevel-item-height": "40px",
|
||||
"menu-item-height": "40px",
|
||||
"menu-item-group-height": "@line-height-base",
|
||||
"menu-collapsed-width": "80px",
|
||||
"menu-bg": "@component-background",
|
||||
"menu-popup-bg": "@component-background",
|
||||
"menu-item-color": "@text-color",
|
||||
"menu-highlight-color": "@primary-color",
|
||||
"menu-item-active-bg": "@primary-1",
|
||||
"menu-item-active-border-width": "3px",
|
||||
"menu-item-group-title-color": "@text-color-secondary",
|
||||
"menu-icon-size": "@font-size-base",
|
||||
"menu-icon-size-lg": "@font-size-lg",
|
||||
"menu-item-vertical-margin": "4px",
|
||||
"menu-item-font-size": "@font-size-base",
|
||||
"menu-item-boundary-margin": "8px",
|
||||
"menu-dark-color": "@text-color-secondary-dark",
|
||||
"menu-dark-bg": "@layout-header-background",
|
||||
"menu-dark-arrow-color": "#fff",
|
||||
"menu-dark-submenu-bg": "#000c17",
|
||||
"menu-dark-highlight-color": "#fff",
|
||||
"menu-dark-item-active-bg": "@primary-color",
|
||||
"menu-dark-selected-item-icon-color": "@white",
|
||||
"menu-dark-selected-item-text-color": "@white",
|
||||
"menu-dark-item-hover-bg": "transparent",
|
||||
"spin-dot-size-sm": "14px",
|
||||
"spin-dot-size": "20px",
|
||||
"spin-dot-size-lg": "32px",
|
||||
"table-bg": "@component-background",
|
||||
"table-header-bg": "@background-color-light",
|
||||
"table-header-color": "@heading-color",
|
||||
"table-header-sort-bg": "@background-color-base",
|
||||
"table-body-sort-bg": "#fafafa",
|
||||
"table-row-hover-bg": "@background-color-light",
|
||||
"table-selected-row-color": "inherit",
|
||||
"table-selected-row-bg": "@primary-1",
|
||||
"table-body-selected-sort-bg": "@table-selected-row-bg",
|
||||
"table-selected-row-hover-bg": "@table-selected-row-bg",
|
||||
"table-expanded-row-bg": "#fbfbfb",
|
||||
"table-padding-vertical": "16px",
|
||||
"table-padding-horizontal": "16px",
|
||||
"table-padding-vertical-md": "@table-padding-vertical * 3 / 4",
|
||||
"table-padding-horizontal-md": "@table-padding-horizontal / 2",
|
||||
"table-padding-vertical-sm": "@table-padding-vertical / 2",
|
||||
"table-padding-horizontal-sm": "@table-padding-horizontal / 2",
|
||||
"table-border-radius-base": "@border-radius-base",
|
||||
"table-footer-bg": "@background-color-light",
|
||||
"table-footer-color": "@heading-color",
|
||||
"table-header-bg-sm": "@table-header-bg",
|
||||
"table-header-sort-active-bg": "darken(@table-header-bg, 3%)",
|
||||
"table-header-filter-active-bg": "darken(@table-header-sort-active-bg, 5%)",
|
||||
"table-filter-btns-bg": "inherit",
|
||||
"table-filter-dropdown-bg": "@component-background",
|
||||
"table-expand-icon-bg": "@component-background",
|
||||
"tag-default-bg": "@background-color-light",
|
||||
"tag-default-color": "@text-color",
|
||||
"tag-font-size": "@font-size-sm",
|
||||
"picker-bg": "@component-background",
|
||||
"picker-basic-cell-hover-color": "@item-hover-bg",
|
||||
"picker-basic-cell-active-with-range-color": "@primary-1",
|
||||
"picker-basic-cell-hover-with-range-color": "lighten(@primary-color, 35%)",
|
||||
"picker-basic-cell-disabled-bg": "@disabled-bg",
|
||||
"picker-border-color": "@border-color-split",
|
||||
"picker-date-hover-range-border-color": "lighten(@primary-color, 20%)",
|
||||
"picker-date-hover-range-color": "@picker-basic-cell-hover-with-range-color",
|
||||
"picker-time-panel-cell-height": "28px",
|
||||
"calendar-bg": "@component-background",
|
||||
"calendar-input-bg": "@input-bg",
|
||||
"calendar-border-color": "@border-color-inverse",
|
||||
"calendar-item-active-bg": "@item-active-bg",
|
||||
"calendar-full-bg": "@calendar-bg",
|
||||
"calendar-full-panel-bg": "@calendar-full-bg",
|
||||
"carousel-dot-width": "16px",
|
||||
"carousel-dot-height": "3px",
|
||||
"carousel-dot-active-width": "24px",
|
||||
"badge-height": "20px",
|
||||
"badge-dot-size": "6px",
|
||||
"badge-font-size": "@font-size-sm",
|
||||
"badge-font-weight": "normal",
|
||||
"badge-status-size": "6px",
|
||||
"badge-text-color": "@component-background",
|
||||
"rate-star-color": "@yellow-6",
|
||||
"rate-star-bg": "@border-color-split",
|
||||
"card-head-color": "@heading-color",
|
||||
"card-head-background": "transparent",
|
||||
"card-head-font-size": "@font-size-lg",
|
||||
"card-head-font-size-sm": "@font-size-base",
|
||||
"card-head-padding": "16px",
|
||||
"card-head-padding-sm": "@card-head-padding / 2",
|
||||
"card-head-height": "48px",
|
||||
"card-head-height-sm": "36px",
|
||||
"card-inner-head-padding": "12px",
|
||||
"card-padding-base": "24px",
|
||||
"card-padding-base-sm": "@card-padding-base / 2",
|
||||
"card-actions-background": "@background-color-light",
|
||||
"card-actions-li-margin": "12px 0",
|
||||
"card-skeleton-bg": "#cfd8dc",
|
||||
"card-background": "@component-background",
|
||||
"card-shadow": "0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12),\n 0 5px 12px 4px rgba(0, 0, 0, 0.09)",
|
||||
"card-radius": "@border-radius-base",
|
||||
"card-head-tabs-margin-bottom": "-17px",
|
||||
"comment-bg": "inherit",
|
||||
"comment-padding-base": "@padding-md 0",
|
||||
"comment-nest-indent": "44px",
|
||||
"comment-font-size-base": "@font-size-base",
|
||||
"comment-font-size-sm": "@font-size-sm",
|
||||
"comment-author-name-color": "@text-color-secondary",
|
||||
"comment-author-time-color": "#ccc",
|
||||
"comment-action-color": "@text-color-secondary",
|
||||
"comment-action-hover-color": "#595959",
|
||||
"comment-actions-margin-bottom": "inherit",
|
||||
"comment-actions-margin-top": "@margin-sm",
|
||||
"comment-content-detail-p-margin-bottom": "inherit",
|
||||
"tabs-card-head-background": "@background-color-light",
|
||||
"tabs-card-height": "40px",
|
||||
"tabs-card-active-color": "@primary-color",
|
||||
"tabs-card-horizontal-padding": "(@tabs-card-height - floor(@font-size-base * @line-height-base)) / 2 -\n @border-width-base @padding-md",
|
||||
"tabs-card-horizontal-padding-sm": "6px @padding-md",
|
||||
"tabs-title-font-size": "@font-size-base",
|
||||
"tabs-title-font-size-lg": "@font-size-lg",
|
||||
"tabs-title-font-size-sm": "@font-size-base",
|
||||
"tabs-ink-bar-color": "@primary-color",
|
||||
"tabs-bar-margin": "0 0 @margin-md 0",
|
||||
"tabs-horizontal-margin": "0 32px 0 0",
|
||||
"tabs-horizontal-margin-rtl": "0 0 0 32px",
|
||||
"tabs-horizontal-padding": "@padding-sm 0",
|
||||
"tabs-horizontal-padding-lg": "@padding-md 0",
|
||||
"tabs-horizontal-padding-sm": "@padding-xs 0",
|
||||
"tabs-vertical-padding": "@padding-xs @padding-lg",
|
||||
"tabs-vertical-margin": "0 0 @margin-md 0",
|
||||
"tabs-scrolling-size": "32px",
|
||||
"tabs-highlight-color": "@primary-color",
|
||||
"tabs-hover-color": "@primary-5",
|
||||
"tabs-active-color": "@primary-7",
|
||||
"tabs-card-gutter": "2px",
|
||||
"tabs-card-tab-active-border-top": "2px solid transparent",
|
||||
"back-top-color": "#fff",
|
||||
"back-top-bg": "@text-color-secondary",
|
||||
"back-top-hover-bg": "@text-color",
|
||||
"avatar-size-base": "32px",
|
||||
"avatar-size-lg": "40px",
|
||||
"avatar-size-sm": "24px",
|
||||
"avatar-font-size-base": "18px",
|
||||
"avatar-font-size-lg": "24px",
|
||||
"avatar-font-size-sm": "14px",
|
||||
"avatar-bg": "#ccc",
|
||||
"avatar-color": "#fff",
|
||||
"avatar-border-radius": "@border-radius-base",
|
||||
"switch-height": "22px",
|
||||
"switch-sm-height": "16px",
|
||||
"switch-min-width": "44px",
|
||||
"switch-sm-min-width": "28px",
|
||||
"switch-sm-checked-margin-left": "-(@switch-sm-height - 3px)",
|
||||
"switch-disabled-opacity": "0.4",
|
||||
"switch-color": "@primary-color",
|
||||
"switch-bg": "@component-background",
|
||||
"switch-shadow-color": "fade(#00230b, 20%)",
|
||||
"pagination-item-bg": "@component-background",
|
||||
"pagination-item-size": "@height-base",
|
||||
"pagination-item-size-sm": "24px",
|
||||
"pagination-font-family": "Arial",
|
||||
"pagination-font-weight-active": "500",
|
||||
"pagination-item-bg-active": "@component-background",
|
||||
"pagination-item-link-bg": "@component-background",
|
||||
"pagination-item-disabled-color-active": "@white",
|
||||
"pagination-item-disabled-bg-active": "darken(@disabled-bg, 10%)",
|
||||
"pagination-item-input-bg": "@component-background",
|
||||
"pagination-mini-options-size-changer-top": "0px",
|
||||
"page-header-padding": "@padding-lg",
|
||||
"page-header-padding-vertical": "@padding-md",
|
||||
"page-header-padding-breadcrumb": "@padding-sm",
|
||||
"page-header-content-padding-vertical": "@padding-sm",
|
||||
"page-header-back-color": "#000",
|
||||
"page-header-ghost-bg": "inherit",
|
||||
"breadcrumb-base-color": "@text-color-secondary",
|
||||
"breadcrumb-last-item-color": "@text-color",
|
||||
"breadcrumb-font-size": "@font-size-base",
|
||||
"breadcrumb-icon-font-size": "@font-size-base",
|
||||
"breadcrumb-link-color": "@text-color-secondary",
|
||||
"breadcrumb-link-color-hover": "@primary-5",
|
||||
"breadcrumb-separator-color": "@text-color-secondary",
|
||||
"breadcrumb-separator-margin": "0 @padding-xs",
|
||||
"slider-margin": "10px 6px 10px",
|
||||
"slider-rail-background-color": "@background-color-base",
|
||||
"slider-rail-background-color-hover": "#e1e1e1",
|
||||
"slider-track-background-color": "@primary-3",
|
||||
"slider-track-background-color-hover": "@primary-4",
|
||||
"slider-handle-border-width": "2px",
|
||||
"slider-handle-background-color": "@component-background",
|
||||
"slider-handle-color": "@primary-3",
|
||||
"slider-handle-color-hover": "@primary-4",
|
||||
"slider-handle-color-focus": "tint(@primary-color, 20%)",
|
||||
"slider-handle-color-focus-shadow": "fade(@primary-color, 12%)",
|
||||
"slider-handle-color-tooltip-open": "@primary-color",
|
||||
"slider-handle-shadow": "0",
|
||||
"slider-dot-border-color": "@border-color-split",
|
||||
"slider-dot-border-color-active": "tint(@primary-color, 50%)",
|
||||
"slider-disabled-color": "@disabled-color",
|
||||
"slider-disabled-background-color": "@component-background",
|
||||
"tree-bg": "@component-background",
|
||||
"tree-title-height": "24px",
|
||||
"tree-child-padding": "18px",
|
||||
"tree-directory-selected-color": "#fff",
|
||||
"tree-directory-selected-bg": "@primary-color",
|
||||
"tree-node-hover-bg": "@item-hover-bg",
|
||||
"tree-node-selected-bg": "@primary-2",
|
||||
"collapse-header-padding": "@padding-sm @padding-md",
|
||||
"collapse-header-padding-extra": "40px",
|
||||
"collapse-header-bg": "@background-color-light",
|
||||
"collapse-content-padding": "@padding-md",
|
||||
"collapse-content-bg": "@component-background",
|
||||
"skeleton-color": "#f2f2f2",
|
||||
"skeleton-to-color": "shade(@skeleton-color, 5%)",
|
||||
"skeleton-paragraph-margin-top": "28px",
|
||||
"skeleton-paragraph-li-margin-top": "@margin-md",
|
||||
"transfer-header-height": "40px",
|
||||
"transfer-item-height": "@height-base",
|
||||
"transfer-disabled-bg": "@disabled-bg",
|
||||
"transfer-list-height": "200px",
|
||||
"transfer-item-hover-bg": "@item-hover-bg",
|
||||
"transfer-item-padding-vertical": "6px",
|
||||
"transfer-list-search-icon-top": "12px",
|
||||
"message-notice-content-padding": "10px 16px",
|
||||
"message-notice-content-bg": "@component-background",
|
||||
"wave-animation-width": "6px",
|
||||
"alert-success-border-color": "~`colorPalette('@{success-color}', 3) `",
|
||||
"alert-success-bg-color": "~`colorPalette('@{success-color}', 1) `",
|
||||
"alert-success-icon-color": "@success-color",
|
||||
"alert-info-border-color": "~`colorPalette('@{info-color}', 3) `",
|
||||
"alert-info-bg-color": "~`colorPalette('@{info-color}', 1) `",
|
||||
"alert-info-icon-color": "@info-color",
|
||||
"alert-warning-border-color": "~`colorPalette('@{warning-color}', 3) `",
|
||||
"alert-warning-bg-color": "~`colorPalette('@{warning-color}', 1) `",
|
||||
"alert-warning-icon-color": "@warning-color",
|
||||
"alert-error-border-color": "~`colorPalette('@{error-color}', 3) `",
|
||||
"alert-error-bg-color": "~`colorPalette('@{error-color}', 1) `",
|
||||
"alert-error-icon-color": "@error-color",
|
||||
"alert-message-color": "@heading-color",
|
||||
"alert-text-color": "@text-color",
|
||||
"alert-close-color": "@text-color-secondary",
|
||||
"alert-close-hover-color": "@icon-color-hover",
|
||||
"alert-no-icon-padding-vertical": "@padding-xs",
|
||||
"alert-with-description-no-icon-padding-vertical": "@padding-md - 1px",
|
||||
"list-header-background": "transparent",
|
||||
"list-footer-background": "transparent",
|
||||
"list-empty-text-padding": "@padding-md",
|
||||
"list-item-padding": "@padding-sm 0",
|
||||
"list-item-padding-sm": "@padding-xs @padding-md",
|
||||
"list-item-padding-lg": "16px 24px",
|
||||
"list-item-meta-margin-bottom": "@padding-md",
|
||||
"list-item-meta-avatar-margin-right": "@padding-md",
|
||||
"list-item-meta-title-margin-bottom": "@padding-sm",
|
||||
"list-customize-card-bg": "@component-background",
|
||||
"list-item-meta-description-font-size": "@font-size-base",
|
||||
"statistic-title-font-size": "@font-size-base",
|
||||
"statistic-content-font-size": "24px",
|
||||
"statistic-unit-font-size": "16px",
|
||||
"statistic-font-family": "@font-family",
|
||||
"drawer-header-padding": "@padding-md @padding-lg",
|
||||
"drawer-body-padding": "@padding-lg",
|
||||
"drawer-bg": "@component-background",
|
||||
"drawer-footer-padding-vertical": "@modal-footer-padding-vertical",
|
||||
"drawer-footer-padding-horizontal": "@modal-footer-padding-horizontal",
|
||||
"drawer-header-close-size": "56px",
|
||||
"timeline-width": "2px",
|
||||
"timeline-color": "@border-color-split",
|
||||
"timeline-dot-border-width": "2px",
|
||||
"timeline-dot-color": "@primary-color",
|
||||
"timeline-dot-bg": "@component-background",
|
||||
"timeline-item-padding-bottom": "20px",
|
||||
"typography-title-font-weight": "600",
|
||||
"typography-title-margin-top": "1.2em",
|
||||
"typography-title-margin-bottom": "0.5em",
|
||||
"upload-actions-color": "@text-color-secondary",
|
||||
"process-tail-color": "@border-color-split",
|
||||
"steps-nav-arrow-color": "fade(@black, 25%)",
|
||||
"steps-background": "@component-background",
|
||||
"steps-icon-size": "32px",
|
||||
"steps-icon-custom-size": "@steps-icon-size",
|
||||
"steps-icon-custom-top": "0px",
|
||||
"steps-icon-custom-font-size": "24px",
|
||||
"steps-icon-top": "-1px",
|
||||
"steps-icon-font-size": "@font-size-lg",
|
||||
"steps-icon-margin": "0 8px 0 0",
|
||||
"steps-title-line-height": "@height-base",
|
||||
"steps-small-icon-size": "24px",
|
||||
"steps-small-icon-margin": "0 8px 0 0",
|
||||
"steps-dot-size": "8px",
|
||||
"steps-dot-top": "2px",
|
||||
"steps-current-dot-size": "10px",
|
||||
"steps-desciption-max-width": "140px",
|
||||
"steps-nav-content-max-width": "auto",
|
||||
"notification-bg": "@component-background"
|
||||
};
|
||||
+53
File diff suppressed because one or more lines are too long
+396
@@ -0,0 +1,396 @@
|
||||
const defaultTheme = require('./default-theme.js');
|
||||
const darkThemeSingle = {
|
||||
"theme": "dark",
|
||||
"blue-1": "mix(color(~`colorPalette('@{blue-base}', 8) `), @component-background, 15%)",
|
||||
"blue-2": "mix(color(~`colorPalette('@{blue-base}', 7) `), @component-background, 25%)",
|
||||
"blue-3": "mix(@blue-base, @component-background, 30%)",
|
||||
"blue-4": "mix(@blue-base, @component-background, 45%)",
|
||||
"blue-5": "mix(@blue-base, @component-background, 65%)",
|
||||
"blue-6": "mix(@blue-base, @component-background, 85%)",
|
||||
"blue-7": "mix(color(~`colorPalette('@{blue-base}', 5) `), @component-background, 90%)",
|
||||
"blue-8": "mix(color(~`colorPalette('@{blue-base}', 4) `), @component-background, 95%)",
|
||||
"blue-9": "mix(color(~`colorPalette('@{blue-base}', 3) `), @component-background, 97%)",
|
||||
"blue-10": "mix(color(~`colorPalette('@{blue-base}', 2) `), @component-background, 98%)",
|
||||
"purple-1": "mix(color(~`colorPalette('@{purple-base}', 8) `), @component-background, 15%)",
|
||||
"purple-2": "mix(color(~`colorPalette('@{purple-base}', 7) `), @component-background, 25%)",
|
||||
"purple-3": "mix(@purple-base, @component-background, 30%)",
|
||||
"purple-4": "mix(@purple-base, @component-background, 45%)",
|
||||
"purple-5": "mix(@purple-base, @component-background, 65%)",
|
||||
"purple-6": "mix(@purple-base, @component-background, 85%)",
|
||||
"purple-7": "mix(color(~`colorPalette('@{purple-base}', 5) `), @component-background, 90%)",
|
||||
"purple-8": "mix(color(~`colorPalette('@{purple-base}', 4) `), @component-background, 95%)",
|
||||
"purple-9": "mix(color(~`colorPalette('@{purple-base}', 3) `), @component-background, 97%)",
|
||||
"purple-10": "mix(color(~`colorPalette('@{purple-base}', 2) `), @component-background, 98%)",
|
||||
"cyan-1": "mix(color(~`colorPalette('@{cyan-base}', 8) `), @component-background, 15%)",
|
||||
"cyan-2": "mix(color(~`colorPalette('@{cyan-base}', 7) `), @component-background, 25%)",
|
||||
"cyan-3": "mix(@cyan-base, @component-background, 30%)",
|
||||
"cyan-4": "mix(@cyan-base, @component-background, 45%)",
|
||||
"cyan-5": "mix(@cyan-base, @component-background, 65%)",
|
||||
"cyan-6": "mix(@cyan-base, @component-background, 85%)",
|
||||
"cyan-7": "mix(color(~`colorPalette('@{cyan-base}', 5) `), @component-background, 90%)",
|
||||
"cyan-8": "mix(color(~`colorPalette('@{cyan-base}', 4) `), @component-background, 95%)",
|
||||
"cyan-9": "mix(color(~`colorPalette('@{cyan-base}', 3) `), @component-background, 97%)",
|
||||
"cyan-10": "mix(color(~`colorPalette('@{cyan-base}', 2) `), @component-background, 98%)",
|
||||
"green-1": "mix(color(~`colorPalette('@{green-base}', 8) `), @component-background, 15%)",
|
||||
"green-2": "mix(color(~`colorPalette('@{green-base}', 7) `), @component-background, 25%)",
|
||||
"green-3": "mix(@green-base, @component-background, 30%)",
|
||||
"green-4": "mix(@green-base, @component-background, 45%)",
|
||||
"green-5": "mix(@green-base, @component-background, 65%)",
|
||||
"green-6": "mix(@green-base, @component-background, 85%)",
|
||||
"green-7": "mix(color(~`colorPalette('@{green-base}', 5) `), @component-background, 90%)",
|
||||
"green-8": "mix(color(~`colorPalette('@{green-base}', 4) `), @component-background, 95%)",
|
||||
"green-9": "mix(color(~`colorPalette('@{green-base}', 3) `), @component-background, 97%)",
|
||||
"green-10": "mix(color(~`colorPalette('@{green-base}', 2) `), @component-background, 98%)",
|
||||
"magenta-1": "mix(color(~`colorPalette('@{magenta-base}', 8) `), @component-background, 15%)",
|
||||
"magenta-2": "mix(color(~`colorPalette('@{magenta-base}', 7) `), @component-background, 25%)",
|
||||
"magenta-3": "mix(@magenta-base, @component-background, 30%)",
|
||||
"magenta-4": "mix(@magenta-base, @component-background, 45%)",
|
||||
"magenta-5": "mix(@magenta-base, @component-background, 65%)",
|
||||
"magenta-6": "mix(@magenta-base, @component-background, 85%)",
|
||||
"magenta-7": "mix(color(~`colorPalette('@{magenta-base}', 5) `), @component-background, 90%)",
|
||||
"magenta-8": "mix(color(~`colorPalette('@{magenta-base}', 4) `), @component-background, 95%)",
|
||||
"magenta-9": "mix(color(~`colorPalette('@{magenta-base}', 3) `), @component-background, 97%)",
|
||||
"magenta-10": "mix(color(~`colorPalette('@{magenta-base}', 2) `), @component-background, 98%)",
|
||||
"pink-1": "mix(color(~`colorPalette('@{pink-base}', 8) `), @component-background, 15%)",
|
||||
"pink-2": "mix(color(~`colorPalette('@{pink-base}', 7) `), @component-background, 25%)",
|
||||
"pink-3": "mix(@pink-base, @component-background, 30%)",
|
||||
"pink-4": "mix(@pink-base, @component-background, 45%)",
|
||||
"pink-5": "mix(@pink-base, @component-background, 65%)",
|
||||
"pink-6": "mix(@pink-base, @component-background, 85%)",
|
||||
"pink-7": "mix(color(~`colorPalette('@{pink-base}', 5) `), @component-background, 90%)",
|
||||
"pink-8": "mix(color(~`colorPalette('@{pink-base}', 4) `), @component-background, 95%)",
|
||||
"pink-9": "mix(color(~`colorPalette('@{pink-base}', 3) `), @component-background, 97%)",
|
||||
"pink-10": "mix(color(~`colorPalette('@{pink-base}', 2) `), @component-background, 98%)",
|
||||
"red-1": "mix(color(~`colorPalette('@{red-base}', 8) `), @component-background, 15%)",
|
||||
"red-2": "mix(color(~`colorPalette('@{red-base}', 7) `), @component-background, 25%)",
|
||||
"red-3": "mix(@red-base, @component-background, 30%)",
|
||||
"red-4": "mix(@red-base, @component-background, 45%)",
|
||||
"red-5": "mix(@red-base, @component-background, 65%)",
|
||||
"red-6": "mix(@red-base, @component-background, 85%)",
|
||||
"red-7": "mix(color(~`colorPalette('@{red-base}', 5) `), @component-background, 90%)",
|
||||
"red-8": "mix(color(~`colorPalette('@{red-base}', 4) `), @component-background, 95%)",
|
||||
"red-9": "mix(color(~`colorPalette('@{red-base}', 3) `), @component-background, 97%)",
|
||||
"red-10": "mix(color(~`colorPalette('@{red-base}', 2) `), @component-background, 98%)",
|
||||
"orange-1": "mix(color(~`colorPalette('@{orange-base}', 8) `), @component-background, 15%)",
|
||||
"orange-2": "mix(color(~`colorPalette('@{orange-base}', 7) `), @component-background, 25%)",
|
||||
"orange-3": "mix(@orange-base, @component-background, 30%)",
|
||||
"orange-4": "mix(@orange-base, @component-background, 45%)",
|
||||
"orange-5": "mix(@orange-base, @component-background, 65%)",
|
||||
"orange-6": "mix(@orange-base, @component-background, 85%)",
|
||||
"orange-7": "mix(color(~`colorPalette('@{orange-base}', 5) `), @component-background, 90%)",
|
||||
"orange-8": "mix(color(~`colorPalette('@{orange-base}', 4) `), @component-background, 95%)",
|
||||
"orange-9": "mix(color(~`colorPalette('@{orange-base}', 3) `), @component-background, 97%)",
|
||||
"orange-10": "mix(color(~`colorPalette('@{orange-base}', 2) `), @component-background, 98%)",
|
||||
"yellow-1": "mix(color(~`colorPalette('@{yellow-base}', 8) `), @component-background, 15%)",
|
||||
"yellow-2": "mix(color(~`colorPalette('@{yellow-base}', 7) `), @component-background, 25%)",
|
||||
"yellow-3": "mix(@yellow-base, @component-background, 30%)",
|
||||
"yellow-4": "mix(@yellow-base, @component-background, 45%)",
|
||||
"yellow-5": "mix(@yellow-base, @component-background, 65%)",
|
||||
"yellow-6": "mix(@yellow-base, @component-background, 85%)",
|
||||
"yellow-7": "mix(color(~`colorPalette('@{yellow-base}', 5) `), @component-background, 90%)",
|
||||
"yellow-8": "mix(color(~`colorPalette('@{yellow-base}', 4) `), @component-background, 95%)",
|
||||
"yellow-9": "mix(color(~`colorPalette('@{yellow-base}', 3) `), @component-background, 97%)",
|
||||
"yellow-10": "mix(color(~`colorPalette('@{yellow-base}', 2) `), @component-background, 98%)",
|
||||
"volcano-1": "mix(color(~`colorPalette('@{volcano-base}', 8) `), @component-background, 15%)",
|
||||
"volcano-2": "mix(color(~`colorPalette('@{volcano-base}', 7) `), @component-background, 25%)",
|
||||
"volcano-3": "mix(@volcano-base, @component-background, 30%)",
|
||||
"volcano-4": "mix(@volcano-base, @component-background, 45%)",
|
||||
"volcano-5": "mix(@volcano-base, @component-background, 65%)",
|
||||
"volcano-6": "mix(@volcano-base, @component-background, 85%)",
|
||||
"volcano-7": "mix(color(~`colorPalette('@{volcano-base}', 5) `), @component-background, 90%)",
|
||||
"volcano-8": "mix(color(~`colorPalette('@{volcano-base}', 4) `), @component-background, 95%)",
|
||||
"volcano-9": "mix(color(~`colorPalette('@{volcano-base}', 3) `), @component-background, 97%)",
|
||||
"volcano-10": "mix(color(~`colorPalette('@{volcano-base}', 2) `), @component-background, 98%)",
|
||||
"geekblue-1": "mix(color(~`colorPalette('@{geekblue-base}', 8) `), @component-background, 15%)",
|
||||
"geekblue-2": "mix(color(~`colorPalette('@{geekblue-base}', 7) `), @component-background, 25%)",
|
||||
"geekblue-3": "mix(@geekblue-base, @component-background, 30%)",
|
||||
"geekblue-4": "mix(@geekblue-base, @component-background, 45%)",
|
||||
"geekblue-5": "mix(@geekblue-base, @component-background, 65%)",
|
||||
"geekblue-6": "mix(@geekblue-base, @component-background, 85%)",
|
||||
"geekblue-7": "mix(color(~`colorPalette('@{geekblue-base}', 5) `), @component-background, 90%)",
|
||||
"geekblue-8": "mix(color(~`colorPalette('@{geekblue-base}', 4) `), @component-background, 95%)",
|
||||
"geekblue-9": "mix(color(~`colorPalette('@{geekblue-base}', 3) `), @component-background, 97%)",
|
||||
"geekblue-10": "mix(color(~`colorPalette('@{geekblue-base}', 2) `), @component-background, 98%)",
|
||||
"lime-1": "mix(color(~`colorPalette('@{lime-base}', 8) `), @component-background, 15%)",
|
||||
"lime-2": "mix(color(~`colorPalette('@{lime-base}', 7) `), @component-background, 25%)",
|
||||
"lime-3": "mix(@lime-base, @component-background, 30%)",
|
||||
"lime-4": "mix(@lime-base, @component-background, 45%)",
|
||||
"lime-5": "mix(@lime-base, @component-background, 65%)",
|
||||
"lime-6": "mix(@lime-base, @component-background, 85%)",
|
||||
"lime-7": "mix(color(~`colorPalette('@{lime-base}', 5) `), @component-background, 90%)",
|
||||
"lime-8": "mix(color(~`colorPalette('@{lime-base}', 4) `), @component-background, 95%)",
|
||||
"lime-9": "mix(color(~`colorPalette('@{lime-base}', 3) `), @component-background, 97%)",
|
||||
"lime-10": "mix(color(~`colorPalette('@{lime-base}', 2) `), @component-background, 98%)",
|
||||
"gold-1": "mix(color(~`colorPalette('@{gold-base}', 8) `), @component-background, 15%)",
|
||||
"gold-2": "mix(color(~`colorPalette('@{gold-base}', 7) `), @component-background, 25%)",
|
||||
"gold-3": "mix(@gold-base, @component-background, 30%)",
|
||||
"gold-4": "mix(@gold-base, @component-background, 45%)",
|
||||
"gold-5": "mix(@gold-base, @component-background, 65%)",
|
||||
"gold-6": "mix(@gold-base, @component-background, 85%)",
|
||||
"gold-7": "mix(color(~`colorPalette('@{gold-base}', 5) `), @component-background, 90%)",
|
||||
"gold-8": "mix(color(~`colorPalette('@{gold-base}', 4) `), @component-background, 95%)",
|
||||
"gold-9": "mix(color(~`colorPalette('@{gold-base}', 3) `), @component-background, 97%)",
|
||||
"gold-10": "mix(color(~`colorPalette('@{gold-base}', 2) `), @component-background, 98%)",
|
||||
"primary-1": "mix(color(~`colorPalette('@{primary-color}', 8) `), @component-background, 15%)",
|
||||
"primary-2": "mix(color(~`colorPalette('@{primary-color}', 7) `), @component-background, 25%)",
|
||||
"primary-3": "mix(@primary-color, @component-background, 30%)",
|
||||
"primary-4": "mix(@primary-color, @component-background, 45%)",
|
||||
"primary-5": "mix(@primary-color, @component-background, 65%)",
|
||||
"primary-6": "@primary-color",
|
||||
"primary-7": "mix(color(~`colorPalette('@{primary-color}', 5) `), @component-background, 90%)",
|
||||
"primary-8": "mix(color(~`colorPalette('@{primary-color}', 4) `), @component-background, 95%)",
|
||||
"primary-9": "mix(color(~`colorPalette('@{primary-color}', 3) `), @component-background, 97%)",
|
||||
"primary-10": "mix(color(~`colorPalette('@{primary-color}', 2) `), @component-background, 98%)",
|
||||
"popover-background": "#1f1f1f",
|
||||
"popover-customize-border-color": "#3a3a3a",
|
||||
"body-background": "@black",
|
||||
"component-background": "#141414",
|
||||
"text-color": "fade(@white, 65%)",
|
||||
"text-color-secondary": "fade(@white, 45%)",
|
||||
"text-color-inverse": "@white",
|
||||
"icon-color-hover": "fade(@white, 75%)",
|
||||
"heading-color": "fade(@white, 85%)",
|
||||
"item-active-bg": "@primary-1",
|
||||
"item-hover-bg": "fade(@white, 8%)",
|
||||
"border-color-base": "#434343",
|
||||
"border-color-split": "#303030",
|
||||
"background-color-light": "fade(@white, 4%)",
|
||||
"background-color-base": "fade(@white, 8%)",
|
||||
"disabled-color": "fade(@white, 30%)",
|
||||
"disabled-bg": "@background-color-base",
|
||||
"disabled-color-dark": "fade(@white, 30%)",
|
||||
"tree-bg": "transparent",
|
||||
"list-customize-card-bg": "transparent",
|
||||
"shadow-color": "rgba(0, 0, 0, 0.45)",
|
||||
"shadow-color-inverse": "@component-background",
|
||||
"box-shadow-base": "@shadow-2",
|
||||
"shadow-1-up": "0 -6px 16px -8px rgba(0, 0, 0, 0.32), 0 -9px 28px 0 rgba(0, 0, 0, 0.2),\n 0 -12px 48px 16px rgba(0, 0, 0, 0.12)",
|
||||
"shadow-1-down": "0 6px 16px -8px rgba(0, 0, 0, 0.32), 0 9px 28px 0 rgba(0, 0, 0, 0.2),\n 0 12px 48px 16px rgba(0, 0, 0, 0.12)",
|
||||
"shadow-1-right": "6px 0 16px -8px rgba(0, 0, 0, 0.32), 9px 0 28px 0 rgba(0, 0, 0, 0.2),\n 12px 0 48px 16px rgba(0, 0, 0, 0.12)",
|
||||
"shadow-2": "0 3px 6px -4px rgba(0, 0, 0, 0.48), 0 6px 16px 0 rgba(0, 0, 0, 0.32),\n 0 9px 28px 8px rgba(0, 0, 0, 0.2)",
|
||||
"btn-shadow": "0 2px 0 rgba(0, 0, 0, 0.015)",
|
||||
"btn-primary-shadow": "0 2px 0 rgba(0, 0, 0, 0.045)",
|
||||
"btn-text-shadow": "0 -1px 0 rgba(0, 0, 0, 0.12)",
|
||||
"btn-default-bg": "transparent",
|
||||
"btn-default-ghost-color": "@text-color",
|
||||
"btn-default-ghost-border": "fade(@white, 25%)",
|
||||
"btn-link-ghost-color": "@text-color",
|
||||
"checkbox-check-bg": "transparent",
|
||||
"descriptions-bg": "@background-color-light",
|
||||
"modal-header-bg": "@popover-background",
|
||||
"modal-header-border-color-split": "@border-color-split",
|
||||
"modal-content-bg": "@popover-background",
|
||||
"modal-footer-border-color-split": "@border-color-split",
|
||||
"radtio-solid-checked-color": "@white",
|
||||
"radio-solid-checked-color": "@radtio-solid-checked-color",
|
||||
"radio-dot-disabled-color": "fade(@white, 20%)",
|
||||
"radio-disabled-button-checked-bg": "fade(@white, 20%)",
|
||||
"radio-disabled-button-checked-color": "@black",
|
||||
"layout-body-background": "@body-background",
|
||||
"layout-header-background": "@popover-background",
|
||||
"layout-trigger-background": "#262626",
|
||||
"input-bg": "transparent",
|
||||
"input-placeholder-color": "fade(@white, 30%)",
|
||||
"input-icon-color": "fade(@white, 30%)",
|
||||
"input-number-handler-bg": "transparent",
|
||||
"input-number-handler-active-bg": "@item-hover-bg",
|
||||
"input-icon-hover-color": "fade(@white, 85%)",
|
||||
"select-background": "transparent",
|
||||
"select-dropdown-bg": "@popover-background",
|
||||
"select-clear-background": "@component-background",
|
||||
"select-selection-item-bg": "fade(@white, 8)",
|
||||
"select-selection-item-border-color": "@border-color-split",
|
||||
"cascader-bg": "transparent",
|
||||
"cascader-menu-bg": "@popover-background",
|
||||
"cascader-menu-border-color-split": "@border-color-split",
|
||||
"tooltip-bg": "#434343",
|
||||
"menu-dark-submenu-bg": "@component-background",
|
||||
"menu-dark-bg": "@popover-background",
|
||||
"menu-popup-bg": "@popover-background",
|
||||
"message-notice-content-bg": "@popover-background",
|
||||
"notification-bg": "@popover-background",
|
||||
"link-hover-color": "@primary-5",
|
||||
"link-active-color": "@primary-7",
|
||||
"table-header-bg": "#1d1d1d",
|
||||
"table-body-sort-bg": "fade(@white, 1%)",
|
||||
"table-row-hover-bg": "#262626",
|
||||
"table-header-sort-bg": "#262626",
|
||||
"table-header-filter-active-bg": "#434343",
|
||||
"table-header-sort-active-bg": "#303030",
|
||||
"table-filter-btns-bg": "@popover-background",
|
||||
"table-expanded-row-bg": "@table-header-bg",
|
||||
"table-filter-dropdown-bg": "@popover-background",
|
||||
"table-expand-icon-bg": "transparent",
|
||||
"picker-basic-cell-hover-with-range-color": "darken(@primary-color, 35%)",
|
||||
"picker-basic-cell-disabled-bg": "#303030",
|
||||
"picker-border-color": "@border-color-split",
|
||||
"picker-bg": "transparent",
|
||||
"picker-date-hover-range-border-color": "darken(@primary-color, 20%)",
|
||||
"dropdown-menu-bg": "@popover-background",
|
||||
"dropdown-menu-submenu-disabled-bg": "transparent",
|
||||
"steps-nav-arrow-color": "fade(@white, 20%)",
|
||||
"steps-background": "transparent",
|
||||
"avatar-bg": "fade(@white, 30%)",
|
||||
"progress-steps-item-bg": "fade(@white, 8%)",
|
||||
"calendar-bg": "@popover-background",
|
||||
"calendar-input-bg": "@calendar-bg",
|
||||
"calendar-border-color": "transparent",
|
||||
"calendar-full-bg": "@component-background",
|
||||
"badge-text-color": "@white",
|
||||
"popover-bg": "@popover-background",
|
||||
"drawer-bg": "@popover-background",
|
||||
"card-actions-background": "@background-color-light",
|
||||
"card-skeleton-bg": "#303030",
|
||||
"card-shadow": "0 1px 2px -2px rgba(0, 0, 0, 0.64), 0 3px 6px 0 rgba(0, 0, 0, 0.48),\n 0 5px 12px 4px rgba(0, 0, 0, 0.36)",
|
||||
"transfer-item-hover-bg": "#262626",
|
||||
"comment-bg": "transparent",
|
||||
"comment-author-time-color": "fade(@white, 30%)",
|
||||
"comment-action-hover-color": "fade(@white, 65%)",
|
||||
"rate-star-bg": "fade(@white, 12%)",
|
||||
"switch-bg": "@white",
|
||||
"pagination-item-bg": "transparent",
|
||||
"pagination-item-bg-active": "transparent",
|
||||
"pagination-item-link-bg": "transparent",
|
||||
"pagination-item-disabled-bg-active": "fade(@white, 25%)",
|
||||
"pagination-item-disabled-color-active": "@black",
|
||||
"pagination-item-input-bg": "@pagination-item-bg",
|
||||
"page-header-back-color": "@icon-color",
|
||||
"page-header-ghost-bg": "transparent",
|
||||
"slider-rail-background-color": "#262626",
|
||||
"slider-rail-background-color-hover": "@border-color-base",
|
||||
"slider-dot-border-color": "@border-color-split",
|
||||
"slider-dot-border-color-active": "@primary-4",
|
||||
"skeleton-color": "#303030",
|
||||
"skeleton-to-color": "fade(@white, 16%)",
|
||||
"alert-success-border-color": "@green-3",
|
||||
"alert-success-bg-color": "@green-1",
|
||||
"alert-success-icon-color": "@success-color",
|
||||
"alert-info-border-color": "@primary-3",
|
||||
"alert-info-bg-color": "@primary-1",
|
||||
"alert-info-icon-color": "@info-color",
|
||||
"alert-warning-border-color": "@gold-3",
|
||||
"alert-warning-bg-color": "@gold-1",
|
||||
"alert-warning-icon-color": "@warning-color",
|
||||
"alert-error-border-color": "@red-3",
|
||||
"alert-error-bg-color": "@red-1",
|
||||
"alert-error-icon-color": "@error-color",
|
||||
"timeline-color": "@border-color-split",
|
||||
"timeline-dot-color": "@primary-color",
|
||||
"mentions-dropdown-bg": "@popover-background"
|
||||
};
|
||||
const compactThemeSingle = {
|
||||
"mode": "compact",
|
||||
"default-padding-lg": "24px",
|
||||
"default-padding-md": "16px",
|
||||
"default-padding-sm": "12px",
|
||||
"default-padding-xs": "8px",
|
||||
"default-padding-xss": "4px",
|
||||
"padding-lg": "16px",
|
||||
"padding-md": "8px",
|
||||
"padding-sm": "8px",
|
||||
"padding-xs": "4px",
|
||||
"padding-xss": "0px",
|
||||
"control-padding-horizontal": "@padding-sm",
|
||||
"control-padding-horizontal-sm": "@default-padding-xs",
|
||||
"margin-lg": "16px",
|
||||
"margin-md": "8px",
|
||||
"margin-sm": "8px",
|
||||
"margin-xs": "4px",
|
||||
"margin-xss": "0px",
|
||||
"height-base": "28px",
|
||||
"height-lg": "32px",
|
||||
"height-sm": "22px",
|
||||
"btn-padding-horizontal-base": "@default-padding-sm - 1px",
|
||||
"btn-padding-horizontal-lg": "@btn-padding-horizontal-base",
|
||||
"btn-padding-horizontal-sm": "@default-padding-xs - 1px",
|
||||
"btn-square-only-icon-size": "14px",
|
||||
"btn-square-only-icon-size-sm": "14px",
|
||||
"btn-square-only-icon-size-lg": "16px",
|
||||
"dropdown-line-height": "18px",
|
||||
"form-item-margin-bottom": "16px",
|
||||
"input-padding-vertical-base": "max(\n round((@input-height-base - @font-size-base * @line-height-base) / 2 * 10) / 10 -\n @border-width-base,\n 2px\n)",
|
||||
"input-padding-horizontal-lg": "11px",
|
||||
"page-header-padding": "16px",
|
||||
"page-header-padding-vertical": "8px",
|
||||
"pagination-mini-options-size-changer-top": "1px",
|
||||
"cascader-dropdown-line-height": "@dropdown-line-height",
|
||||
"select-dropdown-height": "@height-base",
|
||||
"select-single-item-height-lg": "32px",
|
||||
"select-multiple-item-height": "@input-height-base - max(@input-padding-vertical-base, 4) * 2",
|
||||
"select-multiple-item-height-lg": "24px",
|
||||
"select-multiple-item-spacing-half": "3px",
|
||||
"tree-title-height": "20px",
|
||||
"transfer-item-padding-vertical": "3px",
|
||||
"transfer-list-search-icon-top": "8px",
|
||||
"comment-actions-margin-bottom": "0px",
|
||||
"comment-actions-margin-top": "@margin-xs",
|
||||
"comment-content-detail-p-margin-bottom": "0px",
|
||||
"steps-icon-size": "24px",
|
||||
"steps-icon-custom-size": "20px",
|
||||
"steps-icon-custom-font-size": "20px",
|
||||
"steps-icon-custom-top": "2px",
|
||||
"steps-icon-margin": "2px 8px 2px 0",
|
||||
"steps-icon-font-size": "@font-size-base",
|
||||
"steps-dot-top": "4px",
|
||||
"steps-icon-top": "0px",
|
||||
"collapse-header-padding-extra": "32px",
|
||||
"list-item-meta-description-font-size": "@font-size-sm",
|
||||
"list-item-padding-sm": "4px 12px",
|
||||
"list-item-padding-lg": "12px 16px",
|
||||
"drawer-header-padding": "11px @padding-lg",
|
||||
"drawer-footer-padding-vertical": "@padding-sm",
|
||||
"drawer-header-close-size": "44px",
|
||||
"modal-header-padding": "11px @padding-lg",
|
||||
"modal-footer-padding-vertical": "@padding-sm",
|
||||
"modal-header-close-size": "44px",
|
||||
"modal-confirm-body-padding": "24px 24px 16px",
|
||||
"popover-min-height": "28px",
|
||||
"popover-padding-horizontal": "@default-padding-sm",
|
||||
"card-padding-base": "12px",
|
||||
"card-head-height": "36px",
|
||||
"card-head-font-size": "@card-head-font-size-sm",
|
||||
"card-head-padding": "8px",
|
||||
"card-padding-base-sm": "@card-padding-base",
|
||||
"card-head-height-sm": "30px",
|
||||
"card-head-padding-sm": "4px",
|
||||
"card-actions-li-margin": "4px 0",
|
||||
"card-head-tabs-margin-bottom": "-9px",
|
||||
"table-padding-vertical": "12px",
|
||||
"table-padding-horizontal": "8px",
|
||||
"table-padding-vertical-md": "8px",
|
||||
"table-padding-horizontal-md": "8px",
|
||||
"table-padding-vertical-sm": "4px",
|
||||
"table-padding-horizontal-sm": "4px",
|
||||
"statistic-content-font-size": "20px",
|
||||
"alert-with-description-no-icon-padding-vertical": "11px",
|
||||
"skeleton-paragraph-margin-top": "20px",
|
||||
"skeleton-paragraph-li-margin-top": "12px",
|
||||
"descriptions-title-margin-bottom": "8px",
|
||||
"descriptions-default-padding": "12px @padding-lg"
|
||||
};
|
||||
|
||||
function getThemeVariables(options = {}) {
|
||||
let themeVar = {
|
||||
'hack': `true;@import "${require.resolve('antd/lib/style/color/colorPalette.less')}";`,
|
||||
...defaultTheme
|
||||
};
|
||||
if(options.dark) {
|
||||
themeVar = {
|
||||
...themeVar,
|
||||
...darkThemeSingle
|
||||
}
|
||||
}
|
||||
if(options.compact){
|
||||
themeVar = {
|
||||
...themeVar,
|
||||
...compactThemeSingle
|
||||
}
|
||||
}
|
||||
return themeVar;
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
darkThemeSingle,
|
||||
compactThemeSingle,
|
||||
getThemeVariables
|
||||
}
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
import { ElementOf } from './type';
|
||||
export declare const PresetStatusColorTypes: ["success", "processing", "error", "default", "warning"];
|
||||
export declare const PresetColorTypes: ["pink", "red", "yellow", "orange", "cyan", "green", "blue", "purple", "geekblue", "magenta", "volcano", "gold", "lime"];
|
||||
export declare type PresetColorType = ElementOf<typeof PresetColorTypes>;
|
||||
export declare type PresetStatusColorType = ElementOf<typeof PresetStatusColorTypes>;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import { tuple } from './type';
|
||||
export var PresetStatusColorTypes = tuple('success', 'processing', 'error', 'default', 'warning'); // eslint-disable-next-line import/prefer-default-export
|
||||
|
||||
export var PresetColorTypes = tuple('pink', 'red', 'yellow', 'orange', 'cyan', 'green', 'blue', 'purple', 'geekblue', 'magenta', 'volcano', 'gold', 'lime');
|
||||
+1
@@ -0,0 +1 @@
|
||||
export declare function easeInOutCubic(t: number, b: number, c: number, d: number): number;
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
// eslint-disable-next-line import/prefer-default-export
|
||||
export function easeInOutCubic(t, b, c, d) {
|
||||
var cc = c - b;
|
||||
t /= d / 2;
|
||||
|
||||
if (t < 1) {
|
||||
return cc / 2 * t * t * t + b;
|
||||
}
|
||||
|
||||
return cc / 2 * ((t -= 2) * t * t + 2) + b;
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
export default function getDataOrAriaProps(props: any): any;
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
export default function getDataOrAriaProps(props) {
|
||||
return Object.keys(props).reduce(function (prev, key) {
|
||||
if ((key.substr(0, 5) === 'data-' || key.substr(0, 5) === 'aria-' || key === 'role') && key.substr(0, 7) !== 'data-__') {
|
||||
prev[key] = props[key];
|
||||
}
|
||||
|
||||
return prev;
|
||||
}, {});
|
||||
}
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import React from 'react';
|
||||
export declare type RenderFunction = () => React.ReactNode;
|
||||
export declare const getRenderPropValue: (propValue?: string | number | boolean | {} | React.ReactElement<any, string | ((props: any) => React.ReactElement<any, string | any | (new (props: any) => React.Component<any, any, any>)> | null) | (new (props: any) => React.Component<any, any, any>)> | React.ReactNodeArray | React.ReactPortal | RenderFunction | null | undefined) => React.ReactNode;
|
||||
+13
@@ -0,0 +1,13 @@
|
||||
export var getRenderPropValue = function getRenderPropValue(propValue) {
|
||||
if (!propValue) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var isRenderFunction = typeof propValue === 'function';
|
||||
|
||||
if (isRenderFunction) {
|
||||
return propValue();
|
||||
}
|
||||
|
||||
return propValue;
|
||||
};
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
export declare function isWindow(obj: any): boolean;
|
||||
export default function getScroll(target: HTMLElement | Window | Document | null, top: boolean): number;
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
export function isWindow(obj) {
|
||||
return obj !== null && obj !== undefined && obj === obj.window;
|
||||
}
|
||||
export default function getScroll(target, top) {
|
||||
if (typeof window === 'undefined') {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var method = top ? 'scrollTop' : 'scrollLeft';
|
||||
var result = 0;
|
||||
|
||||
if (isWindow(target)) {
|
||||
result = target[top ? 'pageYOffset' : 'pageXOffset'];
|
||||
} else if (target instanceof Document) {
|
||||
result = target.documentElement[method];
|
||||
} else if (target) {
|
||||
result = target[method];
|
||||
}
|
||||
|
||||
if (target && !isWindow(target) && typeof result !== 'number') {
|
||||
result = (target.ownerDocument || target).documentElement[method];
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
+1
@@ -0,0 +1 @@
|
||||
export default function interopDefault(m: any): any;
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
// https://github.com/moment/moment/issues/3650
|
||||
// since we are using ts 3.5.1, it should be safe to remove.
|
||||
export default function interopDefault(m) {
|
||||
return m["default"] || m;
|
||||
}
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
declare const isNumeric: (value: any) => boolean;
|
||||
export default isNumeric;
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
var isNumeric = function isNumeric(value) {
|
||||
return !isNaN(parseFloat(value)) && isFinite(value);
|
||||
};
|
||||
|
||||
export default isNumeric;
|
||||
+23
@@ -0,0 +1,23 @@
|
||||
import * as React from 'react';
|
||||
declare type MotionFunc = (element: HTMLElement) => React.CSSProperties;
|
||||
interface Motion {
|
||||
visible?: boolean;
|
||||
motionName?: string;
|
||||
motionAppear?: boolean;
|
||||
motionEnter?: boolean;
|
||||
motionLeave?: boolean;
|
||||
motionLeaveImmediately?: boolean;
|
||||
removeOnLeave?: boolean;
|
||||
leavedClassName?: string;
|
||||
onAppearStart?: MotionFunc;
|
||||
onAppearActive?: MotionFunc;
|
||||
onAppearEnd?: MotionFunc;
|
||||
onEnterStart?: MotionFunc;
|
||||
onEnterActive?: MotionFunc;
|
||||
onEnterEnd?: MotionFunc;
|
||||
onLeaveStart?: MotionFunc;
|
||||
onLeaveActive?: MotionFunc;
|
||||
onLeaveEnd?: MotionFunc;
|
||||
}
|
||||
declare const collapseMotion: Motion;
|
||||
export default collapseMotion;
|
||||
+31
@@ -0,0 +1,31 @@
|
||||
// ================== Collapse Motion ==================
|
||||
var getCollapsedHeight = function getCollapsedHeight() {
|
||||
return {
|
||||
height: 0,
|
||||
opacity: 0
|
||||
};
|
||||
};
|
||||
|
||||
var getRealHeight = function getRealHeight(node) {
|
||||
return {
|
||||
height: node.scrollHeight,
|
||||
opacity: 1
|
||||
};
|
||||
};
|
||||
|
||||
var getCurrentHeight = function getCurrentHeight(node) {
|
||||
return {
|
||||
height: node.offsetHeight
|
||||
};
|
||||
};
|
||||
|
||||
var collapseMotion = {
|
||||
motionName: 'ant-motion-collapse',
|
||||
onAppearStart: getCollapsedHeight,
|
||||
onEnterStart: getCollapsedHeight,
|
||||
onAppearActive: getRealHeight,
|
||||
onEnterActive: getRealHeight,
|
||||
onLeaveStart: getCurrentHeight,
|
||||
onLeaveActive: getCollapsedHeight
|
||||
};
|
||||
export default collapseMotion;
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
declare const animation: {
|
||||
enter(node: HTMLElement, done: () => void): any;
|
||||
leave(node: HTMLElement, done: () => void): any;
|
||||
appear(node: HTMLElement, done: () => void): any;
|
||||
};
|
||||
export default animation;
|
||||
+55
@@ -0,0 +1,55 @@
|
||||
/**
|
||||
* Deprecated. We should replace the animation with pure react motion instead of modify style directly.
|
||||
* If you are creating new component with animation, please use `./motion`.
|
||||
*/
|
||||
import cssAnimation from 'css-animation';
|
||||
import raf from 'raf';
|
||||
|
||||
function animate(node, show, done) {
|
||||
var height;
|
||||
var requestAnimationFrameId;
|
||||
return cssAnimation(node, 'ant-motion-collapse-legacy', {
|
||||
start: function start() {
|
||||
if (!show) {
|
||||
node.style.height = "".concat(node.offsetHeight, "px");
|
||||
node.style.opacity = '1';
|
||||
} else {
|
||||
height = node.offsetHeight;
|
||||
node.style.height = '0px';
|
||||
node.style.opacity = '0';
|
||||
}
|
||||
},
|
||||
active: function active() {
|
||||
if (requestAnimationFrameId) {
|
||||
raf.cancel(requestAnimationFrameId);
|
||||
}
|
||||
|
||||
requestAnimationFrameId = raf(function () {
|
||||
node.style.height = "".concat(show ? height : 0, "px");
|
||||
node.style.opacity = show ? '1' : '0';
|
||||
});
|
||||
},
|
||||
end: function end() {
|
||||
if (requestAnimationFrameId) {
|
||||
raf.cancel(requestAnimationFrameId);
|
||||
}
|
||||
|
||||
node.style.height = '';
|
||||
node.style.opacity = '';
|
||||
done();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
var animation = {
|
||||
enter: function enter(node, done) {
|
||||
return animate(node, true, done);
|
||||
},
|
||||
leave: function leave(node, done) {
|
||||
return animate(node, false, done);
|
||||
},
|
||||
appear: function appear(node, done) {
|
||||
return animate(node, true, done);
|
||||
}
|
||||
};
|
||||
export default animation;
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
interface RafMap {
|
||||
[id: number]: number;
|
||||
}
|
||||
declare function wrapperRaf(callback: () => void, delayFrames?: number): number;
|
||||
declare namespace wrapperRaf {
|
||||
var cancel: (pid?: number | undefined) => void;
|
||||
var ids: RafMap;
|
||||
}
|
||||
export default wrapperRaf;
|
||||
+31
@@ -0,0 +1,31 @@
|
||||
import raf from 'raf';
|
||||
var id = 0;
|
||||
var ids = {}; // Support call raf with delay specified frame
|
||||
|
||||
export default function wrapperRaf(callback) {
|
||||
var delayFrames = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
|
||||
var myId = id++;
|
||||
var restFrames = delayFrames;
|
||||
|
||||
function internalCallback() {
|
||||
restFrames -= 1;
|
||||
|
||||
if (restFrames <= 0) {
|
||||
callback();
|
||||
delete ids[myId];
|
||||
} else {
|
||||
ids[myId] = raf(internalCallback);
|
||||
}
|
||||
}
|
||||
|
||||
ids[myId] = raf(internalCallback);
|
||||
return myId;
|
||||
}
|
||||
|
||||
wrapperRaf.cancel = function cancel(pid) {
|
||||
if (pid === undefined) return;
|
||||
raf.cancel(ids[pid]);
|
||||
delete ids[pid];
|
||||
};
|
||||
|
||||
wrapperRaf.ids = ids; // export this for test usage
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import * as React from 'react';
|
||||
export declare function cloneElement(element: React.ReactNode, ...restArgs: any[]): {} | null | undefined;
|
||||
+11
@@ -0,0 +1,11 @@
|
||||
import * as React from 'react'; // eslint-disable-next-line import/prefer-default-export
|
||||
|
||||
export function cloneElement(element) {
|
||||
if (!React.isValidElement(element)) return element;
|
||||
|
||||
for (var _len = arguments.length, restArgs = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
||||
restArgs[_key - 1] = arguments[_key];
|
||||
}
|
||||
|
||||
return React.cloneElement.apply(React, [element].concat(restArgs));
|
||||
}
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
import React from 'react';
|
||||
export declare function fillRef<T>(ref: React.Ref<T>, node: T): void;
|
||||
export declare function composeRef<T>(...refs: React.Ref<T>[]): React.Ref<T>;
|
||||
+20
@@ -0,0 +1,20 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
export function fillRef(ref, node) {
|
||||
if (typeof ref === 'function') {
|
||||
ref(node);
|
||||
} else if (_typeof(ref) === 'object' && ref && 'current' in ref) {
|
||||
ref.current = node;
|
||||
}
|
||||
}
|
||||
export function composeRef() {
|
||||
for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
|
||||
refs[_key] = arguments[_key];
|
||||
}
|
||||
|
||||
return function (node) {
|
||||
refs.forEach(function (ref) {
|
||||
fillRef(ref, node);
|
||||
});
|
||||
};
|
||||
}
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
export declare type Breakpoint = 'xxl' | 'xl' | 'lg' | 'md' | 'sm' | 'xs';
|
||||
export declare type BreakpointMap = Partial<Record<Breakpoint, string>>;
|
||||
export declare type ScreenMap = Partial<Record<Breakpoint, boolean>>;
|
||||
export declare const responsiveArray: Breakpoint[];
|
||||
export declare const responsiveMap: BreakpointMap;
|
||||
declare type SubscribeFunc = (screens: ScreenMap) => void;
|
||||
declare const responsiveObserve: {
|
||||
matchHandlers: {};
|
||||
dispatch(pointMap: Partial<Record<Breakpoint, boolean>>): boolean;
|
||||
subscribe(func: SubscribeFunc): string;
|
||||
unsubscribe(token: string): void;
|
||||
unregister(): void;
|
||||
register(): void;
|
||||
};
|
||||
export default responsiveObserve;
|
||||
+87
@@ -0,0 +1,87 @@
|
||||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
||||
|
||||
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
|
||||
export var responsiveArray = ['xxl', 'xl', 'lg', 'md', 'sm', 'xs'];
|
||||
export var responsiveMap = {
|
||||
xs: '(max-width: 575px)',
|
||||
sm: '(min-width: 576px)',
|
||||
md: '(min-width: 768px)',
|
||||
lg: '(min-width: 992px)',
|
||||
xl: '(min-width: 1200px)',
|
||||
xxl: '(min-width: 1600px)'
|
||||
};
|
||||
var subscribers = [];
|
||||
var subUid = -1;
|
||||
var screens = {};
|
||||
var responsiveObserve = {
|
||||
matchHandlers: {},
|
||||
dispatch: function dispatch(pointMap) {
|
||||
screens = pointMap;
|
||||
|
||||
if (subscribers.length < 1) {
|
||||
return false;
|
||||
}
|
||||
|
||||
subscribers.forEach(function (item) {
|
||||
item.func(screens);
|
||||
});
|
||||
return true;
|
||||
},
|
||||
subscribe: function subscribe(func) {
|
||||
if (subscribers.length === 0) {
|
||||
this.register();
|
||||
}
|
||||
|
||||
var token = (++subUid).toString();
|
||||
subscribers.push({
|
||||
token: token,
|
||||
func: func
|
||||
});
|
||||
func(screens);
|
||||
return token;
|
||||
},
|
||||
unsubscribe: function unsubscribe(token) {
|
||||
subscribers = subscribers.filter(function (item) {
|
||||
return item.token !== token;
|
||||
});
|
||||
|
||||
if (subscribers.length === 0) {
|
||||
this.unregister();
|
||||
}
|
||||
},
|
||||
unregister: function unregister() {
|
||||
var _this = this;
|
||||
|
||||
Object.keys(responsiveMap).forEach(function (screen) {
|
||||
var matchMediaQuery = responsiveMap[screen];
|
||||
var handler = _this.matchHandlers[matchMediaQuery];
|
||||
|
||||
if (handler && handler.mql && handler.listener) {
|
||||
handler.mql.removeListener(handler.listener);
|
||||
}
|
||||
});
|
||||
},
|
||||
register: function register() {
|
||||
var _this2 = this;
|
||||
|
||||
Object.keys(responsiveMap).forEach(function (screen) {
|
||||
var matchMediaQuery = responsiveMap[screen];
|
||||
|
||||
var listener = function listener(_ref) {
|
||||
var matches = _ref.matches;
|
||||
|
||||
_this2.dispatch(_extends(_extends({}, screens), _defineProperty({}, screen, matches)));
|
||||
};
|
||||
|
||||
var mql = window.matchMedia(matchMediaQuery);
|
||||
mql.addListener(listener);
|
||||
_this2.matchHandlers[matchMediaQuery] = {
|
||||
mql: mql,
|
||||
listener: listener
|
||||
};
|
||||
listener(mql);
|
||||
});
|
||||
}
|
||||
};
|
||||
export default responsiveObserve;
|
||||
+10
@@ -0,0 +1,10 @@
|
||||
interface ScrollToOptions {
|
||||
/** Scroll container, default as window */
|
||||
getContainer?: () => HTMLElement | Window | Document;
|
||||
/** Scroll end callback */
|
||||
callback?: () => any;
|
||||
/** Animation duration, default as 450 */
|
||||
duration?: number;
|
||||
}
|
||||
export default function scrollTo(y: number, options?: ScrollToOptions): void;
|
||||
export {};
|
||||
+38
@@ -0,0 +1,38 @@
|
||||
import raf from 'raf';
|
||||
import getScroll, { isWindow } from './getScroll';
|
||||
import { easeInOutCubic } from './easings';
|
||||
export default function scrollTo(y) {
|
||||
var options = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
||||
var _options$getContainer = options.getContainer,
|
||||
getContainer = _options$getContainer === void 0 ? function () {
|
||||
return window;
|
||||
} : _options$getContainer,
|
||||
callback = options.callback,
|
||||
_options$duration = options.duration,
|
||||
duration = _options$duration === void 0 ? 450 : _options$duration;
|
||||
var container = getContainer();
|
||||
var scrollTop = getScroll(container, true);
|
||||
var startTime = Date.now();
|
||||
|
||||
var frameFunc = function frameFunc() {
|
||||
var timestamp = Date.now();
|
||||
var time = timestamp - startTime;
|
||||
var nextScrollTop = easeInOutCubic(time > duration ? duration : time, scrollTop, y, duration);
|
||||
|
||||
if (isWindow(container)) {
|
||||
container.scrollTo(window.pageXOffset, nextScrollTop);
|
||||
} else if (container instanceof Document) {
|
||||
container.documentElement.scrollTop = nextScrollTop;
|
||||
} else {
|
||||
container.scrollTop = nextScrollTop;
|
||||
}
|
||||
|
||||
if (time < duration) {
|
||||
raf(frameFunc);
|
||||
} else if (typeof callback === 'function') {
|
||||
callback();
|
||||
}
|
||||
};
|
||||
|
||||
raf(frameFunc);
|
||||
}
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
declare const isStyleSupport: (styleName: string | string[]) => boolean;
|
||||
export declare const isFlexSupported: boolean;
|
||||
export default isStyleSupport;
|
||||
+14
@@ -0,0 +1,14 @@
|
||||
var isStyleSupport = function isStyleSupport(styleName) {
|
||||
if (typeof window !== 'undefined' && window.document && window.document.documentElement) {
|
||||
var styleNameList = Array.isArray(styleName) ? styleName : [styleName];
|
||||
var documentElement = window.document.documentElement;
|
||||
return styleNameList.some(function (name) {
|
||||
return name in documentElement.style;
|
||||
});
|
||||
}
|
||||
|
||||
return false;
|
||||
};
|
||||
|
||||
export var isFlexSupported = isStyleSupport(['flex', 'webkitFlex', 'Flex', 'msFlex']);
|
||||
export default isStyleSupport;
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
export default function throttleByAnimationFrame(fn: (...args: any[]) => void): (...args: any[]) => void;
|
||||
export declare function throttleByAnimationFrameDecorator(): (target: any, key: string, descriptor: any) => {
|
||||
configurable: boolean;
|
||||
get(): any;
|
||||
};
|
||||
+65
@@ -0,0 +1,65 @@
|
||||
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
||||
|
||||
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
||||
|
||||
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
||||
|
||||
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
|
||||
|
||||
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
||||
|
||||
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
||||
|
||||
import raf from 'raf';
|
||||
export default function throttleByAnimationFrame(fn) {
|
||||
var requestId;
|
||||
|
||||
var later = function later(args) {
|
||||
return function () {
|
||||
requestId = null;
|
||||
fn.apply(void 0, _toConsumableArray(args));
|
||||
};
|
||||
};
|
||||
|
||||
var throttled = function throttled() {
|
||||
if (requestId == null) {
|
||||
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
||||
args[_key] = arguments[_key];
|
||||
}
|
||||
|
||||
requestId = raf(later(args));
|
||||
}
|
||||
};
|
||||
|
||||
throttled.cancel = function () {
|
||||
return raf.cancel(requestId);
|
||||
};
|
||||
|
||||
return throttled;
|
||||
}
|
||||
export function throttleByAnimationFrameDecorator() {
|
||||
// eslint-disable-next-line func-names
|
||||
return function (target, key, descriptor) {
|
||||
var fn = descriptor.value;
|
||||
var definingProperty = false;
|
||||
return {
|
||||
configurable: true,
|
||||
get: function get() {
|
||||
// eslint-disable-next-line no-prototype-builtins
|
||||
if (definingProperty || this === target.prototype || this.hasOwnProperty(key)) {
|
||||
return fn;
|
||||
}
|
||||
|
||||
var boundFn = throttleByAnimationFrame(fn.bind(this));
|
||||
definingProperty = true;
|
||||
Object.defineProperty(this, key, {
|
||||
value: boundFn,
|
||||
configurable: true,
|
||||
writable: true
|
||||
});
|
||||
definingProperty = false;
|
||||
return boundFn;
|
||||
}
|
||||
};
|
||||
};
|
||||
}
|
||||
+22
@@ -0,0 +1,22 @@
|
||||
/**
|
||||
* Wrap of sub component which need use as Button capacity (like Icon component).
|
||||
* This helps accessibility reader to tread as a interactive button to operation.
|
||||
*/
|
||||
import * as React from 'react';
|
||||
interface TransButtonProps extends React.HTMLAttributes<HTMLDivElement> {
|
||||
onClick?: (e?: React.MouseEvent<HTMLDivElement>) => void;
|
||||
noStyle?: boolean;
|
||||
autoFocus?: boolean;
|
||||
}
|
||||
declare class TransButton extends React.Component<TransButtonProps> {
|
||||
div?: HTMLDivElement;
|
||||
lastKeyCode?: number;
|
||||
componentDidMount(): void;
|
||||
onKeyDown: React.KeyboardEventHandler<HTMLDivElement>;
|
||||
onKeyUp: React.KeyboardEventHandler<HTMLDivElement>;
|
||||
setRef: (btn: HTMLDivElement) => void;
|
||||
focus(): void;
|
||||
blur(): void;
|
||||
render(): JSX.Element;
|
||||
}
|
||||
export default TransButton;
|
||||
+135
@@ -0,0 +1,135 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
var __rest = this && this.__rest || function (s, e) {
|
||||
var t = {};
|
||||
|
||||
for (var p in s) {
|
||||
if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
||||
}
|
||||
|
||||
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
||||
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
/**
|
||||
* Wrap of sub component which need use as Button capacity (like Icon component).
|
||||
* This helps accessibility reader to tread as a interactive button to operation.
|
||||
*/
|
||||
|
||||
|
||||
import * as React from 'react';
|
||||
import KeyCode from "rc-util/es/KeyCode";
|
||||
var inlineStyle = {
|
||||
border: 0,
|
||||
background: 'transparent',
|
||||
padding: 0,
|
||||
lineHeight: 'inherit',
|
||||
display: 'inline-block'
|
||||
};
|
||||
|
||||
var TransButton = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(TransButton, _React$Component);
|
||||
|
||||
var _super = _createSuper(TransButton);
|
||||
|
||||
function TransButton() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, TransButton);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
|
||||
_this.onKeyDown = function (event) {
|
||||
var keyCode = event.keyCode;
|
||||
|
||||
if (keyCode === KeyCode.ENTER) {
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
|
||||
_this.onKeyUp = function (event) {
|
||||
var keyCode = event.keyCode;
|
||||
var onClick = _this.props.onClick;
|
||||
|
||||
if (keyCode === KeyCode.ENTER && onClick) {
|
||||
onClick();
|
||||
}
|
||||
};
|
||||
|
||||
_this.setRef = function (btn) {
|
||||
_this.div = btn;
|
||||
};
|
||||
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(TransButton, [{
|
||||
key: "componentDidMount",
|
||||
value: function componentDidMount() {
|
||||
var autoFocus = this.props.autoFocus;
|
||||
|
||||
if (autoFocus) {
|
||||
this.focus();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "focus",
|
||||
value: function focus() {
|
||||
if (this.div) {
|
||||
this.div.focus();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "blur",
|
||||
value: function blur() {
|
||||
if (this.div) {
|
||||
this.div.blur();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "render",
|
||||
value: function render() {
|
||||
var _a = this.props,
|
||||
style = _a.style,
|
||||
noStyle = _a.noStyle,
|
||||
restProps = __rest(_a, ["style", "noStyle"]);
|
||||
|
||||
return /*#__PURE__*/React.createElement("div", _extends({
|
||||
role: "button",
|
||||
tabIndex: 0,
|
||||
ref: this.setRef
|
||||
}, restProps, {
|
||||
onKeyDown: this.onKeyDown,
|
||||
onKeyUp: this.onKeyUp,
|
||||
style: _extends(_extends({}, !noStyle ? inlineStyle : null), style)
|
||||
}));
|
||||
}
|
||||
}]);
|
||||
|
||||
return TransButton;
|
||||
}(React.Component);
|
||||
|
||||
export default TransButton;
|
||||
+12
@@ -0,0 +1,12 @@
|
||||
export declare type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
|
||||
export declare const tuple: <T extends string[]>(...args: T) => T;
|
||||
export declare const tupleNum: <T extends number[]>(...args: T) => T;
|
||||
/**
|
||||
* https://stackoverflow.com/a/59187769
|
||||
* Extract the type of an element of an array/tuple without performing indexing
|
||||
*/
|
||||
export declare type ElementOf<T> = T extends (infer E)[] ? E : T extends readonly (infer E)[] ? E : never;
|
||||
/**
|
||||
* https://github.com/Microsoft/TypeScript/issues/29729
|
||||
*/
|
||||
export declare type LiteralUnion<T extends U, U> = T | (U & {});
|
||||
+15
@@ -0,0 +1,15 @@
|
||||
// https://stackoverflow.com/questions/46176165/ways-to-get-string-literal-type-of-array-values-without-enum-overhead
|
||||
export var tuple = function tuple() {
|
||||
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
||||
args[_key] = arguments[_key];
|
||||
}
|
||||
|
||||
return args;
|
||||
};
|
||||
export var tupleNum = function tupleNum() {
|
||||
for (var _len2 = arguments.length, args = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
|
||||
args[_key2] = arguments[_key2];
|
||||
}
|
||||
|
||||
return args;
|
||||
};
|
||||
+3
@@ -0,0 +1,3 @@
|
||||
export default class UnreachableException {
|
||||
constructor(value: never);
|
||||
}
|
||||
+9
@@ -0,0 +1,9 @@
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
var UnreachableException = function UnreachableException(value) {
|
||||
_classCallCheck(this, UnreachableException);
|
||||
|
||||
return new Error("unreachable case: ".concat(JSON.stringify(value)));
|
||||
};
|
||||
|
||||
export { UnreachableException as default };
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import * as React from 'react';
|
||||
export default function usePatchElement(): [React.ReactElement[], (element: React.ReactElement) => Function];
|
||||
+42
@@ -0,0 +1,42 @@
|
||||
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
||||
|
||||
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
||||
|
||||
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
|
||||
|
||||
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
||||
|
||||
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
||||
|
||||
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
||||
|
||||
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(n); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
||||
|
||||
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
||||
|
||||
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
||||
|
||||
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
||||
|
||||
import * as React from 'react';
|
||||
export default function usePatchElement() {
|
||||
var _React$useState = React.useState([]),
|
||||
_React$useState2 = _slicedToArray(_React$useState, 2),
|
||||
elements = _React$useState2[0],
|
||||
setElements = _React$useState2[1];
|
||||
|
||||
function patchElement(element) {
|
||||
setElements(function (originElements) {
|
||||
return [].concat(_toConsumableArray(originElements), [element]);
|
||||
});
|
||||
return function () {
|
||||
setElements(function (originElements) {
|
||||
return originElements.filter(function (ele) {
|
||||
return ele !== element;
|
||||
});
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
return [elements, patchElement];
|
||||
}
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import { resetWarned } from 'rc-util/lib/warning';
|
||||
export { resetWarned };
|
||||
declare const _default: (valid: boolean, component: string, message: string) => void;
|
||||
export default _default;
|
||||
+5
@@ -0,0 +1,5 @@
|
||||
import warning, { resetWarned } from "rc-util/es/warning";
|
||||
export { resetWarned };
|
||||
export default (function (valid, component, message) {
|
||||
warning(valid, "[antd: ".concat(component, "] ").concat(message));
|
||||
});
|
||||
+25
@@ -0,0 +1,25 @@
|
||||
import * as React from 'react';
|
||||
import { ConfigConsumerProps } from '../config-provider';
|
||||
export default class Wave extends React.Component<{
|
||||
insertExtraNode?: boolean;
|
||||
}> {
|
||||
private instance?;
|
||||
private extraNode;
|
||||
private clickWaveTimeoutId;
|
||||
private animationStartId;
|
||||
private animationStart;
|
||||
private destroyed;
|
||||
private csp?;
|
||||
componentDidMount(): void;
|
||||
componentWillUnmount(): void;
|
||||
onClick: (node: HTMLElement, waveColor: string) => void;
|
||||
onTransitionStart: (e: AnimationEvent) => void;
|
||||
onTransitionEnd: (e: AnimationEvent) => void;
|
||||
getAttributeName(): "ant-click-animating" | "ant-click-animating-without-extra-node";
|
||||
bindAnimationEvent: (node: HTMLElement) => {
|
||||
cancel: () => void;
|
||||
} | undefined;
|
||||
resetEffect(node: HTMLElement): void;
|
||||
renderWave: ({ csp }: ConfigConsumerProps) => React.ReactNode;
|
||||
render(): JSX.Element;
|
||||
}
|
||||
+234
@@ -0,0 +1,234 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
import * as React from 'react';
|
||||
import { findDOMNode } from 'react-dom';
|
||||
import TransitionEvents from "css-animation/es/Event";
|
||||
import raf from './raf';
|
||||
import { ConfigConsumer } from '../config-provider';
|
||||
var styleForPesudo; // Where el is the DOM element you'd like to test for visibility
|
||||
|
||||
function isHidden(element) {
|
||||
if (process.env.NODE_ENV === 'test') {
|
||||
return false;
|
||||
}
|
||||
|
||||
return !element || element.offsetParent === null;
|
||||
}
|
||||
|
||||
function isNotGrey(color) {
|
||||
// eslint-disable-next-line no-useless-escape
|
||||
var match = (color || '').match(/rgba?\((\d*), (\d*), (\d*)(, [\d.]*)?\)/);
|
||||
|
||||
if (match && match[1] && match[2] && match[3]) {
|
||||
return !(match[1] === match[2] && match[2] === match[3]);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
var Wave = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(Wave, _React$Component);
|
||||
|
||||
var _super = _createSuper(Wave);
|
||||
|
||||
function Wave() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, Wave);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
_this.animationStart = false;
|
||||
_this.destroyed = false;
|
||||
|
||||
_this.onClick = function (node, waveColor) {
|
||||
if (!node || isHidden(node) || node.className.indexOf('-leave') >= 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
var insertExtraNode = _this.props.insertExtraNode;
|
||||
_this.extraNode = document.createElement('div');
|
||||
|
||||
var _assertThisInitialize = _assertThisInitialized(_this),
|
||||
extraNode = _assertThisInitialize.extraNode;
|
||||
|
||||
extraNode.className = 'ant-click-animating-node';
|
||||
|
||||
var attributeName = _this.getAttributeName();
|
||||
|
||||
node.setAttribute(attributeName, 'true'); // Not white or transparnt or grey
|
||||
|
||||
styleForPesudo = styleForPesudo || document.createElement('style');
|
||||
|
||||
if (waveColor && waveColor !== '#ffffff' && waveColor !== 'rgb(255, 255, 255)' && isNotGrey(waveColor) && !/rgba\((?:\d*, ){3}0\)/.test(waveColor) && // any transparent rgba color
|
||||
waveColor !== 'transparent') {
|
||||
// Add nonce if CSP exist
|
||||
if (_this.csp && _this.csp.nonce) {
|
||||
styleForPesudo.nonce = _this.csp.nonce;
|
||||
}
|
||||
|
||||
extraNode.style.borderColor = waveColor;
|
||||
styleForPesudo.innerHTML = "\n [ant-click-animating-without-extra-node='true']::after, .ant-click-animating-node {\n --antd-wave-shadow-color: ".concat(waveColor, ";\n }");
|
||||
|
||||
if (!document.body.contains(styleForPesudo)) {
|
||||
document.body.appendChild(styleForPesudo);
|
||||
}
|
||||
}
|
||||
|
||||
if (insertExtraNode) {
|
||||
node.appendChild(extraNode);
|
||||
}
|
||||
|
||||
TransitionEvents.addStartEventListener(node, _this.onTransitionStart);
|
||||
TransitionEvents.addEndEventListener(node, _this.onTransitionEnd);
|
||||
};
|
||||
|
||||
_this.onTransitionStart = function (e) {
|
||||
if (_this.destroyed) {
|
||||
return;
|
||||
}
|
||||
|
||||
var node = findDOMNode(_assertThisInitialized(_this));
|
||||
|
||||
if (!e || e.target !== node || _this.animationStart) {
|
||||
return;
|
||||
}
|
||||
|
||||
_this.resetEffect(node);
|
||||
};
|
||||
|
||||
_this.onTransitionEnd = function (e) {
|
||||
if (!e || e.animationName !== 'fadeEffect') {
|
||||
return;
|
||||
}
|
||||
|
||||
_this.resetEffect(e.target);
|
||||
};
|
||||
|
||||
_this.bindAnimationEvent = function (node) {
|
||||
if (!node || !node.getAttribute || node.getAttribute('disabled') || node.className.indexOf('disabled') >= 0) {
|
||||
return;
|
||||
}
|
||||
|
||||
var onClick = function onClick(e) {
|
||||
// Fix radio button click twice
|
||||
if (e.target.tagName === 'INPUT' || isHidden(e.target)) {
|
||||
return;
|
||||
}
|
||||
|
||||
_this.resetEffect(node); // Get wave color from target
|
||||
|
||||
|
||||
var waveColor = getComputedStyle(node).getPropertyValue('border-top-color') || // Firefox Compatible
|
||||
getComputedStyle(node).getPropertyValue('border-color') || getComputedStyle(node).getPropertyValue('background-color');
|
||||
_this.clickWaveTimeoutId = window.setTimeout(function () {
|
||||
return _this.onClick(node, waveColor);
|
||||
}, 0);
|
||||
raf.cancel(_this.animationStartId);
|
||||
_this.animationStart = true; // Render to trigger transition event cost 3 frames. Let's delay 10 frames to reset this.
|
||||
|
||||
_this.animationStartId = raf(function () {
|
||||
_this.animationStart = false;
|
||||
}, 10);
|
||||
};
|
||||
|
||||
node.addEventListener('click', onClick, true);
|
||||
return {
|
||||
cancel: function cancel() {
|
||||
node.removeEventListener('click', onClick, true);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
_this.renderWave = function (_ref) {
|
||||
var csp = _ref.csp;
|
||||
var children = _this.props.children;
|
||||
_this.csp = csp;
|
||||
return children;
|
||||
};
|
||||
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(Wave, [{
|
||||
key: "componentDidMount",
|
||||
value: function componentDidMount() {
|
||||
var node = findDOMNode(this);
|
||||
|
||||
if (!node || node.nodeType !== 1) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.instance = this.bindAnimationEvent(node);
|
||||
}
|
||||
}, {
|
||||
key: "componentWillUnmount",
|
||||
value: function componentWillUnmount() {
|
||||
if (this.instance) {
|
||||
this.instance.cancel();
|
||||
}
|
||||
|
||||
if (this.clickWaveTimeoutId) {
|
||||
clearTimeout(this.clickWaveTimeoutId);
|
||||
}
|
||||
|
||||
this.destroyed = true;
|
||||
}
|
||||
}, {
|
||||
key: "getAttributeName",
|
||||
value: function getAttributeName() {
|
||||
var insertExtraNode = this.props.insertExtraNode;
|
||||
return insertExtraNode ? 'ant-click-animating' : 'ant-click-animating-without-extra-node';
|
||||
}
|
||||
}, {
|
||||
key: "resetEffect",
|
||||
value: function resetEffect(node) {
|
||||
if (!node || node === this.extraNode || !(node instanceof Element)) {
|
||||
return;
|
||||
}
|
||||
|
||||
var insertExtraNode = this.props.insertExtraNode;
|
||||
var attributeName = this.getAttributeName();
|
||||
node.setAttribute(attributeName, 'false'); // edge has bug on `removeAttribute` #14466
|
||||
|
||||
if (styleForPesudo) {
|
||||
styleForPesudo.innerHTML = '';
|
||||
}
|
||||
|
||||
if (insertExtraNode && this.extraNode && node.contains(this.extraNode)) {
|
||||
node.removeChild(this.extraNode);
|
||||
}
|
||||
|
||||
TransitionEvents.removeStartEventListener(node, this.onTransitionStart);
|
||||
TransitionEvents.removeEndEventListener(node, this.onTransitionEnd);
|
||||
}
|
||||
}, {
|
||||
key: "render",
|
||||
value: function render() {
|
||||
return /*#__PURE__*/React.createElement(ConfigConsumer, null, this.renderWave);
|
||||
}
|
||||
}]);
|
||||
|
||||
return Wave;
|
||||
}(React.Component);
|
||||
|
||||
export { Wave as default };
|
||||
+53
@@ -0,0 +1,53 @@
|
||||
import * as React from 'react';
|
||||
import { ConfigConsumerProps } from '../config-provider';
|
||||
declare function getDefaultTarget(): (Window & typeof globalThis) | null;
|
||||
export interface AffixProps {
|
||||
/**
|
||||
* 距离窗口顶部达到指定偏移量后触发
|
||||
*/
|
||||
offsetTop?: number;
|
||||
/** 距离窗口底部达到指定偏移量后触发 */
|
||||
offsetBottom?: number;
|
||||
style?: React.CSSProperties;
|
||||
/** 固定状态改变时触发的回调函数 */
|
||||
onChange?: (affixed?: boolean) => void;
|
||||
/** 设置 Affix 需要监听其滚动事件的元素,值为一个返回对应 DOM 元素的函数 */
|
||||
target?: () => Window | HTMLElement | null;
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
children: React.ReactNode;
|
||||
}
|
||||
declare enum AffixStatus {
|
||||
None = 0,
|
||||
Prepare = 1
|
||||
}
|
||||
export interface AffixState {
|
||||
affixStyle?: React.CSSProperties;
|
||||
placeholderStyle?: React.CSSProperties;
|
||||
status: AffixStatus;
|
||||
lastAffix: boolean;
|
||||
prevTarget: Window | HTMLElement | null;
|
||||
}
|
||||
declare class Affix extends React.Component<AffixProps, AffixState> {
|
||||
static defaultProps: {
|
||||
target: typeof getDefaultTarget;
|
||||
};
|
||||
state: AffixState;
|
||||
placeholderNode: HTMLDivElement;
|
||||
fixedNode: HTMLDivElement;
|
||||
private timeout;
|
||||
componentDidMount(): void;
|
||||
componentDidUpdate(prevProps: AffixProps): void;
|
||||
componentWillUnmount(): void;
|
||||
getOffsetTop: () => number | undefined;
|
||||
getOffsetBottom: () => number | undefined;
|
||||
savePlaceholderNode: (node: HTMLDivElement) => void;
|
||||
saveFixedNode: (node: HTMLDivElement) => void;
|
||||
measure: () => void;
|
||||
prepareMeasure: () => void;
|
||||
updatePosition(): void;
|
||||
lazyUpdatePosition(): void;
|
||||
renderAffix: ({ getPrefixCls }: ConfigConsumerProps) => JSX.Element;
|
||||
render(): JSX.Element;
|
||||
}
|
||||
export default Affix;
|
||||
+326
@@ -0,0 +1,326 @@
|
||||
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
|
||||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
|
||||
var c = arguments.length,
|
||||
r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
|
||||
d;
|
||||
if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
|
||||
if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
||||
}
|
||||
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
||||
};
|
||||
|
||||
import * as React from 'react';
|
||||
import classNames from 'classnames';
|
||||
import omit from 'omit.js';
|
||||
import ResizeObserver from 'rc-resize-observer';
|
||||
import { ConfigConsumer } from '../config-provider';
|
||||
import { throttleByAnimationFrameDecorator } from '../_util/throttleByAnimationFrame';
|
||||
import { addObserveTarget, removeObserveTarget, getTargetRect, getFixedTop, getFixedBottom } from './utils';
|
||||
|
||||
function getDefaultTarget() {
|
||||
return typeof window !== 'undefined' ? window : null;
|
||||
}
|
||||
|
||||
var AffixStatus;
|
||||
|
||||
(function (AffixStatus) {
|
||||
AffixStatus[AffixStatus["None"] = 0] = "None";
|
||||
AffixStatus[AffixStatus["Prepare"] = 1] = "Prepare";
|
||||
})(AffixStatus || (AffixStatus = {}));
|
||||
|
||||
var Affix = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(Affix, _React$Component);
|
||||
|
||||
var _super = _createSuper(Affix);
|
||||
|
||||
function Affix() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, Affix);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
_this.state = {
|
||||
status: AffixStatus.None,
|
||||
lastAffix: false,
|
||||
prevTarget: null
|
||||
};
|
||||
|
||||
_this.getOffsetTop = function () {
|
||||
var offsetBottom = _this.props.offsetBottom;
|
||||
var offsetTop = _this.props.offsetTop;
|
||||
|
||||
if (offsetBottom === undefined && offsetTop === undefined) {
|
||||
offsetTop = 0;
|
||||
}
|
||||
|
||||
return offsetTop;
|
||||
};
|
||||
|
||||
_this.getOffsetBottom = function () {
|
||||
return _this.props.offsetBottom;
|
||||
};
|
||||
|
||||
_this.savePlaceholderNode = function (node) {
|
||||
_this.placeholderNode = node;
|
||||
};
|
||||
|
||||
_this.saveFixedNode = function (node) {
|
||||
_this.fixedNode = node;
|
||||
}; // =================== Measure ===================
|
||||
|
||||
|
||||
_this.measure = function () {
|
||||
var _this$state = _this.state,
|
||||
status = _this$state.status,
|
||||
lastAffix = _this$state.lastAffix;
|
||||
var _this$props = _this.props,
|
||||
target = _this$props.target,
|
||||
onChange = _this$props.onChange;
|
||||
|
||||
if (status !== AffixStatus.Prepare || !_this.fixedNode || !_this.placeholderNode || !target) {
|
||||
return;
|
||||
}
|
||||
|
||||
var offsetTop = _this.getOffsetTop();
|
||||
|
||||
var offsetBottom = _this.getOffsetBottom();
|
||||
|
||||
var targetNode = target();
|
||||
|
||||
if (!targetNode) {
|
||||
return;
|
||||
}
|
||||
|
||||
var newState = {
|
||||
status: AffixStatus.None
|
||||
};
|
||||
var targetRect = getTargetRect(targetNode);
|
||||
var placeholderReact = getTargetRect(_this.placeholderNode);
|
||||
var fixedTop = getFixedTop(placeholderReact, targetRect, offsetTop);
|
||||
var fixedBottom = getFixedBottom(placeholderReact, targetRect, offsetBottom);
|
||||
|
||||
if (fixedTop !== undefined) {
|
||||
newState.affixStyle = {
|
||||
position: 'fixed',
|
||||
top: fixedTop,
|
||||
width: placeholderReact.width,
|
||||
height: placeholderReact.height
|
||||
};
|
||||
newState.placeholderStyle = {
|
||||
width: placeholderReact.width,
|
||||
height: placeholderReact.height
|
||||
};
|
||||
} else if (fixedBottom !== undefined) {
|
||||
newState.affixStyle = {
|
||||
position: 'fixed',
|
||||
bottom: fixedBottom,
|
||||
width: placeholderReact.width,
|
||||
height: placeholderReact.height
|
||||
};
|
||||
newState.placeholderStyle = {
|
||||
width: placeholderReact.width,
|
||||
height: placeholderReact.height
|
||||
};
|
||||
}
|
||||
|
||||
newState.lastAffix = !!newState.affixStyle;
|
||||
|
||||
if (onChange && lastAffix !== newState.lastAffix) {
|
||||
onChange(newState.lastAffix);
|
||||
}
|
||||
|
||||
_this.setState(newState);
|
||||
}; // @ts-ignore TS6133
|
||||
|
||||
|
||||
_this.prepareMeasure = function () {
|
||||
// event param is used before. Keep compatible ts define here.
|
||||
_this.setState({
|
||||
status: AffixStatus.Prepare,
|
||||
affixStyle: undefined,
|
||||
placeholderStyle: undefined
|
||||
}); // Test if `updatePosition` called
|
||||
|
||||
|
||||
if (process.env.NODE_ENV === 'test') {
|
||||
var onTestUpdatePosition = _this.props.onTestUpdatePosition;
|
||||
|
||||
if (onTestUpdatePosition) {
|
||||
onTestUpdatePosition();
|
||||
}
|
||||
}
|
||||
}; // =================== Render ===================
|
||||
|
||||
|
||||
_this.renderAffix = function (_ref) {
|
||||
var getPrefixCls = _ref.getPrefixCls;
|
||||
var _this$state2 = _this.state,
|
||||
affixStyle = _this$state2.affixStyle,
|
||||
placeholderStyle = _this$state2.placeholderStyle;
|
||||
var _this$props2 = _this.props,
|
||||
prefixCls = _this$props2.prefixCls,
|
||||
children = _this$props2.children;
|
||||
var className = classNames(_defineProperty({}, getPrefixCls('affix', prefixCls), affixStyle));
|
||||
var props = omit(_this.props, ['prefixCls', 'offsetTop', 'offsetBottom', 'target', 'onChange']); // Omit this since `onTestUpdatePosition` only works on test.
|
||||
|
||||
if (process.env.NODE_ENV === 'test') {
|
||||
props = omit(props, ['onTestUpdatePosition']);
|
||||
}
|
||||
|
||||
return /*#__PURE__*/React.createElement(ResizeObserver, {
|
||||
onResize: function onResize() {
|
||||
_this.updatePosition();
|
||||
}
|
||||
}, /*#__PURE__*/React.createElement("div", _extends({}, props, {
|
||||
ref: _this.savePlaceholderNode
|
||||
}), affixStyle && /*#__PURE__*/React.createElement("div", {
|
||||
style: placeholderStyle,
|
||||
"aria-hidden": "true"
|
||||
}), /*#__PURE__*/React.createElement("div", {
|
||||
className: className,
|
||||
ref: _this.saveFixedNode,
|
||||
style: affixStyle
|
||||
}, /*#__PURE__*/React.createElement(ResizeObserver, {
|
||||
onResize: function onResize() {
|
||||
_this.updatePosition();
|
||||
}
|
||||
}, children))));
|
||||
};
|
||||
|
||||
return _this;
|
||||
} // Event handler
|
||||
|
||||
|
||||
_createClass(Affix, [{
|
||||
key: "componentDidMount",
|
||||
value: function componentDidMount() {
|
||||
var _this2 = this;
|
||||
|
||||
var target = this.props.target;
|
||||
|
||||
if (target) {
|
||||
// [Legacy] Wait for parent component ref has its value.
|
||||
// We should use target as directly element instead of function which makes element check hard.
|
||||
this.timeout = setTimeout(function () {
|
||||
addObserveTarget(target(), _this2); // Mock Event object.
|
||||
|
||||
_this2.updatePosition();
|
||||
});
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "componentDidUpdate",
|
||||
value: function componentDidUpdate(prevProps) {
|
||||
var prevTarget = this.state.prevTarget;
|
||||
var target = this.props.target;
|
||||
var newTarget = null;
|
||||
|
||||
if (target) {
|
||||
newTarget = target() || null;
|
||||
}
|
||||
|
||||
if (prevTarget !== newTarget) {
|
||||
removeObserveTarget(this);
|
||||
|
||||
if (newTarget) {
|
||||
addObserveTarget(newTarget, this); // Mock Event object.
|
||||
|
||||
this.updatePosition();
|
||||
}
|
||||
|
||||
this.setState({
|
||||
prevTarget: newTarget
|
||||
});
|
||||
}
|
||||
|
||||
if (prevProps.offsetTop !== this.props.offsetTop || prevProps.offsetBottom !== this.props.offsetBottom) {
|
||||
this.updatePosition();
|
||||
}
|
||||
|
||||
this.measure();
|
||||
}
|
||||
}, {
|
||||
key: "componentWillUnmount",
|
||||
value: function componentWillUnmount() {
|
||||
clearTimeout(this.timeout);
|
||||
removeObserveTarget(this);
|
||||
this.updatePosition.cancel(); // https://github.com/ant-design/ant-design/issues/22683
|
||||
|
||||
this.lazyUpdatePosition.cancel();
|
||||
} // Handle realign logic
|
||||
|
||||
}, {
|
||||
key: "updatePosition",
|
||||
value: function updatePosition() {
|
||||
this.prepareMeasure();
|
||||
}
|
||||
}, {
|
||||
key: "lazyUpdatePosition",
|
||||
value: function lazyUpdatePosition() {
|
||||
var target = this.props.target;
|
||||
var affixStyle = this.state.affixStyle; // Check position change before measure to make Safari smooth
|
||||
|
||||
if (target && affixStyle) {
|
||||
var offsetTop = this.getOffsetTop();
|
||||
var offsetBottom = this.getOffsetBottom();
|
||||
var targetNode = target();
|
||||
|
||||
if (targetNode && this.placeholderNode) {
|
||||
var targetRect = getTargetRect(targetNode);
|
||||
var placeholderReact = getTargetRect(this.placeholderNode);
|
||||
var fixedTop = getFixedTop(placeholderReact, targetRect, offsetTop);
|
||||
var fixedBottom = getFixedBottom(placeholderReact, targetRect, offsetBottom);
|
||||
|
||||
if (fixedTop !== undefined && affixStyle.top === fixedTop || fixedBottom !== undefined && affixStyle.bottom === fixedBottom) {
|
||||
return;
|
||||
}
|
||||
}
|
||||
} // Directly call prepare measure since it's already throttled.
|
||||
|
||||
|
||||
this.prepareMeasure();
|
||||
}
|
||||
}, {
|
||||
key: "render",
|
||||
value: function render() {
|
||||
return /*#__PURE__*/React.createElement(ConfigConsumer, null, this.renderAffix);
|
||||
}
|
||||
}]);
|
||||
|
||||
return Affix;
|
||||
}(React.Component);
|
||||
|
||||
Affix.defaultProps = {
|
||||
target: getDefaultTarget
|
||||
};
|
||||
|
||||
__decorate([throttleByAnimationFrameDecorator()], Affix.prototype, "updatePosition", null);
|
||||
|
||||
__decorate([throttleByAnimationFrameDecorator()], Affix.prototype, "lazyUpdatePosition", null);
|
||||
|
||||
export default Affix;
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import '../../style/index.css';
|
||||
import './index.css';
|
||||
+8
@@ -0,0 +1,8 @@
|
||||
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
|
||||
/* stylelint-disable no-duplicate-selectors */
|
||||
/* stylelint-disable */
|
||||
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
|
||||
.ant-affix {
|
||||
position: fixed;
|
||||
z-index: 10;
|
||||
}
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import '../../style/index.less';
|
||||
import './index.less';
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import '../../style/index.less';
|
||||
import './index.less';
|
||||
+6
@@ -0,0 +1,6 @@
|
||||
@import '../../style/themes/index';
|
||||
|
||||
.@{ant-prefix}-affix {
|
||||
position: fixed;
|
||||
z-index: @zindex-affix;
|
||||
}
|
||||
+17
@@ -0,0 +1,17 @@
|
||||
import Affix from '.';
|
||||
export declare type BindElement = HTMLElement | Window | null | undefined;
|
||||
export declare type Rect = ClientRect | DOMRect;
|
||||
export declare function getTargetRect(target: BindElement): ClientRect;
|
||||
export declare function getFixedTop(placeholderReact: Rect, targetRect: Rect, offsetTop: number | undefined): number | undefined;
|
||||
export declare function getFixedBottom(placeholderReact: Rect, targetRect: Rect, offsetBottom: number | undefined): number | undefined;
|
||||
interface ObserverEntity {
|
||||
target: HTMLElement | Window;
|
||||
affixList: Affix[];
|
||||
eventHandlers: {
|
||||
[eventName: string]: any;
|
||||
};
|
||||
}
|
||||
export declare function getObserverEntities(): ObserverEntity[];
|
||||
export declare function addObserveTarget(target: HTMLElement | Window | null, affix: Affix): void;
|
||||
export declare function removeObserveTarget(affix: Affix): void;
|
||||
export {};
|
||||
+83
@@ -0,0 +1,83 @@
|
||||
import addEventListener from "rc-util/es/Dom/addEventListener";
|
||||
export function getTargetRect(target) {
|
||||
return target !== window ? target.getBoundingClientRect() : {
|
||||
top: 0,
|
||||
bottom: window.innerHeight
|
||||
};
|
||||
}
|
||||
export function getFixedTop(placeholderReact, targetRect, offsetTop) {
|
||||
if (offsetTop !== undefined && targetRect.top > placeholderReact.top - offsetTop) {
|
||||
return offsetTop + targetRect.top;
|
||||
}
|
||||
|
||||
return undefined;
|
||||
}
|
||||
export function getFixedBottom(placeholderReact, targetRect, offsetBottom) {
|
||||
if (offsetBottom !== undefined && targetRect.bottom < placeholderReact.bottom + offsetBottom) {
|
||||
var targetBottomOffset = window.innerHeight - targetRect.bottom;
|
||||
return offsetBottom + targetBottomOffset;
|
||||
}
|
||||
|
||||
return undefined;
|
||||
} // ======================== Observer ========================
|
||||
|
||||
var TRIGGER_EVENTS = ['resize', 'scroll', 'touchstart', 'touchmove', 'touchend', 'pageshow', 'load'];
|
||||
var observerEntities = [];
|
||||
export function getObserverEntities() {
|
||||
// Only used in test env. Can be removed if refactor.
|
||||
return observerEntities;
|
||||
}
|
||||
export function addObserveTarget(target, affix) {
|
||||
if (!target) return;
|
||||
var entity = observerEntities.find(function (item) {
|
||||
return item.target === target;
|
||||
});
|
||||
|
||||
if (entity) {
|
||||
entity.affixList.push(affix);
|
||||
} else {
|
||||
entity = {
|
||||
target: target,
|
||||
affixList: [affix],
|
||||
eventHandlers: {}
|
||||
};
|
||||
observerEntities.push(entity); // Add listener
|
||||
|
||||
TRIGGER_EVENTS.forEach(function (eventName) {
|
||||
entity.eventHandlers[eventName] = addEventListener(target, eventName, function () {
|
||||
entity.affixList.forEach(function (targetAffix) {
|
||||
targetAffix.lazyUpdatePosition();
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
export function removeObserveTarget(affix) {
|
||||
var observerEntity = observerEntities.find(function (oriObserverEntity) {
|
||||
var hasAffix = oriObserverEntity.affixList.some(function (item) {
|
||||
return item === affix;
|
||||
});
|
||||
|
||||
if (hasAffix) {
|
||||
oriObserverEntity.affixList = oriObserverEntity.affixList.filter(function (item) {
|
||||
return item !== affix;
|
||||
});
|
||||
}
|
||||
|
||||
return hasAffix;
|
||||
});
|
||||
|
||||
if (observerEntity && observerEntity.affixList.length === 0) {
|
||||
observerEntities = observerEntities.filter(function (item) {
|
||||
return item !== observerEntity;
|
||||
}); // Remove listener
|
||||
|
||||
TRIGGER_EVENTS.forEach(function (eventName) {
|
||||
var handler = observerEntity.eventHandlers[eventName];
|
||||
|
||||
if (handler && handler.remove) {
|
||||
handler.remove();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
+21
@@ -0,0 +1,21 @@
|
||||
import * as React from 'react';
|
||||
interface ErrorBoundaryProps {
|
||||
message?: React.ReactNode;
|
||||
description?: React.ReactNode;
|
||||
}
|
||||
export default class ErrorBoundary extends React.Component<ErrorBoundaryProps, {
|
||||
error?: Error | null;
|
||||
info: {
|
||||
componentStack?: string;
|
||||
};
|
||||
}> {
|
||||
state: {
|
||||
error: undefined;
|
||||
info: {
|
||||
componentStack: string;
|
||||
};
|
||||
};
|
||||
componentDidCatch(error: Error | null, info: object): void;
|
||||
render(): {} | null | undefined;
|
||||
}
|
||||
export {};
|
||||
+83
@@ -0,0 +1,83 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
import * as React from 'react';
|
||||
import Alert from '.';
|
||||
|
||||
var ErrorBoundary = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(ErrorBoundary, _React$Component);
|
||||
|
||||
var _super = _createSuper(ErrorBoundary);
|
||||
|
||||
function ErrorBoundary() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, ErrorBoundary);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
_this.state = {
|
||||
error: undefined,
|
||||
info: {
|
||||
componentStack: ''
|
||||
}
|
||||
};
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(ErrorBoundary, [{
|
||||
key: "componentDidCatch",
|
||||
value: function componentDidCatch(error, info) {
|
||||
this.setState({
|
||||
error: error,
|
||||
info: info
|
||||
});
|
||||
}
|
||||
}, {
|
||||
key: "render",
|
||||
value: function render() {
|
||||
var _this$props = this.props,
|
||||
message = _this$props.message,
|
||||
description = _this$props.description,
|
||||
children = _this$props.children;
|
||||
var _this$state = this.state,
|
||||
error = _this$state.error,
|
||||
info = _this$state.info;
|
||||
var componentStack = info && info.componentStack ? info.componentStack : null;
|
||||
var errorMessage = typeof message === 'undefined' ? (error || '').toString() : message;
|
||||
var errorDescription = typeof description === 'undefined' ? componentStack : description;
|
||||
|
||||
if (error) {
|
||||
return /*#__PURE__*/React.createElement(Alert, {
|
||||
type: "error",
|
||||
message: errorMessage,
|
||||
description: /*#__PURE__*/React.createElement("pre", null, errorDescription)
|
||||
});
|
||||
}
|
||||
|
||||
return children;
|
||||
}
|
||||
}]);
|
||||
|
||||
return ErrorBoundary;
|
||||
}(React.Component);
|
||||
|
||||
export { ErrorBoundary as default };
|
||||
+46
@@ -0,0 +1,46 @@
|
||||
import * as React from 'react';
|
||||
import { ConfigConsumerProps } from '../config-provider';
|
||||
import ErrorBoundary from './ErrorBoundary';
|
||||
export interface AlertProps {
|
||||
/**
|
||||
* Type of Alert styles, options:`success`, `info`, `warning`, `error`
|
||||
*/
|
||||
type?: 'success' | 'info' | 'warning' | 'error';
|
||||
/** Whether Alert can be closed */
|
||||
closable?: boolean;
|
||||
/** Close text to show */
|
||||
closeText?: React.ReactNode;
|
||||
/** Content of Alert */
|
||||
message: React.ReactNode;
|
||||
/** Additional content of Alert */
|
||||
description?: React.ReactNode;
|
||||
/** Callback when close Alert */
|
||||
onClose?: React.MouseEventHandler<HTMLButtonElement>;
|
||||
/** Trigger when animation ending of Alert */
|
||||
afterClose?: () => void;
|
||||
/** Whether to show icon */
|
||||
showIcon?: boolean;
|
||||
style?: React.CSSProperties;
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
banner?: boolean;
|
||||
icon?: React.ReactNode;
|
||||
onMouseEnter?: React.MouseEventHandler<HTMLDivElement>;
|
||||
onMouseLeave?: React.MouseEventHandler<HTMLDivElement>;
|
||||
onClick?: React.MouseEventHandler<HTMLDivElement>;
|
||||
}
|
||||
export interface AlertState {
|
||||
closing: boolean;
|
||||
closed: boolean;
|
||||
}
|
||||
export default class Alert extends React.Component<AlertProps, AlertState> {
|
||||
static ErrorBoundary: typeof ErrorBoundary;
|
||||
state: {
|
||||
closing: boolean;
|
||||
closed: boolean;
|
||||
};
|
||||
handleClose: (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;
|
||||
animationEnd: () => void;
|
||||
renderAlert: ({ getPrefixCls, direction }: ConfigConsumerProps) => JSX.Element | null;
|
||||
render(): JSX.Element;
|
||||
}
|
||||
+186
@@ -0,0 +1,186 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
|
||||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import CloseOutlined from '@ant-design/icons/CloseOutlined';
|
||||
import CheckCircleOutlined from '@ant-design/icons/CheckCircleOutlined';
|
||||
import ExclamationCircleOutlined from '@ant-design/icons/ExclamationCircleOutlined';
|
||||
import InfoCircleOutlined from '@ant-design/icons/InfoCircleOutlined';
|
||||
import CloseCircleOutlined from '@ant-design/icons/CloseCircleOutlined';
|
||||
import CheckCircleFilled from '@ant-design/icons/CheckCircleFilled';
|
||||
import ExclamationCircleFilled from '@ant-design/icons/ExclamationCircleFilled';
|
||||
import InfoCircleFilled from '@ant-design/icons/InfoCircleFilled';
|
||||
import CloseCircleFilled from '@ant-design/icons/CloseCircleFilled';
|
||||
import Animate from 'rc-animate';
|
||||
import classNames from 'classnames';
|
||||
import { ConfigConsumer } from '../config-provider';
|
||||
import getDataOrAriaProps from '../_util/getDataOrAriaProps';
|
||||
import ErrorBoundary from './ErrorBoundary';
|
||||
|
||||
function noop() {}
|
||||
|
||||
var iconMapFilled = {
|
||||
success: CheckCircleFilled,
|
||||
info: InfoCircleFilled,
|
||||
error: CloseCircleFilled,
|
||||
warning: ExclamationCircleFilled
|
||||
};
|
||||
var iconMapOutlined = {
|
||||
success: CheckCircleOutlined,
|
||||
info: InfoCircleOutlined,
|
||||
error: CloseCircleOutlined,
|
||||
warning: ExclamationCircleOutlined
|
||||
};
|
||||
|
||||
var Alert = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(Alert, _React$Component);
|
||||
|
||||
var _super = _createSuper(Alert);
|
||||
|
||||
function Alert() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, Alert);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
_this.state = {
|
||||
closing: false,
|
||||
closed: false
|
||||
};
|
||||
|
||||
_this.handleClose = function (e) {
|
||||
e.preventDefault();
|
||||
var dom = ReactDOM.findDOMNode(_assertThisInitialized(_this));
|
||||
dom.style.height = "".concat(dom.offsetHeight, "px"); // Magic code
|
||||
// 重复一次后才能正确设置 height
|
||||
|
||||
dom.style.height = "".concat(dom.offsetHeight, "px");
|
||||
|
||||
_this.setState({
|
||||
closing: true
|
||||
});
|
||||
|
||||
(_this.props.onClose || noop)(e);
|
||||
};
|
||||
|
||||
_this.animationEnd = function () {
|
||||
_this.setState({
|
||||
closing: false,
|
||||
closed: true
|
||||
});
|
||||
|
||||
(_this.props.afterClose || noop)();
|
||||
};
|
||||
|
||||
_this.renderAlert = function (_ref) {
|
||||
var _classNames;
|
||||
|
||||
var getPrefixCls = _ref.getPrefixCls,
|
||||
direction = _ref.direction;
|
||||
var _this$props = _this.props,
|
||||
description = _this$props.description,
|
||||
customizePrefixCls = _this$props.prefixCls,
|
||||
message = _this$props.message,
|
||||
closeText = _this$props.closeText,
|
||||
banner = _this$props.banner,
|
||||
_this$props$className = _this$props.className,
|
||||
className = _this$props$className === void 0 ? '' : _this$props$className,
|
||||
style = _this$props.style,
|
||||
icon = _this$props.icon,
|
||||
onMouseEnter = _this$props.onMouseEnter,
|
||||
onMouseLeave = _this$props.onMouseLeave,
|
||||
onClick = _this$props.onClick;
|
||||
var _this$props2 = _this.props,
|
||||
closable = _this$props2.closable,
|
||||
type = _this$props2.type,
|
||||
showIcon = _this$props2.showIcon;
|
||||
var _this$state = _this.state,
|
||||
closing = _this$state.closing,
|
||||
closed = _this$state.closed;
|
||||
var prefixCls = getPrefixCls('alert', customizePrefixCls); // banner模式默认有 Icon
|
||||
|
||||
showIcon = banner && showIcon === undefined ? true : showIcon; // banner模式默认为警告
|
||||
|
||||
type = banner && type === undefined ? 'warning' : type || 'info'; // use outline icon in alert with description
|
||||
|
||||
var iconType = (description ? iconMapOutlined : iconMapFilled)[type] || null; // closeable when closeText is assigned
|
||||
|
||||
if (closeText) {
|
||||
closable = true;
|
||||
}
|
||||
|
||||
var alertCls = classNames(prefixCls, "".concat(prefixCls, "-").concat(type), (_classNames = {}, _defineProperty(_classNames, "".concat(prefixCls, "-closing"), closing), _defineProperty(_classNames, "".concat(prefixCls, "-with-description"), !!description), _defineProperty(_classNames, "".concat(prefixCls, "-no-icon"), !showIcon), _defineProperty(_classNames, "".concat(prefixCls, "-banner"), !!banner), _defineProperty(_classNames, "".concat(prefixCls, "-closable"), closable), _defineProperty(_classNames, "".concat(prefixCls, "-rtl"), direction === 'rtl'), _classNames), className);
|
||||
var closeIcon = closable ? /*#__PURE__*/React.createElement("button", {
|
||||
type: "button",
|
||||
onClick: _this.handleClose,
|
||||
className: "".concat(prefixCls, "-close-icon"),
|
||||
tabIndex: 0
|
||||
}, closeText ? /*#__PURE__*/React.createElement("span", {
|
||||
className: "".concat(prefixCls, "-close-text")
|
||||
}, closeText) : /*#__PURE__*/React.createElement(CloseOutlined, null)) : null;
|
||||
var dataOrAriaProps = getDataOrAriaProps(_this.props);
|
||||
var iconNode = icon && (React.isValidElement(icon) ? React.cloneElement(icon, {
|
||||
className: classNames("".concat(prefixCls, "-icon"), _defineProperty({}, icon.props.className, icon.props.className))
|
||||
}) : /*#__PURE__*/React.createElement("span", {
|
||||
className: "".concat(prefixCls, "-icon")
|
||||
}, icon)) || React.createElement(iconType, {
|
||||
className: "".concat(prefixCls, "-icon")
|
||||
});
|
||||
return closed ? null : /*#__PURE__*/React.createElement(Animate, {
|
||||
component: "",
|
||||
showProp: "data-show",
|
||||
transitionName: "".concat(prefixCls, "-slide-up"),
|
||||
onEnd: _this.animationEnd
|
||||
}, /*#__PURE__*/React.createElement("div", _extends({
|
||||
"data-show": !closing,
|
||||
className: alertCls,
|
||||
style: style,
|
||||
onMouseEnter: onMouseEnter,
|
||||
onMouseLeave: onMouseLeave,
|
||||
onClick: onClick
|
||||
}, dataOrAriaProps), showIcon ? iconNode : null, /*#__PURE__*/React.createElement("span", {
|
||||
className: "".concat(prefixCls, "-message")
|
||||
}, message), /*#__PURE__*/React.createElement("span", {
|
||||
className: "".concat(prefixCls, "-description")
|
||||
}, description), closeIcon));
|
||||
};
|
||||
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(Alert, [{
|
||||
key: "render",
|
||||
value: function render() {
|
||||
return /*#__PURE__*/React.createElement(ConfigConsumer, null, this.renderAlert);
|
||||
}
|
||||
}]);
|
||||
|
||||
return Alert;
|
||||
}(React.Component);
|
||||
|
||||
export { Alert as default };
|
||||
Alert.ErrorBoundary = ErrorBoundary;
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import '../../style/index.css';
|
||||
import './index.css';
|
||||
+248
@@ -0,0 +1,248 @@
|
||||
/* stylelint-disable at-rule-empty-line-before,at-rule-name-space-after,at-rule-no-unknown */
|
||||
/* stylelint-disable no-duplicate-selectors */
|
||||
/* stylelint-disable */
|
||||
/* stylelint-disable declaration-bang-space-before,no-duplicate-selectors,string-no-newline */
|
||||
.ant-alert {
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
font-size: 14px;
|
||||
font-variant: tabular-nums;
|
||||
line-height: 1.5715;
|
||||
list-style: none;
|
||||
-webkit-font-feature-settings: 'tnum';
|
||||
font-feature-settings: 'tnum';
|
||||
position: relative;
|
||||
padding: 8px 15px 8px 37px;
|
||||
word-wrap: break-word;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.ant-alert.ant-alert-no-icon {
|
||||
padding: 8px 15px;
|
||||
}
|
||||
.ant-alert.ant-alert-closable {
|
||||
padding-right: 30px;
|
||||
}
|
||||
.ant-alert-icon {
|
||||
position: absolute;
|
||||
top: 12.0005px;
|
||||
left: 16px;
|
||||
}
|
||||
.ant-alert-description {
|
||||
display: none;
|
||||
font-size: 14px;
|
||||
line-height: 22px;
|
||||
}
|
||||
.ant-alert-success {
|
||||
background-color: #f6ffed;
|
||||
border: 1px solid #b7eb8f;
|
||||
}
|
||||
.ant-alert-success .ant-alert-icon {
|
||||
color: #52c41a;
|
||||
}
|
||||
.ant-alert-info {
|
||||
background-color: #e6f7ff;
|
||||
border: 1px solid #91d5ff;
|
||||
}
|
||||
.ant-alert-info .ant-alert-icon {
|
||||
color: #1890ff;
|
||||
}
|
||||
.ant-alert-warning {
|
||||
background-color: #fffbe6;
|
||||
border: 1px solid #ffe58f;
|
||||
}
|
||||
.ant-alert-warning .ant-alert-icon {
|
||||
color: #faad14;
|
||||
}
|
||||
.ant-alert-error {
|
||||
background-color: #fff2f0;
|
||||
border: 1px solid #ffccc7;
|
||||
}
|
||||
.ant-alert-error .ant-alert-icon {
|
||||
color: #ff4d4f;
|
||||
}
|
||||
.ant-alert-error .ant-alert-description > pre {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
.ant-alert-close-icon {
|
||||
position: absolute;
|
||||
top: 8px;
|
||||
right: 16px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
font-size: 12px;
|
||||
line-height: 22px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ant-alert-close-icon .anticon-close {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
-webkit-transition: color 0.3s;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
.ant-alert-close-icon .anticon-close:hover {
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.ant-alert-close-text {
|
||||
color: rgba(0, 0, 0, 0.45);
|
||||
-webkit-transition: color 0.3s;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
.ant-alert-close-text:hover {
|
||||
color: rgba(0, 0, 0, 0.75);
|
||||
}
|
||||
.ant-alert-with-description {
|
||||
position: relative;
|
||||
padding: 15px 15px 15px 64px;
|
||||
color: rgba(0, 0, 0, 0.65);
|
||||
line-height: 1.5715;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.ant-alert-with-description.ant-alert-no-icon {
|
||||
padding: 15px 15px;
|
||||
}
|
||||
.ant-alert-with-description .ant-alert-icon {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 24px;
|
||||
font-size: 24px;
|
||||
}
|
||||
.ant-alert-with-description .ant-alert-close-icon {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 16px;
|
||||
font-size: 14px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.ant-alert-with-description .ant-alert-message {
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
font-size: 16px;
|
||||
}
|
||||
.ant-alert-message {
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
.ant-alert-with-description .ant-alert-description {
|
||||
display: block;
|
||||
}
|
||||
.ant-alert.ant-alert-closing {
|
||||
height: 0 !important;
|
||||
margin: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
-webkit-transform-origin: 50% 0;
|
||||
transform-origin: 50% 0;
|
||||
-webkit-transition: all 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
||||
transition: all 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
||||
}
|
||||
.ant-alert-slide-up-leave {
|
||||
-webkit-animation: antAlertSlideUpOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
||||
animation: antAlertSlideUpOut 0.3s cubic-bezier(0.78, 0.14, 0.15, 0.86);
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
.ant-alert-banner {
|
||||
margin-bottom: 0;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
@-webkit-keyframes antAlertSlideUpIn {
|
||||
0% {
|
||||
-webkit-transform: scaleY(0);
|
||||
transform: scaleY(0);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scaleY(1);
|
||||
transform: scaleY(1);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes antAlertSlideUpIn {
|
||||
0% {
|
||||
-webkit-transform: scaleY(0);
|
||||
transform: scaleY(0);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scaleY(1);
|
||||
transform: scaleY(1);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes antAlertSlideUpOut {
|
||||
0% {
|
||||
-webkit-transform: scaleY(1);
|
||||
transform: scaleY(1);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scaleY(0);
|
||||
transform: scaleY(0);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes antAlertSlideUpOut {
|
||||
0% {
|
||||
-webkit-transform: scaleY(1);
|
||||
transform: scaleY(1);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: scaleY(0);
|
||||
transform: scaleY(0);
|
||||
-webkit-transform-origin: 0% 0%;
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
.ant-alert-rtl {
|
||||
padding: 8px 37px 8px 15px;
|
||||
direction: rtl;
|
||||
}
|
||||
.ant-alert-rtl.ant-alert.ant-alert-closable {
|
||||
padding-right: 15px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.ant-alert-rtl .ant-alert-icon {
|
||||
right: 16px;
|
||||
left: auto;
|
||||
}
|
||||
.ant-alert-rtl .ant-alert-close-icon {
|
||||
right: auto;
|
||||
left: 16px;
|
||||
}
|
||||
.ant-alert-rtl.ant-alert-with-description {
|
||||
padding: 15px 64px 15px 15px;
|
||||
}
|
||||
.ant-alert-rtl.ant-alert-with-description.ant-alert-no-icon {
|
||||
padding: 15px;
|
||||
}
|
||||
.ant-alert-rtl.ant-alert-with-description .ant-alert-icon {
|
||||
right: 24px;
|
||||
left: auto;
|
||||
}
|
||||
.ant-alert-rtl.ant-alert-with-description .ant-alert-close-icon {
|
||||
right: auto;
|
||||
left: 16px;
|
||||
}
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import '../../style/index.less';
|
||||
import './index.less';
|
||||
+2
@@ -0,0 +1,2 @@
|
||||
import '../../style/index.less';
|
||||
import './index.less';
|
||||
+191
@@ -0,0 +1,191 @@
|
||||
@import '../../style/themes/index';
|
||||
@import '../../style/mixins/index';
|
||||
|
||||
@alert-prefix-cls: ~'@{ant-prefix}-alert';
|
||||
|
||||
.@{alert-prefix-cls} {
|
||||
.reset-component;
|
||||
|
||||
position: relative;
|
||||
padding: 8px 15px 8px 37px;
|
||||
word-wrap: break-word;
|
||||
border-radius: @border-radius-base;
|
||||
|
||||
&&-no-icon {
|
||||
padding: @alert-no-icon-padding-vertical 15px;
|
||||
}
|
||||
|
||||
&&-closable {
|
||||
padding-right: 30px;
|
||||
}
|
||||
|
||||
&-icon {
|
||||
position: absolute;
|
||||
top: 8px + @font-size-base * @line-height-base / 2 - @font-size-base / 2;
|
||||
left: 16px;
|
||||
}
|
||||
|
||||
&-description {
|
||||
display: none;
|
||||
font-size: @font-size-base;
|
||||
line-height: 22px;
|
||||
}
|
||||
|
||||
&-success {
|
||||
background-color: @alert-success-bg-color;
|
||||
border: @border-width-base @border-style-base @alert-success-border-color;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-success-icon-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-info {
|
||||
background-color: @alert-info-bg-color;
|
||||
border: @border-width-base @border-style-base @alert-info-border-color;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-info-icon-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-warning {
|
||||
background-color: @alert-warning-bg-color;
|
||||
border: @border-width-base @border-style-base @alert-warning-border-color;
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-warning-icon-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-error {
|
||||
background-color: @alert-error-bg-color;
|
||||
border: @border-width-base @border-style-base @alert-error-border-color;
|
||||
|
||||
.@{alert-prefix-cls}-icon {
|
||||
color: @alert-error-icon-color;
|
||||
}
|
||||
|
||||
.@{alert-prefix-cls}-description > pre {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-close-icon {
|
||||
position: absolute;
|
||||
top: @padding-xs;
|
||||
right: 16px;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
font-size: @font-size-sm;
|
||||
line-height: 22px;
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
|
||||
.@{iconfont-css-prefix}-close {
|
||||
color: @alert-close-color;
|
||||
transition: color 0.3s;
|
||||
&:hover {
|
||||
color: @alert-close-hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&-close-text {
|
||||
color: @alert-close-color;
|
||||
transition: color 0.3s;
|
||||
&:hover {
|
||||
color: @alert-close-hover-color;
|
||||
}
|
||||
}
|
||||
|
||||
&-with-description {
|
||||
position: relative;
|
||||
padding: 15px 15px 15px 64px;
|
||||
color: @alert-text-color;
|
||||
line-height: @line-height-base;
|
||||
border-radius: @border-radius-base;
|
||||
}
|
||||
|
||||
&-with-description&-no-icon {
|
||||
padding: @alert-with-description-no-icon-padding-vertical 15px;
|
||||
}
|
||||
|
||||
&-with-description &-icon {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 24px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
&-with-description &-close-icon {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
right: 16px;
|
||||
font-size: @font-size-base;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&-with-description &-message {
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
color: @alert-message-color;
|
||||
font-size: @font-size-lg;
|
||||
}
|
||||
|
||||
&-message {
|
||||
color: @alert-message-color;
|
||||
}
|
||||
|
||||
&-with-description &-description {
|
||||
display: block;
|
||||
}
|
||||
|
||||
&&-closing {
|
||||
height: 0 !important;
|
||||
margin: 0;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
transform-origin: 50% 0;
|
||||
transition: all 0.3s @ease-in-out-circ;
|
||||
}
|
||||
|
||||
&-slide-up-leave {
|
||||
animation: antAlertSlideUpOut 0.3s @ease-in-out-circ;
|
||||
animation-fill-mode: both;
|
||||
}
|
||||
|
||||
&-banner {
|
||||
margin-bottom: 0;
|
||||
border: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes antAlertSlideUpIn {
|
||||
0% {
|
||||
transform: scaleY(0);
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
transform: scaleY(1);
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes antAlertSlideUpOut {
|
||||
0% {
|
||||
transform: scaleY(1);
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 1;
|
||||
}
|
||||
100% {
|
||||
transform: scaleY(0);
|
||||
transform-origin: 0% 0%;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@import './rtl.less';
|
||||
+58
@@ -0,0 +1,58 @@
|
||||
@import '../../style/themes/index';
|
||||
@import '../../style/mixins/index';
|
||||
|
||||
@alert-prefix-cls: ~'@{ant-prefix}-alert';
|
||||
|
||||
.@{alert-prefix-cls} {
|
||||
&-rtl {
|
||||
padding: 8px 37px 8px 15px;
|
||||
direction: rtl;
|
||||
}
|
||||
|
||||
&&-closable {
|
||||
.@{alert-prefix-cls}-rtl& {
|
||||
padding-right: 15px;
|
||||
padding-left: 30px;
|
||||
}
|
||||
}
|
||||
|
||||
&-icon {
|
||||
.@{alert-prefix-cls}-rtl & {
|
||||
right: 16px;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
&-close-icon {
|
||||
.@{alert-prefix-cls}-rtl & {
|
||||
right: auto;
|
||||
left: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
&-with-description {
|
||||
.@{alert-prefix-cls}-rtl& {
|
||||
padding: 15px 64px 15px 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&-with-description&-no-icon {
|
||||
.@{alert-prefix-cls}-rtl& {
|
||||
padding: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
&-with-description &-icon {
|
||||
.@{alert-prefix-cls}-rtl& {
|
||||
right: 24px;
|
||||
left: auto;
|
||||
}
|
||||
}
|
||||
|
||||
&-with-description &-close-icon {
|
||||
.@{alert-prefix-cls}-rtl& {
|
||||
right: auto;
|
||||
left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
+81
@@ -0,0 +1,81 @@
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import AnchorLink from './AnchorLink';
|
||||
import { ConfigConsumerProps } from '../config-provider';
|
||||
declare function getDefaultContainer(): Window & typeof globalThis;
|
||||
export declare type AnchorContainer = HTMLElement | Window;
|
||||
export interface AnchorProps {
|
||||
prefixCls?: string;
|
||||
className?: string;
|
||||
style?: React.CSSProperties;
|
||||
children?: React.ReactNode;
|
||||
offsetTop?: number;
|
||||
bounds?: number;
|
||||
affix?: boolean;
|
||||
showInkInFixed?: boolean;
|
||||
getContainer?: () => AnchorContainer;
|
||||
/** Return customize highlight anchor */
|
||||
getCurrentAnchor?: () => string;
|
||||
onClick?: (e: React.MouseEvent<HTMLElement>, link: {
|
||||
title: React.ReactNode;
|
||||
href: string;
|
||||
}) => void;
|
||||
/** Scroll to target offset value, if none, it's offsetTop prop value or 0. */
|
||||
targetOffset?: number;
|
||||
/** Listening event when scrolling change active link */
|
||||
onChange?: (currentActiveLink: string) => void;
|
||||
}
|
||||
export interface AnchorState {
|
||||
activeLink: null | string;
|
||||
}
|
||||
export interface AnchorDefaultProps extends AnchorProps {
|
||||
prefixCls: string;
|
||||
affix: boolean;
|
||||
showInkInFixed: boolean;
|
||||
getContainer: () => AnchorContainer;
|
||||
}
|
||||
export interface AntAnchor {
|
||||
registerLink: (link: string) => void;
|
||||
unregisterLink: (link: string) => void;
|
||||
activeLink: string | null;
|
||||
scrollTo: (link: string) => void;
|
||||
onClick?: (e: React.MouseEvent<HTMLElement>, link: {
|
||||
title: React.ReactNode;
|
||||
href: string;
|
||||
}) => void;
|
||||
}
|
||||
export default class Anchor extends React.Component<AnchorProps, AnchorState> {
|
||||
static Link: typeof AnchorLink;
|
||||
static defaultProps: {
|
||||
affix: boolean;
|
||||
showInkInFixed: boolean;
|
||||
getContainer: typeof getDefaultContainer;
|
||||
};
|
||||
static childContextTypes: {
|
||||
antAnchor: PropTypes.Requireable<object>;
|
||||
};
|
||||
state: {
|
||||
activeLink: null;
|
||||
};
|
||||
private inkNode;
|
||||
private scrollContainer;
|
||||
private links;
|
||||
private scrollEvent;
|
||||
private animating;
|
||||
private prefixCls?;
|
||||
getChildContext(): {
|
||||
antAnchor: AntAnchor;
|
||||
};
|
||||
componentDidMount(): void;
|
||||
componentDidUpdate(): void;
|
||||
componentWillUnmount(): void;
|
||||
getCurrentAnchor(offsetTop?: number, bounds?: number): string;
|
||||
handleScrollTo: (link: string) => void;
|
||||
saveInkNode: (node: HTMLSpanElement) => void;
|
||||
setCurrentActiveLink: (link: string) => void;
|
||||
handleScroll: () => void;
|
||||
updateInk: () => void;
|
||||
renderAnchor: ({ getPrefixCls, direction }: ConfigConsumerProps) => JSX.Element;
|
||||
render(): JSX.Element;
|
||||
}
|
||||
export {};
|
||||
+343
@@ -0,0 +1,343 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
||||
|
||||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
import * as React from 'react';
|
||||
import * as ReactDOM from 'react-dom';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import addEventListener from "rc-util/es/Dom/addEventListener";
|
||||
import Affix from '../affix';
|
||||
import { ConfigConsumer } from '../config-provider';
|
||||
import scrollTo from '../_util/scrollTo';
|
||||
import getScroll from '../_util/getScroll';
|
||||
|
||||
function getDefaultContainer() {
|
||||
return window;
|
||||
}
|
||||
|
||||
function getOffsetTop(element, container) {
|
||||
if (!element) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
if (!element.getClientRects().length) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
var rect = element.getBoundingClientRect();
|
||||
|
||||
if (rect.width || rect.height) {
|
||||
if (container === window) {
|
||||
container = element.ownerDocument.documentElement;
|
||||
return rect.top - container.clientTop;
|
||||
}
|
||||
|
||||
return rect.top - container.getBoundingClientRect().top;
|
||||
}
|
||||
|
||||
return rect.top;
|
||||
}
|
||||
|
||||
var sharpMatcherRegx = /#([^#]+)$/;
|
||||
|
||||
var Anchor = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(Anchor, _React$Component);
|
||||
|
||||
var _super = _createSuper(Anchor);
|
||||
|
||||
function Anchor() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, Anchor);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
_this.state = {
|
||||
activeLink: null
|
||||
};
|
||||
_this.links = [];
|
||||
|
||||
_this.handleScrollTo = function (link) {
|
||||
var _this$props = _this.props,
|
||||
offsetTop = _this$props.offsetTop,
|
||||
getContainer = _this$props.getContainer,
|
||||
targetOffset = _this$props.targetOffset;
|
||||
|
||||
_this.setCurrentActiveLink(link);
|
||||
|
||||
var container = getContainer();
|
||||
var scrollTop = getScroll(container, true);
|
||||
var sharpLinkMatch = sharpMatcherRegx.exec(link);
|
||||
|
||||
if (!sharpLinkMatch) {
|
||||
return;
|
||||
}
|
||||
|
||||
var targetElement = document.getElementById(sharpLinkMatch[1]);
|
||||
|
||||
if (!targetElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
var eleOffsetTop = getOffsetTop(targetElement, container);
|
||||
var y = scrollTop + eleOffsetTop;
|
||||
y -= targetOffset !== undefined ? targetOffset : offsetTop || 0;
|
||||
_this.animating = true;
|
||||
scrollTo(y, {
|
||||
callback: function callback() {
|
||||
_this.animating = false;
|
||||
},
|
||||
getContainer: getContainer
|
||||
});
|
||||
};
|
||||
|
||||
_this.saveInkNode = function (node) {
|
||||
_this.inkNode = node;
|
||||
};
|
||||
|
||||
_this.setCurrentActiveLink = function (link) {
|
||||
var activeLink = _this.state.activeLink;
|
||||
var onChange = _this.props.onChange;
|
||||
|
||||
if (activeLink !== link) {
|
||||
_this.setState({
|
||||
activeLink: link
|
||||
});
|
||||
|
||||
if (onChange) {
|
||||
onChange(link);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
_this.handleScroll = function () {
|
||||
if (_this.animating) {
|
||||
return;
|
||||
}
|
||||
|
||||
var _this$props2 = _this.props,
|
||||
offsetTop = _this$props2.offsetTop,
|
||||
bounds = _this$props2.bounds,
|
||||
targetOffset = _this$props2.targetOffset;
|
||||
|
||||
var currentActiveLink = _this.getCurrentAnchor(targetOffset !== undefined ? targetOffset : offsetTop || 0, bounds);
|
||||
|
||||
_this.setCurrentActiveLink(currentActiveLink);
|
||||
};
|
||||
|
||||
_this.updateInk = function () {
|
||||
if (typeof document === 'undefined') {
|
||||
return;
|
||||
}
|
||||
|
||||
var _assertThisInitialize = _assertThisInitialized(_this),
|
||||
prefixCls = _assertThisInitialize.prefixCls;
|
||||
|
||||
var anchorNode = ReactDOM.findDOMNode(_assertThisInitialized(_this));
|
||||
var linkNode = anchorNode.getElementsByClassName("".concat(prefixCls, "-link-title-active"))[0];
|
||||
|
||||
if (linkNode) {
|
||||
_this.inkNode.style.top = "".concat(linkNode.offsetTop + linkNode.clientHeight / 2 - 4.5, "px");
|
||||
}
|
||||
};
|
||||
|
||||
_this.renderAnchor = function (_ref) {
|
||||
var getPrefixCls = _ref.getPrefixCls,
|
||||
direction = _ref.direction;
|
||||
var _this$props3 = _this.props,
|
||||
customizePrefixCls = _this$props3.prefixCls,
|
||||
_this$props3$classNam = _this$props3.className,
|
||||
className = _this$props3$classNam === void 0 ? '' : _this$props3$classNam,
|
||||
style = _this$props3.style,
|
||||
offsetTop = _this$props3.offsetTop,
|
||||
affix = _this$props3.affix,
|
||||
showInkInFixed = _this$props3.showInkInFixed,
|
||||
children = _this$props3.children,
|
||||
getContainer = _this$props3.getContainer;
|
||||
var activeLink = _this.state.activeLink;
|
||||
var prefixCls = getPrefixCls('anchor', customizePrefixCls); // To support old version react.
|
||||
// Have to add prefixCls on the instance.
|
||||
// https://github.com/facebook/react/issues/12397
|
||||
|
||||
_this.prefixCls = prefixCls;
|
||||
var inkClass = classNames("".concat(prefixCls, "-ink-ball"), {
|
||||
visible: activeLink
|
||||
});
|
||||
var wrapperClass = classNames(className, "".concat(prefixCls, "-wrapper"), _defineProperty({}, "".concat(prefixCls, "-rtl"), direction === 'rtl'));
|
||||
var anchorClass = classNames(prefixCls, {
|
||||
fixed: !affix && !showInkInFixed
|
||||
});
|
||||
|
||||
var wrapperStyle = _extends({
|
||||
maxHeight: offsetTop ? "calc(100vh - ".concat(offsetTop, "px)") : '100vh'
|
||||
}, style);
|
||||
|
||||
var anchorContent = /*#__PURE__*/React.createElement("div", {
|
||||
className: wrapperClass,
|
||||
style: wrapperStyle
|
||||
}, /*#__PURE__*/React.createElement("div", {
|
||||
className: anchorClass
|
||||
}, /*#__PURE__*/React.createElement("div", {
|
||||
className: "".concat(prefixCls, "-ink")
|
||||
}, /*#__PURE__*/React.createElement("span", {
|
||||
className: inkClass,
|
||||
ref: _this.saveInkNode
|
||||
})), children));
|
||||
return !affix ? anchorContent : /*#__PURE__*/React.createElement(Affix, {
|
||||
offsetTop: offsetTop,
|
||||
target: getContainer
|
||||
}, anchorContent);
|
||||
};
|
||||
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(Anchor, [{
|
||||
key: "getChildContext",
|
||||
value: function getChildContext() {
|
||||
var _this2 = this;
|
||||
|
||||
var antAnchor = {
|
||||
registerLink: function registerLink(link) {
|
||||
if (!_this2.links.includes(link)) {
|
||||
_this2.links.push(link);
|
||||
}
|
||||
},
|
||||
unregisterLink: function unregisterLink(link) {
|
||||
var index = _this2.links.indexOf(link);
|
||||
|
||||
if (index !== -1) {
|
||||
_this2.links.splice(index, 1);
|
||||
}
|
||||
},
|
||||
activeLink: this.state.activeLink,
|
||||
scrollTo: this.handleScrollTo,
|
||||
onClick: this.props.onClick
|
||||
};
|
||||
return {
|
||||
antAnchor: antAnchor
|
||||
};
|
||||
}
|
||||
}, {
|
||||
key: "componentDidMount",
|
||||
value: function componentDidMount() {
|
||||
var getContainer = this.props.getContainer;
|
||||
this.scrollContainer = getContainer();
|
||||
this.scrollEvent = addEventListener(this.scrollContainer, 'scroll', this.handleScroll);
|
||||
this.handleScroll();
|
||||
}
|
||||
}, {
|
||||
key: "componentDidUpdate",
|
||||
value: function componentDidUpdate() {
|
||||
if (this.scrollEvent) {
|
||||
var getContainer = this.props.getContainer;
|
||||
var currentContainer = getContainer();
|
||||
|
||||
if (this.scrollContainer !== currentContainer) {
|
||||
this.scrollContainer = currentContainer;
|
||||
this.scrollEvent.remove();
|
||||
this.scrollEvent = addEventListener(this.scrollContainer, 'scroll', this.handleScroll);
|
||||
this.handleScroll();
|
||||
}
|
||||
}
|
||||
|
||||
this.updateInk();
|
||||
}
|
||||
}, {
|
||||
key: "componentWillUnmount",
|
||||
value: function componentWillUnmount() {
|
||||
if (this.scrollEvent) {
|
||||
this.scrollEvent.remove();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "getCurrentAnchor",
|
||||
value: function getCurrentAnchor() {
|
||||
var offsetTop = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 0;
|
||||
var bounds = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 5;
|
||||
var getCurrentAnchor = this.props.getCurrentAnchor;
|
||||
|
||||
if (typeof getCurrentAnchor === 'function') {
|
||||
return getCurrentAnchor();
|
||||
}
|
||||
|
||||
var activeLink = '';
|
||||
|
||||
if (typeof document === 'undefined') {
|
||||
return activeLink;
|
||||
}
|
||||
|
||||
var linkSections = [];
|
||||
var getContainer = this.props.getContainer;
|
||||
var container = getContainer();
|
||||
this.links.forEach(function (link) {
|
||||
var sharpLinkMatch = sharpMatcherRegx.exec(link.toString());
|
||||
|
||||
if (!sharpLinkMatch) {
|
||||
return;
|
||||
}
|
||||
|
||||
var target = document.getElementById(sharpLinkMatch[1]);
|
||||
|
||||
if (target) {
|
||||
var top = getOffsetTop(target, container);
|
||||
|
||||
if (top < offsetTop + bounds) {
|
||||
linkSections.push({
|
||||
link: link,
|
||||
top: top
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
if (linkSections.length) {
|
||||
var maxSection = linkSections.reduce(function (prev, curr) {
|
||||
return curr.top > prev.top ? curr : prev;
|
||||
});
|
||||
return maxSection.link;
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
}, {
|
||||
key: "render",
|
||||
value: function render() {
|
||||
return /*#__PURE__*/React.createElement(ConfigConsumer, null, this.renderAnchor);
|
||||
}
|
||||
}]);
|
||||
|
||||
return Anchor;
|
||||
}(React.Component);
|
||||
|
||||
export { Anchor as default };
|
||||
Anchor.defaultProps = {
|
||||
affix: true,
|
||||
showInkInFixed: false,
|
||||
getContainer: getDefaultContainer
|
||||
};
|
||||
Anchor.childContextTypes = {
|
||||
antAnchor: PropTypes.object
|
||||
};
|
||||
+30
@@ -0,0 +1,30 @@
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import { AntAnchor } from './Anchor';
|
||||
import { ConfigConsumerProps } from '../config-provider';
|
||||
export interface AnchorLinkProps {
|
||||
prefixCls?: string;
|
||||
href: string;
|
||||
target?: string;
|
||||
title: React.ReactNode;
|
||||
children?: React.ReactNode;
|
||||
className?: string;
|
||||
}
|
||||
declare class AnchorLink extends React.Component<AnchorLinkProps, any> {
|
||||
static defaultProps: {
|
||||
href: string;
|
||||
};
|
||||
static contextTypes: {
|
||||
antAnchor: PropTypes.Requireable<object>;
|
||||
};
|
||||
context: {
|
||||
antAnchor: AntAnchor;
|
||||
};
|
||||
componentDidMount(): void;
|
||||
componentDidUpdate({ href: prevHref }: AnchorLinkProps): void;
|
||||
componentWillUnmount(): void;
|
||||
handleClick: (e: React.MouseEvent<HTMLElement, MouseEvent>) => void;
|
||||
renderAnchorLink: ({ getPrefixCls }: ConfigConsumerProps) => JSX.Element;
|
||||
render(): JSX.Element;
|
||||
}
|
||||
export default AnchorLink;
|
||||
+124
@@ -0,0 +1,124 @@
|
||||
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
||||
|
||||
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
||||
|
||||
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
|
||||
|
||||
function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
|
||||
|
||||
function _createSuper(Derived) { return function () { var Super = _getPrototypeOf(Derived), result; if (_isNativeReflectConstruct()) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
||||
|
||||
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
||||
|
||||
function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } }
|
||||
|
||||
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
||||
|
||||
import * as React from 'react';
|
||||
import * as PropTypes from 'prop-types';
|
||||
import classNames from 'classnames';
|
||||
import { ConfigConsumer } from '../config-provider';
|
||||
|
||||
var AnchorLink = /*#__PURE__*/function (_React$Component) {
|
||||
_inherits(AnchorLink, _React$Component);
|
||||
|
||||
var _super = _createSuper(AnchorLink);
|
||||
|
||||
function AnchorLink() {
|
||||
var _this;
|
||||
|
||||
_classCallCheck(this, AnchorLink);
|
||||
|
||||
_this = _super.apply(this, arguments);
|
||||
|
||||
_this.handleClick = function (e) {
|
||||
var _this$context$antAnch = _this.context.antAnchor,
|
||||
scrollTo = _this$context$antAnch.scrollTo,
|
||||
onClick = _this$context$antAnch.onClick;
|
||||
var _this$props = _this.props,
|
||||
href = _this$props.href,
|
||||
title = _this$props.title;
|
||||
|
||||
if (onClick) {
|
||||
onClick(e, {
|
||||
title: title,
|
||||
href: href
|
||||
});
|
||||
}
|
||||
|
||||
scrollTo(href);
|
||||
};
|
||||
|
||||
_this.renderAnchorLink = function (_ref) {
|
||||
var getPrefixCls = _ref.getPrefixCls;
|
||||
var _this$props2 = _this.props,
|
||||
customizePrefixCls = _this$props2.prefixCls,
|
||||
href = _this$props2.href,
|
||||
title = _this$props2.title,
|
||||
children = _this$props2.children,
|
||||
className = _this$props2.className,
|
||||
target = _this$props2.target;
|
||||
var prefixCls = getPrefixCls('anchor', customizePrefixCls);
|
||||
var active = _this.context.antAnchor.activeLink === href;
|
||||
var wrapperClassName = classNames(className, "".concat(prefixCls, "-link"), _defineProperty({}, "".concat(prefixCls, "-link-active"), active));
|
||||
var titleClassName = classNames("".concat(prefixCls, "-link-title"), _defineProperty({}, "".concat(prefixCls, "-link-title-active"), active));
|
||||
return /*#__PURE__*/React.createElement("div", {
|
||||
className: wrapperClassName
|
||||
}, /*#__PURE__*/React.createElement("a", {
|
||||
className: titleClassName,
|
||||
href: href,
|
||||
title: typeof title === 'string' ? title : '',
|
||||
target: target,
|
||||
onClick: _this.handleClick
|
||||
}, title), children);
|
||||
};
|
||||
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(AnchorLink, [{
|
||||
key: "componentDidMount",
|
||||
value: function componentDidMount() {
|
||||
this.context.antAnchor.registerLink(this.props.href);
|
||||
}
|
||||
}, {
|
||||
key: "componentDidUpdate",
|
||||
value: function componentDidUpdate(_ref2) {
|
||||
var prevHref = _ref2.href;
|
||||
var href = this.props.href;
|
||||
|
||||
if (prevHref !== href) {
|
||||
this.context.antAnchor.unregisterLink(prevHref);
|
||||
this.context.antAnchor.registerLink(href);
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: "componentWillUnmount",
|
||||
value: function componentWillUnmount() {
|
||||
this.context.antAnchor.unregisterLink(this.props.href);
|
||||
}
|
||||
}, {
|
||||
key: "render",
|
||||
value: function render() {
|
||||
return /*#__PURE__*/React.createElement(ConfigConsumer, null, this.renderAnchorLink);
|
||||
}
|
||||
}]);
|
||||
|
||||
return AnchorLink;
|
||||
}(React.Component);
|
||||
|
||||
AnchorLink.defaultProps = {
|
||||
href: '#'
|
||||
};
|
||||
AnchorLink.contextTypes = {
|
||||
antAnchor: PropTypes.object
|
||||
};
|
||||
export default AnchorLink;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import Anchor from './Anchor';
|
||||
export { AnchorProps } from './Anchor';
|
||||
export { AnchorLinkProps } from './AnchorLink';
|
||||
export default Anchor;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import Anchor from './Anchor';
|
||||
import AnchorLink from './AnchorLink';
|
||||
Anchor.Link = AnchorLink;
|
||||
export default Anchor;
|
||||
+4
@@ -0,0 +1,4 @@
|
||||
import '../../style/index.css';
|
||||
import './index.css'; // style dependencies
|
||||
|
||||
import '../../affix/style/css';
|
||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user