diff --git a/components/__tests__/__snapshots__/index.test.js.snap b/components/__tests__/__snapshots__/index.test.js.snap index 037f96a846..ad99a83e03 100644 --- a/components/__tests__/__snapshots__/index.test.js.snap +++ b/components/__tests__/__snapshots__/index.test.js.snap @@ -27,6 +27,7 @@ Array [ "Drawer", "Empty", "Form", + "Grid", "Input", "InputNumber", "Layout", diff --git a/components/_util/getRenderPropValue.ts b/components/_util/getRenderPropValue.ts new file mode 100644 index 0000000000..fef94966d5 --- /dev/null +++ b/components/_util/getRenderPropValue.ts @@ -0,0 +1,18 @@ +import React from 'react'; + +export type RenderFunction = () => React.ReactNode; + +export const getRenderPropValue = ( + propValue?: React.ReactNode | RenderFunction, +): React.ReactNode => { + if (!propValue) { + return null; + } + + const isRenderFunction = typeof propValue === 'function'; + if (isRenderFunction) { + return (propValue as RenderFunction)(); + } + + return propValue; +}; diff --git a/components/breadcrumb/BreadcrumbItem.tsx b/components/breadcrumb/BreadcrumbItem.tsx index 0f19fd6a79..4b00ad4e5b 100644 --- a/components/breadcrumb/BreadcrumbItem.tsx +++ b/components/breadcrumb/BreadcrumbItem.tsx @@ -10,6 +10,7 @@ export interface BreadcrumbItemProps { separator?: React.ReactNode; href?: string; overlay?: DropDownProps['overlay']; + dropdownProps?: DropDownProps; onClick?: React.MouseEventHandler; } @@ -58,10 +59,10 @@ export default class BreadcrumbItem extends React.Component { - const { overlay } = this.props; + const { overlay, dropdownProps } = this.props; if (overlay) { return ( - + {breadcrumbItem} diff --git a/components/breadcrumb/index.en-US.md b/components/breadcrumb/index.en-US.md index 9e5064b2b0..a90f300f51 100644 --- a/components/breadcrumb/index.en-US.md +++ b/components/breadcrumb/index.en-US.md @@ -30,6 +30,7 @@ A breadcrumb displays the current location within a hierarchy. It allows going b | href | Target of hyperlink | string | - | | | overlay | The dropdown menu | [Menu](/components/menu) \| () => Menu | - | | | onClick | Set the handler to handle `click` event | (e:MouseEvent)=>void | - | | +| dropdownProps | The dropdown props | [Dropdown](/components/dropdown) | - | | ### Breadcrumb.Separator diff --git a/components/breadcrumb/index.zh-CN.md b/components/breadcrumb/index.zh-CN.md index d125101af8..563cee4472 100644 --- a/components/breadcrumb/index.zh-CN.md +++ b/components/breadcrumb/index.zh-CN.md @@ -26,11 +26,12 @@ title: Breadcrumb ### Breadcrumb.Item -| 参数 | 说明 | 类型 | 默认值 | 版本 | -| ------- | -------------- | -------------------------------------- | ------ | ---- | -| href | 链接的目的地 | string | - | | -| overlay | 下拉菜单的内容 | [Menu](/components/menu) \| () => Menu | - | | -| onClick | 单击事件 | (e:MouseEvent)=>void | - | | +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| --- | --- | --- | --- | --- | +| href | 链接的目的地 | string | - | | +| overlay | 下拉菜单的内容 | [Menu](/components/menu) \| () => Menu | - | | +| onClick | 单击事件 | (e:MouseEvent)=>void | - | | +| dropdownProps | 弹出下拉菜单的自定义配置 | [Dropdown](/components/dropdown) | - | | ### Breadcrumb.Separator diff --git a/components/calendar/__tests__/__snapshots__/demo.test.js.snap b/components/calendar/__tests__/__snapshots__/demo.test.js.snap index 2f918e72cc..e26a317e01 100644 --- a/components/calendar/__tests__/__snapshots__/demo.test.js.snap +++ b/components/calendar/__tests__/__snapshots__/demo.test.js.snap @@ -204,9 +204,7 @@ exports[`renders ./components/calendar/demo/basic.md correctly 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + { ); expect(wrapper.find('.ant-card-actions').length).toBe(0); }); + + it('with tab props', () => { + const wrapper = mount( + +

Card content

+
, + ); + expect(wrapper.find('Tabs').get(0).props.size).toBe('small'); + }); }); diff --git a/components/card/index.en-US.md b/components/card/index.en-US.md index d68bff6c3c..6ef0027d47 100644 --- a/components/card/index.en-US.md +++ b/components/card/index.en-US.md @@ -37,6 +37,7 @@ A card can be used to display content related to a single subject. The content c | title | Card title | string\|ReactNode | - | | | type | Card style type, can be set to `inner` or not set | string | - | | | onTabChange | Callback when tab is switched | (key) => void | - | | +| tabProps | [Tabs](https://ant.design/components/tabs/#Tabs) | - | - | | ### Card.Grid diff --git a/components/card/index.tsx b/components/card/index.tsx index 2e206f87e1..a058a0fb31 100644 --- a/components/card/index.tsx +++ b/components/card/index.tsx @@ -3,7 +3,7 @@ import classNames from 'classnames'; import omit from 'omit.js'; import Grid from './Grid'; import Meta from './Meta'; -import Tabs from '../tabs'; +import Tabs, { TabsProps } from '../tabs'; import Row from '../row'; import Col from '../col'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; @@ -54,6 +54,7 @@ export interface CardProps extends Omit, 't onTabChange?: (key: string) => void; activeTabKey?: string; defaultActiveTabKey?: string; + tabProps?: TabsProps; } export default class Card extends React.Component { @@ -97,6 +98,7 @@ export default class Card extends React.Component { defaultActiveTabKey, tabBarExtraContent, hoverable, + tabProps = {}, ...others } = this.props; @@ -152,6 +154,7 @@ export default class Card extends React.Component { const hasActiveTabKey = activeTabKey !== undefined; const extraProps = { + ...tabProps, [hasActiveTabKey ? 'activeKey' : 'defaultActiveKey']: hasActiveTabKey ? activeTabKey : defaultActiveTabKey, @@ -162,9 +165,9 @@ export default class Card extends React.Component { const tabs = tabList && tabList.length ? ( {tabList.map(item => ( diff --git a/components/card/index.zh-CN.md b/components/card/index.zh-CN.md index 24a158516e..289c4a79af 100644 --- a/components/card/index.zh-CN.md +++ b/components/card/index.zh-CN.md @@ -38,6 +38,7 @@ cols: 1 | title | 卡片标题 | string\|ReactNode | - | | | type | 卡片类型,可设置为 `inner` 或 不设置 | string | - | | | onTabChange | 页签切换的回调 | (key) => void | - | | +| tabProps | [Tabs](https://ant.design/components/tabs-cn/#Tabs) | - | - | | ### Card.Grid diff --git a/components/carousel/__tests__/index.test.js b/components/carousel/__tests__/index.test.js index 58093d3514..8927384cc3 100644 --- a/components/carousel/__tests__/index.test.js +++ b/components/carousel/__tests__/index.test.js @@ -126,4 +126,18 @@ describe('Carousel', () => { ).toBeTruthy(); }); }); + + describe('dots precise control by plain object', () => { + it('use dots to provide dotsClasse', () => { + const wrapper = mount( + +
1
+
2
+
3
+
, + ); + wrapper.update(); + expect(wrapper.find('.slick-dots').hasClass('customDots')).toBeTruthy(); + }); + }); }); diff --git a/components/carousel/index.en-US.md b/components/carousel/index.en-US.md index 217b33042c..cc8f96500f 100644 --- a/components/carousel/index.en-US.md +++ b/components/carousel/index.en-US.md @@ -20,7 +20,7 @@ A carousel component. Scales with its container. | autoplay | Whether to scroll automatically | boolean | `false` | | | beforeChange | Callback function called before the current index changes | function(from, to) | - | | | dotPosition | The position of the dots, which can be one of `top` `bottom` `left` `right` | string | bottom | | -| dots | Whether to show the dots at the bottom of the gallery | boolean | `true` | | +| dots | Whether to show the dots at the bottom of the gallery, `object` for `dotsClass` and any others | boolean \| { className?:string } | `true` | | | easing | Transition interpolation function name | string | `linear` | | | effect | Transition effect | `scrollx` \| `fade` | `scrollx` | | diff --git a/components/carousel/index.tsx b/components/carousel/index.tsx index 9196dc8b56..55ed78ab37 100644 --- a/components/carousel/index.tsx +++ b/components/carousel/index.tsx @@ -1,4 +1,5 @@ import * as React from 'react'; +import isPlainObject from 'lodash/isPlainObject'; import debounce from 'lodash/debounce'; import { Settings } from '@ant-design/react-slick'; import classNames from 'classnames'; @@ -14,13 +15,18 @@ export type CarouselEffect = 'scrollx' | 'fade'; export type DotPosition = 'top' | 'bottom' | 'left' | 'right'; // Carousel -export interface CarouselProps extends Settings { +export interface CarouselProps extends Omit { effect?: CarouselEffect; style?: React.CSSProperties; prefixCls?: string; slickGoTo?: number; dotPosition?: DotPosition; children?: React.ReactNode; + dots?: + | boolean + | { + className?: string; + }; } export default class Carousel extends React.Component { @@ -106,7 +112,13 @@ export default class Carousel extends React.Component { const dotsClass = 'slick-dots'; const dotPosition = this.getDotPosition(); props.vertical = dotPosition === 'left' || dotPosition === 'right'; - props.dotsClass = `${dotsClass} ${dotsClass}-${dotPosition || 'bottom'}`; + + const enableDots = props.dots === true || isPlainObject(props.dots); + const dsClass = classNames( + dotsClass, + `${dotsClass}-${dotPosition || 'bottom'}`, + typeof props.dots === 'boolean' ? false : props.dots?.className, + ); const className = classNames(prefixCls, { [`${prefixCls}-rtl`]: direction === 'rtl', @@ -115,7 +127,7 @@ export default class Carousel extends React.Component { return (
- +
); }; diff --git a/components/carousel/index.zh-CN.md b/components/carousel/index.zh-CN.md index 41fadcc516..b4e8c5cee1 100644 --- a/components/carousel/index.zh-CN.md +++ b/components/carousel/index.zh-CN.md @@ -21,7 +21,7 @@ subtitle: 走马灯 | autoplay | 是否自动切换 | boolean | false | | | | beforeChange | 切换面板的回调 | function(from, to) | 无 | | | | dotPosition | 面板指示点位置,可选 `top` `bottom` `left` `right` | string | bottom | | -| dots | 是否显示面板指示点 | boolean | true | | | +| dots | 是否显示面板指示点,如果为 `object` 则同时可以指定 `dotsClass` 或者 | boolean \| { className?:string } | true | | | | easing | 动画效果 | string | linear | | | | effect | 动画效果函数,可取 scrollx, fade | string | scrollx | | | diff --git a/components/config-provider/__tests__/__snapshots__/components.test.js.snap b/components/config-provider/__tests__/__snapshots__/components.test.js.snap index 41688ac055..b3fbb3fe0c 100644 --- a/components/config-provider/__tests__/__snapshots__/components.test.js.snap +++ b/components/config-provider/__tests__/__snapshots__/components.test.js.snap @@ -1255,9 +1255,7 @@ exports[`ConfigProvider components Calendar configProvider 1`] = ` - + - + - + - + - + - +
- + - + - + - + - + - +
- + - + - + - + - + - +
@@ -12150,16 +12109,23 @@ exports[`ConfigProvider components Table normal 1`] = `
@@ -12489,16 +12455,23 @@ exports[`ConfigProvider components Table prefixCls 1`] = ` diff --git a/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap b/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap index 40a611dac0..75ac1e1540 100644 --- a/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap +++ b/components/date-picker/__tests__/__snapshots__/DatePicker.test.js.snap @@ -146,9 +146,7 @@ Array [ - + - + - + - + - + - + - + - + - + - + - + - +
= Omit< | 'hideHeader' | 'components' > & { - locale?: typeof enUS; + locale?: PickerLocale; size?: SizeType; bordered?: boolean; }; +export type PickerLocale = { + lang: RcPickerLocale & AdditionalPickerLocaleLangProps; + timePickerLocale: TimePickerLocale; +} & AdditionalPickerLocaleProps; + +export type AdditionalPickerLocaleProps = { + dateFormat?: string; + dateTimeFormat?: string; + weekFormat?: string; + monthFormat?: string; +}; + +export type AdditionalPickerLocaleLangProps = { + placeholder: string; + yearPlaceholder?: string; + monthPlaceholder?: string; + weekPlaceholder?: string; + rangeYearPlaceholder?: [string, string]; + rangeMonthPlaceholder?: [string, string]; + rangeWeekPlaceholder?: [string, string]; + rangePlaceholder?: [string, string]; +}; + // Picker Props export type PickerBaseProps = InjectDefaultProps>; export type PickerDateProps = InjectDefaultProps>; @@ -140,12 +164,12 @@ function generatePicker(generateConfig: GenerateConfig) { }; result.lang = { ...result.lang, - ...((locale || {}) as any).lang, + ...((locale || {}) as PickerLocale).lang, }; return result; }; - renderPicker = (locale: any) => { + renderPicker = (locale: PickerLocale) => { const { getPrefixCls, direction } = this.context; const { prefixCls: customizePrefixCls, @@ -263,12 +287,12 @@ function generatePicker(generateConfig: GenerateConfig) { }; result.lang = { ...result.lang, - ...((locale || {}) as any).lang, + ...((locale || {}) as PickerLocale).lang, }; return result; }; - renderPicker = (locale: any) => { + renderPicker = (locale: PickerLocale) => { const { getPrefixCls, direction } = this.context; const { prefixCls: customizePrefixCls, diff --git a/components/date-picker/locale/ar_EG.tsx b/components/date-picker/locale/ar_EG.tsx index a947bd68b6..a35b9cd911 100644 --- a/components/date-picker/locale/ar_EG.tsx +++ b/components/date-picker/locale/ar_EG.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ar_EG'; import TimePickerLocale from '../../time-picker/locale/ar_EG'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'اختيار التاريخ', rangePlaceholder: ['البداية', 'النهاية'], diff --git a/components/date-picker/locale/az_AZ.tsx b/components/date-picker/locale/az_AZ.tsx index 28802065e4..c13c010b9d 100644 --- a/components/date-picker/locale/az_AZ.tsx +++ b/components/date-picker/locale/az_AZ.tsx @@ -1,7 +1,8 @@ import CalendarLocale from 'rc-picker/lib/locale/az_AZ'; import TimePickerLocale from '../../time-picker/locale/az_AZ'; +import { PickerLocale } from '../generatePicker'; -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Tarix seçin', rangePlaceholder: ['Başlama tarixi', 'Bitmə tarixi'], diff --git a/components/date-picker/locale/bg_BG.tsx b/components/date-picker/locale/bg_BG.tsx index f0990834b7..8c643c3dc4 100644 --- a/components/date-picker/locale/bg_BG.tsx +++ b/components/date-picker/locale/bg_BG.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/bg_BG'; import TimePickerLocale from '../../time-picker/locale/bg_BG'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Избор на дата', rangePlaceholder: ['Начална', 'Крайна'], diff --git a/components/date-picker/locale/ca_ES.tsx b/components/date-picker/locale/ca_ES.tsx index 612a65894b..960d04e9cf 100644 --- a/components/date-picker/locale/ca_ES.tsx +++ b/components/date-picker/locale/ca_ES.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ca_ES'; import TimePickerLocale from '../../time-picker/locale/ca_ES'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Seleccionar data', rangePlaceholder: ['Data inicial', 'Data final'], diff --git a/components/date-picker/locale/cs_CZ.tsx b/components/date-picker/locale/cs_CZ.tsx index 64443106b6..dde8598191 100644 --- a/components/date-picker/locale/cs_CZ.tsx +++ b/components/date-picker/locale/cs_CZ.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/cs_CZ'; import TimePickerLocale from '../../time-picker/locale/cs_CZ'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Vybrat datum', rangePlaceholder: ['Od', 'Do'], diff --git a/components/date-picker/locale/da_DK.tsx b/components/date-picker/locale/da_DK.tsx index 6e73975ff3..b59ff70e44 100644 --- a/components/date-picker/locale/da_DK.tsx +++ b/components/date-picker/locale/da_DK.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/da_DK'; import TimePickerLocale from '../../time-picker/locale/da_DK'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Vælg dato', rangePlaceholder: ['Startdato', 'Slutdato'], diff --git a/components/date-picker/locale/de_DE.tsx b/components/date-picker/locale/de_DE.tsx index ee5035339f..fc8e3ec819 100644 --- a/components/date-picker/locale/de_DE.tsx +++ b/components/date-picker/locale/de_DE.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/de_DE'; import TimePickerLocale from '../../time-picker/locale/de_DE'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Datum auswählen', rangePlaceholder: ['Startdatum', 'Enddatum'], diff --git a/components/date-picker/locale/el_GR.tsx b/components/date-picker/locale/el_GR.tsx index bad2eec615..4c12c628ae 100644 --- a/components/date-picker/locale/el_GR.tsx +++ b/components/date-picker/locale/el_GR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/el_GR'; import TimePickerLocale from '../../time-picker/locale/el_GR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Επιλέξτε ημερομηνία', rangePlaceholder: ['Αρχική ημερομηνία', 'Τελική ημερομηνία'], diff --git a/components/date-picker/locale/en_GB.tsx b/components/date-picker/locale/en_GB.tsx index 1cdde6c7c3..fc42b16c2a 100644 --- a/components/date-picker/locale/en_GB.tsx +++ b/components/date-picker/locale/en_GB.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/en_GB'; import TimePickerLocale from '../../time-picker/locale/en_GB'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Select date', rangePlaceholder: ['Start date', 'End date'], diff --git a/components/date-picker/locale/en_US.tsx b/components/date-picker/locale/en_US.tsx index 2212912759..c1d1548b37 100644 --- a/components/date-picker/locale/en_US.tsx +++ b/components/date-picker/locale/en_US.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/en_US'; import TimePickerLocale from '../../time-picker/locale/en_US'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Select date', yearPlaceholder: 'Select year', diff --git a/components/date-picker/locale/es_ES.tsx b/components/date-picker/locale/es_ES.tsx index 592df2cd97..10ebe04956 100644 --- a/components/date-picker/locale/es_ES.tsx +++ b/components/date-picker/locale/es_ES.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/es_ES'; import TimePickerLocale from '../../time-picker/locale/es_ES'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Seleccionar fecha', rangePlaceholder: ['Fecha inicial', 'Fecha final'], diff --git a/components/date-picker/locale/et_EE.tsx b/components/date-picker/locale/et_EE.tsx index d1e316cb22..3dd312bc63 100644 --- a/components/date-picker/locale/et_EE.tsx +++ b/components/date-picker/locale/et_EE.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/et_EE'; import TimePickerLocale from '../../time-picker/locale/et_EE'; +import { PickerLocale } from '../generatePicker'; // 统一合并为完整的 Locale -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Vali kuupäev', rangePlaceholder: ['Algus kuupäev', 'Lõpu kuupäev'], diff --git a/components/date-picker/locale/fa_IR.tsx b/components/date-picker/locale/fa_IR.tsx index bbe7035c67..743ce8d5e6 100644 --- a/components/date-picker/locale/fa_IR.tsx +++ b/components/date-picker/locale/fa_IR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/fa_IR'; import TimePickerLocale from '../../time-picker/locale/fa_IR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'انتخاب تاریخ', rangePlaceholder: ['تاریخ شروع', 'تاریخ پایان'], diff --git a/components/date-picker/locale/fi_FI.tsx b/components/date-picker/locale/fi_FI.tsx index ca58e1b26f..a6222f2b36 100644 --- a/components/date-picker/locale/fi_FI.tsx +++ b/components/date-picker/locale/fi_FI.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/fi_FI'; import TimePickerLocale from '../../time-picker/locale/fi_FI'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Valitse päivä', rangePlaceholder: ['Alku päivä', 'Loppu päivä'], diff --git a/components/date-picker/locale/fr_BE.tsx b/components/date-picker/locale/fr_BE.tsx index b4d91837e2..cf93ca94c3 100644 --- a/components/date-picker/locale/fr_BE.tsx +++ b/components/date-picker/locale/fr_BE.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/fr_BE'; import TimePickerLocale from '../../time-picker/locale/fr_BE'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Sélectionner une date', rangePlaceholder: ['Date de début', 'Date de fin'], diff --git a/components/date-picker/locale/fr_FR.tsx b/components/date-picker/locale/fr_FR.tsx index 099bbe2b09..5260701f38 100644 --- a/components/date-picker/locale/fr_FR.tsx +++ b/components/date-picker/locale/fr_FR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/fr_FR'; import TimePickerLocale from '../../time-picker/locale/fr_FR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Sélectionner une date', yearPlaceholder: 'Sélectionner une année', diff --git a/components/date-picker/locale/he_IL.tsx b/components/date-picker/locale/he_IL.tsx index 7cb4096c74..226543810e 100644 --- a/components/date-picker/locale/he_IL.tsx +++ b/components/date-picker/locale/he_IL.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/he_IL'; import TimePickerLocale from '../../time-picker/locale/he_IL'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'בחר תאריך', rangePlaceholder: ['תאריך התחלה', 'תאריך סיום'], diff --git a/components/date-picker/locale/hi_IN.tsx b/components/date-picker/locale/hi_IN.tsx index d475904b2c..f3d3ae5787 100644 --- a/components/date-picker/locale/hi_IN.tsx +++ b/components/date-picker/locale/hi_IN.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/hi_IN'; import TimePickerLocale from '../../time-picker/locale/hi_IN'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'तारीख़ चुनें', rangePlaceholder: ['प्रारंभ तिथि', 'समाप्ति तिथि'], diff --git a/components/date-picker/locale/hr_HR.tsx b/components/date-picker/locale/hr_HR.tsx index cfef8f3de1..8bcb85e573 100644 --- a/components/date-picker/locale/hr_HR.tsx +++ b/components/date-picker/locale/hr_HR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/hr_HR'; import TimePickerLocale from '../../time-picker/locale/hr_HR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Odaberite datum', rangePlaceholder: ['Početni datum', 'Završni datum'], diff --git a/components/date-picker/locale/hu_HU.tsx b/components/date-picker/locale/hu_HU.tsx index 640fcf2c28..4da113e958 100644 --- a/components/date-picker/locale/hu_HU.tsx +++ b/components/date-picker/locale/hu_HU.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/hu_HU'; import TimePickerLocale from '../../time-picker/locale/hu_HU'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Válasszon dátumot', rangePlaceholder: ['Kezdő dátum', 'Befejezés dátuma'], diff --git a/components/date-picker/locale/id_ID.tsx b/components/date-picker/locale/id_ID.tsx index 479061acdf..16dda1f964 100644 --- a/components/date-picker/locale/id_ID.tsx +++ b/components/date-picker/locale/id_ID.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/id_ID'; import TimePickerLocale from '../../time-picker/locale/id_ID'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Pilih tanggal', rangePlaceholder: ['Mulai tanggal', 'Tanggal akhir'], diff --git a/components/date-picker/locale/is_IS.tsx b/components/date-picker/locale/is_IS.tsx index 25656ddcee..3ae0e6369c 100644 --- a/components/date-picker/locale/is_IS.tsx +++ b/components/date-picker/locale/is_IS.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/is_IS'; import TimePickerLocale from '../../time-picker/locale/is_IS'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Veldu dag', rangePlaceholder: ['Upphafsdagur', 'Lokadagur'], diff --git a/components/date-picker/locale/it_IT.tsx b/components/date-picker/locale/it_IT.tsx index 14dd3e03c5..f93cb8855d 100644 --- a/components/date-picker/locale/it_IT.tsx +++ b/components/date-picker/locale/it_IT.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/it_IT'; import TimePickerLocale from '../../time-picker/locale/it_IT'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Selezionare la data', rangePlaceholder: ["Data d'inizio", 'Data di fine'], diff --git a/components/date-picker/locale/ja_JP.tsx b/components/date-picker/locale/ja_JP.tsx index 6412724372..05432d8bd9 100644 --- a/components/date-picker/locale/ja_JP.tsx +++ b/components/date-picker/locale/ja_JP.tsx @@ -1,7 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ja_JP'; import TimePickerLocale from '../../time-picker/locale/ja_JP'; +import { PickerLocale } from '../generatePicker'; -const locale = { +// Merge into a locale object +const locale: PickerLocale = { lang: { placeholder: '日付を選択', rangePlaceholder: ['開始日付', '終了日付'], diff --git a/components/date-picker/locale/kn_IN.tsx b/components/date-picker/locale/kn_IN.tsx index 9004f7a821..ba8f1c13e4 100644 --- a/components/date-picker/locale/kn_IN.tsx +++ b/components/date-picker/locale/kn_IN.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/kn_IN'; import TimePickerLocale from '../../time-picker/locale/kn_IN'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'ದಿನಾಂಕ ಆಯ್ಕೆಮಾಡಿ', rangePlaceholder: ['ಪ್ರಾರಂಭ ದಿನಾಂಕ', 'ಅಂತಿಮ ದಿನಾಂಕ'], diff --git a/components/date-picker/locale/ko_KR.tsx b/components/date-picker/locale/ko_KR.tsx index 54673517ea..8cc1bb6114 100644 --- a/components/date-picker/locale/ko_KR.tsx +++ b/components/date-picker/locale/ko_KR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ko_KR'; import TimePickerLocale from '../../time-picker/locale/ko_KR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: '날짜 선택', rangePlaceholder: ['시작일', '종료일'], diff --git a/components/date-picker/locale/ku_IQ.tsx b/components/date-picker/locale/ku_IQ.tsx index 363db69083..33cceb4ffb 100755 --- a/components/date-picker/locale/ku_IQ.tsx +++ b/components/date-picker/locale/ku_IQ.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ku_IQ'; import TimePickerLocale from '../../time-picker/locale/ku_IQ'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Dîrok hilbijêre', rangePlaceholder: ['Dîroka destpêkê', 'Dîroka dawîn'], diff --git a/components/date-picker/locale/lv_LV.tsx b/components/date-picker/locale/lv_LV.tsx index 4a857a685b..9577953223 100644 --- a/components/date-picker/locale/lv_LV.tsx +++ b/components/date-picker/locale/lv_LV.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/lv_LV'; import TimePickerLocale from '../../time-picker/locale/lv_LV'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Izvēlieties datumu', rangePlaceholder: ['Sākuma datums', 'Beigu datums'], diff --git a/components/date-picker/locale/mk_MK.tsx b/components/date-picker/locale/mk_MK.tsx index fcbe0a5f4f..3125e40b3c 100644 --- a/components/date-picker/locale/mk_MK.tsx +++ b/components/date-picker/locale/mk_MK.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/mk_MK'; import TimePickerLocale from '../../time-picker/locale/mk_MK'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Избери датум', rangePlaceholder: ['Од датум', 'До датум'], diff --git a/components/date-picker/locale/mn_MN.tsx b/components/date-picker/locale/mn_MN.tsx index 2ffad50acd..c858a94523 100644 --- a/components/date-picker/locale/mn_MN.tsx +++ b/components/date-picker/locale/mn_MN.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/mn_MN'; import TimePickerLocale from '../../time-picker/locale/mn_MN'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Огноо сонгох', rangePlaceholder: ['Эхлэх огноо', 'Дуусах огноо'], diff --git a/components/date-picker/locale/ms_MY.tsx b/components/date-picker/locale/ms_MY.tsx index 4818c62ba1..610028a603 100644 --- a/components/date-picker/locale/ms_MY.tsx +++ b/components/date-picker/locale/ms_MY.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ms_MY'; import TimePickerLocale from '../../time-picker/locale/ms_MY'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Pilih tarikh', rangePlaceholder: ['Tarikh mula', 'Tarikh akhir'], diff --git a/components/date-picker/locale/nb_NO.tsx b/components/date-picker/locale/nb_NO.tsx index 5b68d846a9..c948b1338e 100644 --- a/components/date-picker/locale/nb_NO.tsx +++ b/components/date-picker/locale/nb_NO.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/nb_NO'; import TimePickerLocale from '../../time-picker/locale/nb_NO'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Velg dato', rangePlaceholder: ['Startdato', 'Sluttdato'], diff --git a/components/date-picker/locale/nl_BE.tsx b/components/date-picker/locale/nl_BE.tsx index d82c1a5f86..dec9d9c59b 100644 --- a/components/date-picker/locale/nl_BE.tsx +++ b/components/date-picker/locale/nl_BE.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/nl_BE'; import TimePickerLocale from '../../time-picker/locale/nl_BE'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Selecteer datum', rangePlaceholder: ['Begin datum', 'Eind datum'], diff --git a/components/date-picker/locale/nl_NL.tsx b/components/date-picker/locale/nl_NL.tsx index d7c0474130..0826785cdc 100644 --- a/components/date-picker/locale/nl_NL.tsx +++ b/components/date-picker/locale/nl_NL.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/nl_NL'; import TimePickerLocale from '../../time-picker/locale/nl_NL'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Selecteer datum', rangePlaceholder: ['Begin datum', 'Eind datum'], diff --git a/components/date-picker/locale/pl_PL.tsx b/components/date-picker/locale/pl_PL.tsx index fdf52532d7..8f7ea29d5d 100644 --- a/components/date-picker/locale/pl_PL.tsx +++ b/components/date-picker/locale/pl_PL.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/pl_PL'; import TimePickerLocale from '../../time-picker/locale/pl_PL'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Wybierz datę', rangePlaceholder: ['Data początkowa', 'Data końcowa'], diff --git a/components/date-picker/locale/pt_BR.tsx b/components/date-picker/locale/pt_BR.tsx index 34f063767b..ba90503d56 100644 --- a/components/date-picker/locale/pt_BR.tsx +++ b/components/date-picker/locale/pt_BR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/pt_BR'; import TimePickerLocale from '../../time-picker/locale/pt_BR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Selecionar data', rangePlaceholder: ['Data inicial', 'Data final'], diff --git a/components/date-picker/locale/pt_PT.tsx b/components/date-picker/locale/pt_PT.tsx index 3fc96e4860..e7512bb0b2 100644 --- a/components/date-picker/locale/pt_PT.tsx +++ b/components/date-picker/locale/pt_PT.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/pt_PT'; import TimePickerLocale from '../../time-picker/locale/pt_PT'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { ...CalendarLocale, placeholder: 'Data', diff --git a/components/date-picker/locale/ro_RO.tsx b/components/date-picker/locale/ro_RO.tsx index 9af71f4105..6cacfea521 100644 --- a/components/date-picker/locale/ro_RO.tsx +++ b/components/date-picker/locale/ro_RO.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/ro_RO'; import TimePickerLocale from '../../time-picker/locale/ro_RO'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Selectează data', rangePlaceholder: ['Data start', 'Data sfârșit'], diff --git a/components/date-picker/locale/ru_RU.tsx b/components/date-picker/locale/ru_RU.tsx index 3ad9375e59..75bcce1f02 100644 --- a/components/date-picker/locale/ru_RU.tsx +++ b/components/date-picker/locale/ru_RU.tsx @@ -4,8 +4,10 @@ import CalendarLocale from 'rc-picker/lib/locale/ru_RU'; import TimePickerLocale from '../../time-picker/locale/ru_RU'; +import { PickerLocale } from '../generatePicker'; -const locale = { +// Merge into a locale object +const locale: PickerLocale = { lang: { placeholder: 'Выберите дату', rangePlaceholder: ['Начальная дата', 'Конечная дата'], diff --git a/components/date-picker/locale/sk_SK.tsx b/components/date-picker/locale/sk_SK.tsx index 443672ef0f..288245df9a 100644 --- a/components/date-picker/locale/sk_SK.tsx +++ b/components/date-picker/locale/sk_SK.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/sk_SK'; import TimePickerLocale from '../../time-picker/locale/sk_SK'; +import { PickerLocale } from '../generatePicker'; // 统一合并为完整的 Locale -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Vybrať dátum', rangePlaceholder: ['Od', 'Do'], diff --git a/components/date-picker/locale/sl_SI.tsx b/components/date-picker/locale/sl_SI.tsx index bdab516103..486cda83f8 100644 --- a/components/date-picker/locale/sl_SI.tsx +++ b/components/date-picker/locale/sl_SI.tsx @@ -1,7 +1,8 @@ import TimePickerLocale from '../../time-picker/locale/sl_SI'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { locale: 'sl', placeholder: 'Izberite datum', diff --git a/components/date-picker/locale/sr_RS.tsx b/components/date-picker/locale/sr_RS.tsx index 0c5906ed0e..d13c72e445 100644 --- a/components/date-picker/locale/sr_RS.tsx +++ b/components/date-picker/locale/sr_RS.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/sr_RS'; import TimePickerLocale from '../../time-picker/locale/sr_RS'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Izaberite datum', rangePlaceholder: ['Početni datum', 'Krajnji datum'], diff --git a/components/date-picker/locale/sv_SE.tsx b/components/date-picker/locale/sv_SE.tsx index 2415703e4a..6a3ef22463 100644 --- a/components/date-picker/locale/sv_SE.tsx +++ b/components/date-picker/locale/sv_SE.tsx @@ -1,7 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/sv_SE'; import TimePickerLocale from '../../time-picker/locale/sv_SE'; +import { PickerLocale } from '../generatePicker'; -const locale = { +// Merge into a locale object +const locale: PickerLocale = { lang: { placeholder: 'Välj datum', rangePlaceholder: ['Startdatum', 'Slutdatum'], diff --git a/components/date-picker/locale/ta_IN.tsx b/components/date-picker/locale/ta_IN.tsx index 50126ca6d6..d24a430c08 100644 --- a/components/date-picker/locale/ta_IN.tsx +++ b/components/date-picker/locale/ta_IN.tsx @@ -1,9 +1,10 @@ // Tamil Locale added to rc-calendar import CalendarLocale from 'rc-picker/lib/locale/ta_IN'; import TimePickerLocale from '../../time-picker/locale/ta_IN'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'தேதியைத் தேர்ந்தெடுக்கவும்', rangePlaceholder: ['தொடக்க தேதி', 'கடைசி தேதி'], diff --git a/components/date-picker/locale/th_TH.tsx b/components/date-picker/locale/th_TH.tsx index 52b15438e4..a4f1601474 100644 --- a/components/date-picker/locale/th_TH.tsx +++ b/components/date-picker/locale/th_TH.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/th_TH'; import TimePickerLocale from '../../time-picker/locale/th_TH'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'เลือกวันที่', rangePlaceholder: ['วันเริ่มต้น', 'วันสิ้นสุด'], diff --git a/components/date-picker/locale/tr_TR.tsx b/components/date-picker/locale/tr_TR.tsx index 3a2514752f..f15d8f7925 100644 --- a/components/date-picker/locale/tr_TR.tsx +++ b/components/date-picker/locale/tr_TR.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/tr_TR'; import TimePickerLocale from '../../time-picker/locale/tr_TR'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Tarih Seç', rangePlaceholder: ['Başlangıç Tarihi', 'Bitiş Tarihi'], diff --git a/components/date-picker/locale/uk_UA.tsx b/components/date-picker/locale/uk_UA.tsx index 237df43d4d..463b13fdf6 100644 --- a/components/date-picker/locale/uk_UA.tsx +++ b/components/date-picker/locale/uk_UA.tsx @@ -1,7 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/uk_UA'; import TimePickerLocale from '../../time-picker/locale/uk_UA'; +import { PickerLocale } from '../generatePicker'; -const locale = { +// Merge into a locale object +const locale: PickerLocale = { lang: { placeholder: 'Оберіть дату', rangePlaceholder: ['Початкова дата', 'Кінцева дата'], diff --git a/components/date-picker/locale/vi_VN.tsx b/components/date-picker/locale/vi_VN.tsx index 0f43e8bfea..358707589e 100644 --- a/components/date-picker/locale/vi_VN.tsx +++ b/components/date-picker/locale/vi_VN.tsx @@ -1,8 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/vi_VN'; import TimePickerLocale from '../../time-picker/locale/vi_VN'; +import { PickerLocale } from '../generatePicker'; // Merge into a locale object -const locale = { +const locale: PickerLocale = { lang: { placeholder: 'Chọn thời điểm', rangePlaceholder: ['Ngày bắt đầu', 'Ngày kết thúc'], diff --git a/components/date-picker/locale/zh_CN.tsx b/components/date-picker/locale/zh_CN.tsx index 13c4d6dc98..de6d6ca3d2 100644 --- a/components/date-picker/locale/zh_CN.tsx +++ b/components/date-picker/locale/zh_CN.tsx @@ -1,7 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/zh_CN'; import TimePickerLocale from '../../time-picker/locale/zh_CN'; +import { PickerLocale } from '../generatePicker'; -const locale = { +// 统一合并为完整的 Locale +const locale: PickerLocale = { lang: { placeholder: '请选择日期', yearPlaceholder: '请选择年份', diff --git a/components/date-picker/locale/zh_TW.tsx b/components/date-picker/locale/zh_TW.tsx index 6dffc873b5..5598db9ba6 100644 --- a/components/date-picker/locale/zh_TW.tsx +++ b/components/date-picker/locale/zh_TW.tsx @@ -1,7 +1,9 @@ import CalendarLocale from 'rc-picker/lib/locale/zh_TW'; import TimePickerLocale from '../../time-picker/locale/zh_TW'; +import { PickerLocale } from '../generatePicker'; -const locale = { +// 统一合并为完整的 Locale +const locale: PickerLocale = { lang: { placeholder: '請選擇日期', rangePlaceholder: ['開始日期', '結束日期'], diff --git a/components/date-picker/util.ts b/components/date-picker/util.ts index d5f05e22cd..74b4d0d0ea 100644 --- a/components/date-picker/util.ts +++ b/components/date-picker/util.ts @@ -1,6 +1,7 @@ import { PickerMode } from 'rc-picker/lib/interface'; +import { PickerLocale } from './generatePicker'; -export function getPlaceholder(picker: PickerMode | undefined, locale: any): string { +export function getPlaceholder(picker: PickerMode | undefined, locale: PickerLocale): string { if (picker === 'year' && locale.lang.yearPlaceholder) { return locale.lang.yearPlaceholder; } @@ -16,7 +17,7 @@ export function getPlaceholder(picker: PickerMode | undefined, locale: any): str return locale.lang.placeholder; } -export function getRangePlaceholder(picker: PickerMode | undefined, locale: any): [string, string] { +export function getRangePlaceholder(picker: PickerMode | undefined, locale: PickerLocale) { if (picker === 'year' && locale.lang.yearPlaceholder) { return locale.lang.rangeYearPlaceholder; } diff --git a/components/form/FormItem.tsx b/components/form/FormItem.tsx index e5a210981f..cdb6e5dd32 100644 --- a/components/form/FormItem.tsx +++ b/components/form/FormItem.tsx @@ -77,6 +77,7 @@ function FormItem(props: FormItemProps): React.ReactElement { validateStatus, children, required, + label, trigger = 'onChange', validateTrigger = 'onChange', ...restProps @@ -235,9 +236,15 @@ function FormItem(props: FormItemProps): React.ReactElement { return renderLayout(children); } + const variables: Record = {}; + if (typeof label === 'string') { + variables.label = label; + } + return ( { diff --git a/components/form/__tests__/index.test.js b/components/form/__tests__/index.test.js index a34ca18087..a4aa0656b9 100644 --- a/components/form/__tests__/index.test.js +++ b/components/form/__tests__/index.test.js @@ -596,6 +596,28 @@ describe('Form', () => { expect(errorSpy).not.toHaveBeenCalled(); }); + it('`label` support template', async () => { + const wrapper = mount( + // eslint-disable-next-line no-template-curly-in-string +
+ + + +
, + ); + + wrapper.find('form').simulate('submit'); + await delay(50); + wrapper.update(); + + expect( + wrapper + .find('.ant-form-item-explain') + .first() + .text(), + ).toEqual('Bamboo is good!'); + }); + it('return same form instance', () => { const instances = new Set(); diff --git a/components/form/demo/nest-messages.md b/components/form/demo/nest-messages.md index d5811614bd..9d00d3040c 100644 --- a/components/form/demo/nest-messages.md +++ b/components/form/demo/nest-messages.md @@ -22,13 +22,13 @@ const layout = { }; const validateMessages = { - required: 'This field is required!', + required: '${label} is required!', types: { - email: 'Not a validate email!', - number: 'Not a validate number!', + email: '${label} is not validate email!', + number: '${label} is not a validate number!', }, number: { - range: 'Must be between ${min} and ${max}', + range: '${label} must be between ${min} and ${max}', }, }; diff --git a/components/grid/__tests__/__snapshots__/demo.test.js.snap b/components/grid/__tests__/__snapshots__/demo.test.js.snap index becab8b678..cdc8ad388c 100644 --- a/components/grid/__tests__/__snapshots__/demo.test.js.snap +++ b/components/grid/__tests__/__snapshots__/demo.test.js.snap @@ -1226,3 +1226,15 @@ exports[`renders ./components/grid/demo/sort.md correctly 1`] = `
`; + +exports[`renders ./components/grid/demo/useBreakpoint.md correctly 1`] = ` +
+
+ Current break point:  +
+
+`; diff --git a/components/grid/__tests__/index.test.js b/components/grid/__tests__/index.test.js index ca4a4d35e2..40104c4714 100644 --- a/components/grid/__tests__/index.test.js +++ b/components/grid/__tests__/index.test.js @@ -3,6 +3,7 @@ import { render, mount } from 'enzyme'; import { Col, Row } from '..'; import mountTest from '../../../tests/shared/mountTest'; import rtlTest from '../../../tests/shared/rtlTest'; +import useBreakpoint from '../hooks/useBreakpoint'; describe('Grid', () => { mountTest(Row); @@ -90,4 +91,26 @@ describe('Grid', () => { marginBottom: 10, }); }); + + // By jsdom mock, actual jsdom not implemented matchMedia + // https://jestjs.io/docs/en/manual-mocks#mocking-methods-which-are-not-implemented-in-jsdom + it('should work with useBreakpoint', () => { + function Demo() { + const screens = useBreakpoint(); + + return JSON.stringify(screens); + } + const wrapper = mount(); + + expect(wrapper.text()).toEqual( + JSON.stringify({ + xs: true, + sm: false, + md: false, + lg: false, + xl: false, + xxl: false, + }), + ); + }); }); diff --git a/components/grid/demo/useBreakpoint.md b/components/grid/demo/useBreakpoint.md new file mode 100644 index 0000000000..13a7eb9429 --- /dev/null +++ b/components/grid/demo/useBreakpoint.md @@ -0,0 +1,36 @@ +--- +order: 10 +title: useBreakpoint Hook +--- + +## zh-CN + +使用 `useBreakpoint` Hook 个性化布局。 + +## en-US + +Use `useBreakpoint` Hook povide personalized layout. + +```jsx +import { Row, Col, Grid } from 'antd'; + +const { useBreakpoint } = Grid; + +function UseBreakpointDemo() { + const screens = useBreakpoint(); + + return ( + + + Current break point:  + {Object.entries(screens) + .filter(screen => !!screen[1]) + .map(screen => screen[0]) + .join(' ')} + + + ); +} + +ReactDOM.render(, mountNode); +``` diff --git a/components/grid/hooks/useBreakpoint.tsx b/components/grid/hooks/useBreakpoint.tsx new file mode 100644 index 0000000000..ec34395904 --- /dev/null +++ b/components/grid/hooks/useBreakpoint.tsx @@ -0,0 +1,18 @@ +import { useEffect, useState } from 'react'; +import ResponsiveObserve, { ScreenMap } from '../../_util/responsiveObserve'; + +function useBreakpoint(): ScreenMap { + const [screens, setScreens] = useState({}); + + useEffect(() => { + const token = ResponsiveObserve.subscribe(supportScreens => { + setScreens(supportScreens); + }); + + return () => ResponsiveObserve.unsubscribe(token); + }, []); + + return screens; +} + +export default useBreakpoint; diff --git a/components/grid/index.tsx b/components/grid/index.tsx index 147cf95e4c..f2c4e59c74 100644 --- a/components/grid/index.tsx +++ b/components/grid/index.tsx @@ -1,7 +1,10 @@ import Row from './row'; import Col from './col'; +import useBreakpoint from './hooks/useBreakpoint'; export { RowProps } from './row'; export { ColProps, ColSize } from './col'; export { Row, Col }; + +export default { useBreakpoint }; diff --git a/components/index.tsx b/components/index.tsx index 02c20f7267..5efc49010b 100644 --- a/components/index.tsx +++ b/components/index.tsx @@ -66,6 +66,8 @@ export { default as Empty } from './empty'; export { default as Form } from './form'; +export { default as Grid } from './grid'; + export { default as Input } from './input'; export { default as InputNumber } from './input-number'; diff --git a/components/list/__tests__/__snapshots__/pagination.test.js.snap b/components/list/__tests__/__snapshots__/pagination.test.js.snap index 50be4f19ab..3ede0e97d6 100644 --- a/components/list/__tests__/__snapshots__/pagination.test.js.snap +++ b/components/list/__tests__/__snapshots__/pagination.test.js.snap @@ -372,7 +372,7 @@ exports[`List.pagination should change page size work 2`] = `
- + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + تأكيد + +
@@ -5921,9 +5847,7 @@ exports[`Locale Provider should display the text as ar 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Bəli + +
@@ -11009,9 +10885,7 @@ exports[`Locale Provider should display the text as az 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Добре + +
@@ -16097,9 +15923,7 @@ exports[`Locale Provider should display the text as bg 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -21185,9 +20961,7 @@ exports[`Locale Provider should display the text as ca 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Ok + +
@@ -26273,9 +25999,7 @@ exports[`Locale Provider should display the text as cs 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -31361,9 +31037,7 @@ exports[`Locale Provider should display the text as da 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -36449,9 +36075,7 @@ exports[`Locale Provider should display the text as de 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + ΟΚ + +
@@ -41537,9 +41113,7 @@ exports[`Locale Provider should display the text as el 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -46625,9 +46151,7 @@ exports[`Locale Provider should display the text as en 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -51713,9 +51189,7 @@ exports[`Locale Provider should display the text as en-gb 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Aceptar + +
@@ -56801,9 +56227,7 @@ exports[`Locale Provider should display the text as es 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -61889,9 +61265,7 @@ exports[`Locale Provider should display the text as et 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + تایید + +
@@ -66977,9 +66303,7 @@ exports[`Locale Provider should display the text as fa 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -72065,9 +71341,7 @@ exports[`Locale Provider should display the text as fi 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -77153,9 +76379,7 @@ exports[`Locale Provider should display the text as fr 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -82241,9 +81417,7 @@ exports[`Locale Provider should display the text as fr 2`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + אישור + +
@@ -87329,9 +86455,7 @@ exports[`Locale Provider should display the text as he 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + अच्छी तरह से + +
@@ -92417,9 +91493,7 @@ exports[`Locale Provider should display the text as hi 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -97505,9 +96531,7 @@ exports[`Locale Provider should display the text as hr 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Alkalmazás + +
@@ -102593,9 +101569,7 @@ exports[`Locale Provider should display the text as hu 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Հաստատել + +
@@ -107681,9 +106607,7 @@ exports[`Locale Provider should display the text as hy-am 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -112769,9 +111645,7 @@ exports[`Locale Provider should display the text as id 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Áfram + +
@@ -117857,9 +116683,7 @@ exports[`Locale Provider should display the text as is 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -122945,9 +121721,7 @@ exports[`Locale Provider should display the text as it 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -128033,9 +126759,7 @@ exports[`Locale Provider should display the text as ja 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + ಸರಿ + +
@@ -133121,9 +131797,7 @@ exports[`Locale Provider should display the text as kn 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + 확인 + +
@@ -138209,9 +136835,7 @@ exports[`Locale Provider should display the text as ko 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Temam + +
@@ -143297,9 +141873,7 @@ exports[`Locale Provider should display the text as ku-iq 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -148385,9 +146911,7 @@ exports[`Locale Provider should display the text as lv 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + ОК + +
@@ -153473,9 +151949,7 @@ exports[`Locale Provider should display the text as mk 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -158561,9 +156987,7 @@ exports[`Locale Provider should display the text as mn-mn 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -163649,9 +162025,7 @@ exports[`Locale Provider should display the text as ms-my 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -168737,9 +167063,7 @@ exports[`Locale Provider should display the text as nb 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + हो + +
@@ -173825,9 +172101,7 @@ exports[`Locale Provider should display the text as ne-np 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -178913,9 +177139,7 @@ exports[`Locale Provider should display the text as nl 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -184001,9 +182177,7 @@ exports[`Locale Provider should display the text as nl-be 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -189089,9 +187215,7 @@ exports[`Locale Provider should display the text as pl 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -194177,9 +192253,7 @@ exports[`Locale Provider should display the text as pt 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -199265,9 +197291,7 @@ exports[`Locale Provider should display the text as pt-br 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -204353,9 +202329,7 @@ exports[`Locale Provider should display the text as ro 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -209441,9 +207367,7 @@ exports[`Locale Provider should display the text as ru 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -214529,9 +212405,7 @@ exports[`Locale Provider should display the text as sk 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + v redu + +
@@ -219617,9 +217443,7 @@ exports[`Locale Provider should display the text as sl 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + U redu + +
@@ -224705,9 +222481,7 @@ exports[`Locale Provider should display the text as sr 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -229793,9 +227519,7 @@ exports[`Locale Provider should display the text as sv 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + சரி + +
@@ -234881,9 +232557,7 @@ exports[`Locale Provider should display the text as ta 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + ตกลง + +
@@ -239969,9 +237595,7 @@ exports[`Locale Provider should display the text as th 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Tamam + +
@@ -245057,9 +242633,7 @@ exports[`Locale Provider should display the text as tr 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + Гаразд + +
@@ -250145,9 +247671,7 @@ exports[`Locale Provider should display the text as uk 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + OK + +
@@ -255233,9 +252709,7 @@ exports[`Locale Provider should display the text as vi 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + 确 定 + +
@@ -260321,9 +257747,7 @@ exports[`Locale Provider should display the text as zh-cn 1`] = ` - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + - + -
+
- +
+
-
+ - -
+ + 確 定 + +
@@ -265409,9 +262785,7 @@ exports[`Locale Provider should display the text as zh-tw 1`] = ` - + - + - + - + - + - + ; Select?: Object; - Upload?: Object; + Upload?: UploadLocale; + Empty?: TransferLocaleForEmpty; + global?: Object; + PageHeader?: Object; + Icon?: Object; + Text?: Object; } export interface LocaleProviderProps { diff --git a/components/locale/ar_EG.tsx b/components/locale/ar_EG.tsx index f120351427..4a5b616d58 100644 --- a/components/locale/ar_EG.tsx +++ b/components/locale/ar_EG.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ar_EG'; import DatePicker from '../date-picker/locale/ar_EG'; import TimePicker from '../time-picker/locale/ar_EG'; import Calendar from '../calendar/locale/ar_EG'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ar', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'لا توجد بيانات', }, }; + +export default localeValues; diff --git a/components/locale/az_AZ.tsx b/components/locale/az_AZ.tsx index 7789aebe87..b3814f950a 100644 --- a/components/locale/az_AZ.tsx +++ b/components/locale/az_AZ.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/az_AZ'; import DatePicker from '../date-picker/locale/az_AZ'; import TimePicker from '../time-picker/locale/az_AZ'; import Calendar from '../calendar/locale/az_AZ'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'az', Pagination, DatePicker, @@ -43,3 +44,5 @@ export default { previewFile: 'Fayla önbaxış', }, }; + +export default localeValues; diff --git a/components/locale/bg_BG.tsx b/components/locale/bg_BG.tsx index 564d7ca8cc..4af665362b 100644 --- a/components/locale/bg_BG.tsx +++ b/components/locale/bg_BG.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/bg_BG'; import DatePicker from '../date-picker/locale/bg_BG'; import TimePicker from '../time-picker/locale/bg_BG'; import Calendar from '../calendar/locale/bg_BG'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'bg', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Няма данни', }, }; + +export default localeValues; diff --git a/components/locale/ca_ES.tsx b/components/locale/ca_ES.tsx index 0736b62d39..92ecc07bc2 100644 --- a/components/locale/ca_ES.tsx +++ b/components/locale/ca_ES.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ca_ES'; import DatePicker from '../date-picker/locale/ca_ES'; import TimePicker from '../time-picker/locale/ca_ES'; import Calendar from '../calendar/locale/ca_ES'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ca', Pagination, DatePicker, @@ -39,3 +40,5 @@ export default { description: 'Sense dades', }, }; + +export default localeValues; diff --git a/components/locale/cs_CZ.tsx b/components/locale/cs_CZ.tsx index 5bc1dcc34e..387ac1c431 100644 --- a/components/locale/cs_CZ.tsx +++ b/components/locale/cs_CZ.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/cs_CZ'; import DatePicker from '../date-picker/locale/cs_CZ'; import TimePicker from '../time-picker/locale/cs_CZ'; import Calendar from '../calendar/locale/cs_CZ'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'cs', Pagination, DatePicker, @@ -39,3 +40,5 @@ export default { description: 'Žádná data', }, }; + +export default localeValues; diff --git a/components/locale/da_DK.tsx b/components/locale/da_DK.tsx index 2c9c032a73..e02f8ed77f 100644 --- a/components/locale/da_DK.tsx +++ b/components/locale/da_DK.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/da_DK'; import DatePicker from '../date-picker/locale/da_DK'; import TimePicker from '../time-picker/locale/da_DK'; import Calendar from '../calendar/locale/da_DK'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'da', DatePicker, TimePicker, @@ -41,3 +42,5 @@ export default { description: 'Ingen data', }, }; + +export default localeValues; diff --git a/components/locale/de_DE.tsx b/components/locale/de_DE.tsx index 28f0e7c197..68e089646d 100644 --- a/components/locale/de_DE.tsx +++ b/components/locale/de_DE.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/de_DE'; import DatePicker from '../date-picker/locale/de_DE'; import TimePicker from '../time-picker/locale/de_DE'; import Calendar from '../calendar/locale/de_DE'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'de', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Keine Daten', }, }; + +export default localeValues; diff --git a/components/locale/default.tsx b/components/locale/default.tsx index a84887e95d..7e74a851e3 100644 --- a/components/locale/default.tsx +++ b/components/locale/default.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/en_US'; import DatePicker from '../date-picker/locale/en_US'; import TimePicker from '../time-picker/locale/en_US'; import Calendar from '../calendar/locale/en_US'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'en', Pagination, DatePicker, @@ -22,6 +23,9 @@ export default { sortTitle: 'Sort', expand: 'Expand row', collapse: 'Collapse row', + triggerDesc: 'Click sort by descend', + triggerAsc: 'Click sort by ascend', + cancelSort: 'Click to cancel sort', }, Modal: { okText: 'OK', @@ -61,3 +65,5 @@ export default { back: 'Back', }, }; + +export default localeValues; diff --git a/components/locale/el_GR.tsx b/components/locale/el_GR.tsx index 151deef612..e8ab5342c0 100644 --- a/components/locale/el_GR.tsx +++ b/components/locale/el_GR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/el_GR'; import DatePicker from '../date-picker/locale/el_GR'; import TimePicker from '../time-picker/locale/el_GR'; import Calendar from '../calendar/locale/el_GR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'el', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Δεν υπάρχουν δεδομένα', }, }; + +export default localeValues; diff --git a/components/locale/en_GB.tsx b/components/locale/en_GB.tsx index 11ed1c3a88..bb4347eef8 100644 --- a/components/locale/en_GB.tsx +++ b/components/locale/en_GB.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/en_GB'; import DatePicker from '../date-picker/locale/en_GB'; import TimePicker from '../time-picker/locale/en_GB'; import Calendar from '../calendar/locale/en_GB'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'en-gb', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'No data', }, }; + +export default localeValues; diff --git a/components/locale/es_ES.tsx b/components/locale/es_ES.tsx index 32defe7d8b..137aa63aed 100644 --- a/components/locale/es_ES.tsx +++ b/components/locale/es_ES.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/es_ES'; import DatePicker from '../date-picker/locale/es_ES'; import TimePicker from '../time-picker/locale/es_ES'; import Calendar from '../calendar/locale/es_ES'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'es', Pagination, DatePicker, @@ -57,3 +58,5 @@ export default { back: 'volver', }, }; + +export default localeValues; diff --git a/components/locale/et_EE.tsx b/components/locale/et_EE.tsx index 2c68d47559..79213a5983 100644 --- a/components/locale/et_EE.tsx +++ b/components/locale/et_EE.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/et_EE'; import DatePicker from '../date-picker/locale/et_EE'; import TimePicker from '../time-picker/locale/et_EE'; import Calendar from '../calendar/locale/et_EE'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'et', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Andmed puuduvad', }, }; + +export default localeValues; diff --git a/components/locale/fa_IR.tsx b/components/locale/fa_IR.tsx index 5c65c481c2..f83df13059 100644 --- a/components/locale/fa_IR.tsx +++ b/components/locale/fa_IR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/fa_IR'; import DatePicker from '../date-picker/locale/fa_IR'; import TimePicker from '../time-picker/locale/fa_IR'; import Calendar from '../calendar/locale/fa_IR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'fa', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'داده‌ای موجود نیست', }, }; + +export default localeValues; diff --git a/components/locale/fi_FI.tsx b/components/locale/fi_FI.tsx index 746a93ab72..454f94483e 100644 --- a/components/locale/fi_FI.tsx +++ b/components/locale/fi_FI.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/fi_FI'; import DatePicker from '../date-picker/locale/fi_FI'; import TimePicker from '../time-picker/locale/fi_FI'; import Calendar from '../calendar/locale/fi_FI'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'fi', Pagination, DatePicker, @@ -42,3 +43,5 @@ export default { description: 'Ei kohteita', }, }; + +export default localeValues; diff --git a/components/locale/fr_BE.tsx b/components/locale/fr_BE.tsx index 73cb69c84c..e9873663b9 100644 --- a/components/locale/fr_BE.tsx +++ b/components/locale/fr_BE.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/fr_BE'; import DatePicker from '../date-picker/locale/fr_BE'; import TimePicker from '../time-picker/locale/fr_BE'; import Calendar from '../calendar/locale/fr_BE'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'fr', Pagination, DatePicker, @@ -45,3 +46,5 @@ export default { expand: 'développer', }, }; + +export default localeValues; diff --git a/components/locale/fr_FR.tsx b/components/locale/fr_FR.tsx index e733e370b3..c427a1a016 100644 --- a/components/locale/fr_FR.tsx +++ b/components/locale/fr_FR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/fr_FR'; import DatePicker from '../date-picker/locale/fr_FR'; import TimePicker from '../time-picker/locale/fr_FR'; import Calendar from '../calendar/locale/fr_FR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'fr', Pagination, DatePicker, @@ -45,3 +46,5 @@ export default { expand: 'développer', }, }; + +export default localeValues; diff --git a/components/locale/he_IL.tsx b/components/locale/he_IL.tsx index 41240b0048..719b013b3a 100644 --- a/components/locale/he_IL.tsx +++ b/components/locale/he_IL.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/he_IL'; import DatePicker from '../date-picker/locale/he_IL'; import TimePicker from '../time-picker/locale/he_IL'; import Calendar from '../calendar/locale/he_IL'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'he', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'אין מידע', }, }; + +export default localeValues; diff --git a/components/locale/hi_IN.tsx b/components/locale/hi_IN.tsx index 3917d44210..a6bc68cff3 100644 --- a/components/locale/hi_IN.tsx +++ b/components/locale/hi_IN.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/hi_IN'; import DatePicker from '../date-picker/locale/hi_IN'; import TimePicker from '../time-picker/locale/hi_IN'; import Calendar from '../calendar/locale/hi_IN'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'hi', Pagination, DatePicker, @@ -49,3 +50,5 @@ export default { downloadFile: 'फ़ाइल डाउनलोड करें', }, }; + +export default localeValues; diff --git a/components/locale/hr_HR.tsx b/components/locale/hr_HR.tsx index 325e5e5a17..3d132e785d 100644 --- a/components/locale/hr_HR.tsx +++ b/components/locale/hr_HR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/hr_HR'; import DatePicker from '../date-picker/locale/hr_HR'; import TimePicker from '../time-picker/locale/hr_HR'; import Calendar from '../calendar/locale/hr_HR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'hr', Pagination, DatePicker, @@ -55,3 +56,5 @@ export default { expand: 'proširi', }, }; + +export default localeValues; diff --git a/components/locale/hu_HU.tsx b/components/locale/hu_HU.tsx index c062f11afd..ff3cebb5cf 100644 --- a/components/locale/hu_HU.tsx +++ b/components/locale/hu_HU.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/hu_HU'; import DatePicker from '../date-picker/locale/hu_HU'; import TimePicker from '../time-picker/locale/hu_HU'; import Calendar from '../calendar/locale/hu_HU'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'hu', Pagination, DatePicker, @@ -42,3 +43,5 @@ export default { description: 'Nincs adat', }, }; + +export default localeValues; diff --git a/components/locale/hy_AM.tsx b/components/locale/hy_AM.tsx index aaf6a813d2..92a2a96bef 100644 --- a/components/locale/hy_AM.tsx +++ b/components/locale/hy_AM.tsx @@ -1,4 +1,7 @@ -const datePickerLocale = { +import { Locale } from '../locale-provider'; +import { PickerLocale } from '../date-picker/generatePicker'; + +const datePickerLocale: PickerLocale = { lang: { locale: 'hy-am', placeholder: 'Ընտրեք ամսաթիվը', @@ -35,7 +38,7 @@ const datePickerLocale = { }, }; -export default { +const localeValues: Locale = { locale: 'hy-am', Pagination: { // Options.jsx @@ -108,3 +111,5 @@ export default { back: 'Հետ', }, }; + +export default localeValues; diff --git a/components/locale/id_ID.tsx b/components/locale/id_ID.tsx index 7119871db9..7123121aca 100644 --- a/components/locale/id_ID.tsx +++ b/components/locale/id_ID.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/id_ID'; import DatePicker from '../date-picker/locale/id_ID'; import TimePicker from '../time-picker/locale/id_ID'; import Calendar from '../calendar/locale/id_ID'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'id', Pagination, DatePicker, @@ -43,3 +44,5 @@ export default { description: 'Tidak ada data', }, }; + +export default localeValues; diff --git a/components/locale/is_IS.tsx b/components/locale/is_IS.tsx index 216d936b67..562e98a1ee 100644 --- a/components/locale/is_IS.tsx +++ b/components/locale/is_IS.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/is_IS'; import DatePicker from '../date-picker/locale/is_IS'; import TimePicker from '../time-picker/locale/is_IS'; import Calendar from '../calendar/locale/is_IS'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'is', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Engin gögn', }, }; + +export default localeValues; diff --git a/components/locale/it_IT.tsx b/components/locale/it_IT.tsx index f43b3d601d..8a168644e4 100644 --- a/components/locale/it_IT.tsx +++ b/components/locale/it_IT.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/it_IT'; import DatePicker from '../date-picker/locale/it_IT'; import TimePicker from '../time-picker/locale/it_IT'; import Calendar from '../calendar/locale/it_IT'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'it', Pagination, DatePicker, @@ -54,3 +55,5 @@ export default { expand: 'espandi', }, }; + +export default localeValues; diff --git a/components/locale/ja_JP.tsx b/components/locale/ja_JP.tsx index b171e5804f..2b657c8870 100644 --- a/components/locale/ja_JP.tsx +++ b/components/locale/ja_JP.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ja_JP'; import DatePicker from '../date-picker/locale/ja_JP'; import TimePicker from '../time-picker/locale/ja_JP'; import Calendar from '../calendar/locale/ja_JP'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ja', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'データがありません', }, }; + +export default localeValues; diff --git a/components/locale/kn_IN.tsx b/components/locale/kn_IN.tsx index 6a93c23579..2b5bfffe62 100644 --- a/components/locale/kn_IN.tsx +++ b/components/locale/kn_IN.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/kn_IN'; import DatePicker from '../date-picker/locale/kn_IN'; import TimePicker from '../time-picker/locale/kn_IN'; import Calendar from '../calendar/locale/kn_IN'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'kn', Pagination, DatePicker, @@ -49,3 +50,5 @@ export default { downloadFile: 'ಫೈಲ್ ಡೌನ್‌ಲೋಡ್ ಮಾಡಿ', }, }; + +export default localeValues; diff --git a/components/locale/ko_KR.tsx b/components/locale/ko_KR.tsx index 81025be41b..7542b80262 100644 --- a/components/locale/ko_KR.tsx +++ b/components/locale/ko_KR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ko_KR'; import DatePicker from '../date-picker/locale/ko_KR'; import TimePicker from '../time-picker/locale/ko_KR'; import Calendar from '../calendar/locale/ko_KR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ko', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: '데이터 없음', }, }; + +export default localeValues; diff --git a/components/locale/ku_IQ.tsx b/components/locale/ku_IQ.tsx index ca3ffa1235..2b5aef037a 100755 --- a/components/locale/ku_IQ.tsx +++ b/components/locale/ku_IQ.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ku_IQ'; import DatePicker from '../date-picker/locale/ku_IQ'; import TimePicker from '../time-picker/locale/ku_IQ'; import Calendar from '../calendar/locale/ku_IQ'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ku-iq', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Agahî tune', }, }; + +export default localeValues; diff --git a/components/locale/lv_LV.tsx b/components/locale/lv_LV.tsx index 95c2b248bd..66098633c3 100644 --- a/components/locale/lv_LV.tsx +++ b/components/locale/lv_LV.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/lv_LV'; import DatePicker from '../date-picker/locale/lv_LV'; import TimePicker from '../time-picker/locale/lv_LV'; import Calendar from '../calendar/locale/lv_LV'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'lv', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Nav datu', }, }; + +export default localeValues; diff --git a/components/locale/mk_MK.tsx b/components/locale/mk_MK.tsx index 9abad39ea5..cd4c22c725 100644 --- a/components/locale/mk_MK.tsx +++ b/components/locale/mk_MK.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/mk_MK'; import DatePicker from '../date-picker/locale/mk_MK'; import TimePicker from '../time-picker/locale/mk_MK'; import Calendar from '../calendar/locale/mk_MK'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'mk', Pagination, DatePicker, @@ -56,3 +57,5 @@ export default { back: 'Назад', }, }; + +export default localeValues; diff --git a/components/locale/mn_MN.tsx b/components/locale/mn_MN.tsx index 14eca0386f..e879c79fbe 100644 --- a/components/locale/mn_MN.tsx +++ b/components/locale/mn_MN.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/mn_MN'; import DatePicker from '../date-picker/locale/mn_MN'; import TimePicker from '../time-picker/locale/mn_MN'; import Calendar from '../calendar/locale/mn_MN'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'mn-mn', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Мэдээлэл байхгүй байна', }, }; + +export default localeValues; diff --git a/components/locale/ms_MY.tsx b/components/locale/ms_MY.tsx index 84f6c60c12..6285d0c682 100644 --- a/components/locale/ms_MY.tsx +++ b/components/locale/ms_MY.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ms_MY'; import DatePicker from '../date-picker/locale/ms_MY'; import TimePicker from '../time-picker/locale/ms_MY'; import Calendar from '../calendar/locale/ms_MY'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ms-my', Pagination, DatePicker, @@ -61,3 +62,5 @@ export default { downloadFile: 'Muat turun fail', }, }; + +export default localeValues; diff --git a/components/locale/nb_NO.tsx b/components/locale/nb_NO.tsx index 17c361588d..40513049bd 100644 --- a/components/locale/nb_NO.tsx +++ b/components/locale/nb_NO.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/nb_NO'; import DatePicker from '../date-picker/locale/nb_NO'; import TimePicker from '../time-picker/locale/nb_NO'; import Calendar from '../calendar/locale/nb_NO'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'nb', DatePicker, TimePicker, @@ -41,3 +42,5 @@ export default { description: 'Ingen data', }, }; + +export default localeValues; diff --git a/components/locale/ne_NP.tsx b/components/locale/ne_NP.tsx index 487b10e4a7..c4211c8c4d 100644 --- a/components/locale/ne_NP.tsx +++ b/components/locale/ne_NP.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/en_US'; import DatePicker from '../date-picker/locale/en_US'; import TimePicker from '../time-picker/locale/en_US'; import Calendar from '../calendar/locale/en_US'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ne-np', Pagination, DatePicker, @@ -42,3 +43,5 @@ export default { description: 'डाटा छैन', }, }; + +export default localeValues; diff --git a/components/locale/nl_BE.tsx b/components/locale/nl_BE.tsx index a0e13d7546..6177485cdf 100644 --- a/components/locale/nl_BE.tsx +++ b/components/locale/nl_BE.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/nl_BE'; import DatePicker from '../date-picker/locale/nl_BE'; import TimePicker from '../time-picker/locale/nl_BE'; import Calendar from '../calendar/locale/nl_BE'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'nl-be', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Geen gegevens', }, }; + +export default localeValues; diff --git a/components/locale/nl_NL.tsx b/components/locale/nl_NL.tsx index c1f75a953e..675d5ee73b 100644 --- a/components/locale/nl_NL.tsx +++ b/components/locale/nl_NL.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/nl_NL'; import DatePicker from '../date-picker/locale/nl_NL'; import TimePicker from '../time-picker/locale/nl_NL'; import Calendar from '../calendar/locale/nl_NL'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'nl', Pagination, DatePicker, @@ -60,3 +61,5 @@ export default { back: 'Terug', }, }; + +export default localeValues; diff --git a/components/locale/pl_PL.tsx b/components/locale/pl_PL.tsx index bdc24981b9..ac3c2c836c 100644 --- a/components/locale/pl_PL.tsx +++ b/components/locale/pl_PL.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/pl_PL'; import DatePicker from '../date-picker/locale/pl_PL'; import TimePicker from '../time-picker/locale/pl_PL'; import Calendar from '../calendar/locale/pl_PL'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'pl', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Brak danych', }, }; + +export default localeValues; diff --git a/components/locale/pt_BR.tsx b/components/locale/pt_BR.tsx index cf64c0571a..5bc7621f65 100644 --- a/components/locale/pt_BR.tsx +++ b/components/locale/pt_BR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/pt_BR'; import DatePicker from '../date-picker/locale/pt_BR'; import TimePicker from '../time-picker/locale/pt_BR'; import Calendar from '../calendar/locale/pt_BR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'pt-br', Pagination, DatePicker, @@ -47,3 +48,5 @@ export default { expand: 'expandir', }, }; + +export default localeValues; diff --git a/components/locale/pt_PT.tsx b/components/locale/pt_PT.tsx index c72531e288..34546b8873 100644 --- a/components/locale/pt_PT.tsx +++ b/components/locale/pt_PT.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/pt_PT'; import DatePicker from '../date-picker/locale/pt_PT'; import TimePicker from '../time-picker/locale/pt_PT'; import Calendar from '../calendar/locale/pt_PT'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'pt', Pagination, DatePicker, @@ -42,3 +43,5 @@ export default { description: 'Sem resultados', }, }; + +export default localeValues; diff --git a/components/locale/ro_RO.tsx b/components/locale/ro_RO.tsx index fe1de330d0..dae5d6a1d1 100644 --- a/components/locale/ro_RO.tsx +++ b/components/locale/ro_RO.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ro_RO'; import DatePicker from '../date-picker/locale/ro_RO'; import TimePicker from '../time-picker/locale/ro_RO'; import Calendar from '../calendar/locale/ro_RO'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ro', Pagination, DatePicker, @@ -60,3 +61,5 @@ export default { back: 'înapoi', }, }; + +export default localeValues; diff --git a/components/locale/ru_RU.tsx b/components/locale/ru_RU.tsx index 9ce0858b23..b66053dfd7 100644 --- a/components/locale/ru_RU.tsx +++ b/components/locale/ru_RU.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ru_RU'; import DatePicker from '../date-picker/locale/ru_RU'; import TimePicker from '../time-picker/locale/ru_RU'; import Calendar from '../calendar/locale/ru_RU'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ru', Pagination, DatePicker, @@ -51,3 +52,5 @@ export default { back: 'назад', }, }; + +export default localeValues; diff --git a/components/locale/sk_SK.tsx b/components/locale/sk_SK.tsx index dcff8543d0..2a24b6126b 100644 --- a/components/locale/sk_SK.tsx +++ b/components/locale/sk_SK.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/sk_SK'; import DatePicker from '../date-picker/locale/sk_SK'; import TimePicker from '../time-picker/locale/sk_SK'; import Calendar from '../calendar/locale/sk_SK'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'sk', Pagination, DatePicker, @@ -60,3 +61,5 @@ export default { back: 'Späť', }, }; + +export default localeValues; diff --git a/components/locale/sl_SI.tsx b/components/locale/sl_SI.tsx index f7cc25f8f6..070d1d3d14 100644 --- a/components/locale/sl_SI.tsx +++ b/components/locale/sl_SI.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/sl_SI'; import DatePicker from '../date-picker/locale/sl_SI'; import TimePicker from '../time-picker/locale/sl_SI'; import Calendar from '../calendar/locale/sl_SI'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'sl', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Ni podatkov', }, }; + +export default localeValues; diff --git a/components/locale/sr_RS.tsx b/components/locale/sr_RS.tsx index 325e733c3a..f2951055c0 100644 --- a/components/locale/sr_RS.tsx +++ b/components/locale/sr_RS.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/sr_RS'; import DatePicker from '../date-picker/locale/sr_RS'; import TimePicker from '../time-picker/locale/sr_RS'; import Calendar from '../calendar/locale/sr_RS'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'sr', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Nema podataka', }, }; + +export default localeValues; diff --git a/components/locale/sv_SE.tsx b/components/locale/sv_SE.tsx index 8c8a885f0e..22f057c37b 100644 --- a/components/locale/sv_SE.tsx +++ b/components/locale/sv_SE.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/sv_SE'; import DatePicker from '../date-picker/locale/sv_SE'; import TimePicker from '../time-picker/locale/sv_SE'; import Calendar from '../calendar/locale/sv_SE'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'sv', Pagination, DatePicker, @@ -45,3 +46,5 @@ export default { downloadFile: 'Nedladdning fil', }, }; + +export default localeValues; diff --git a/components/locale/ta_IN.tsx b/components/locale/ta_IN.tsx index 1bb97b7f1c..77356cd68b 100644 --- a/components/locale/ta_IN.tsx +++ b/components/locale/ta_IN.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/ta_IN'; import DatePicker from '../date-picker/locale/ta_IN'; import TimePicker from '../time-picker/locale/ta_IN'; import Calendar from '../calendar/locale/ta_IN'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'ta', Pagination, DatePicker, @@ -61,3 +62,5 @@ export default { back: 'பின் செல்லவும்', }, }; + +export default localeValues; diff --git a/components/locale/th_TH.tsx b/components/locale/th_TH.tsx index dfcc7dfa50..b050019e27 100644 --- a/components/locale/th_TH.tsx +++ b/components/locale/th_TH.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/th_TH'; import DatePicker from '../date-picker/locale/th_TH'; import TimePicker from '../time-picker/locale/th_TH'; import Calendar from '../calendar/locale/th_TH'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'th', Pagination, DatePicker, @@ -60,3 +61,5 @@ export default { back: 'ย้อนกลับ', }, }; + +export default localeValues; diff --git a/components/locale/tr_TR.tsx b/components/locale/tr_TR.tsx index 39cb39507e..5bc8d74221 100644 --- a/components/locale/tr_TR.tsx +++ b/components/locale/tr_TR.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/tr_TR'; import DatePicker from '../date-picker/locale/tr_TR'; import TimePicker from '../time-picker/locale/tr_TR'; import Calendar from '../calendar/locale/tr_TR'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'tr', Pagination, DatePicker, @@ -55,3 +56,5 @@ export default { expand: 'genişlet', }, }; + +export default localeValues; diff --git a/components/locale/uk_UA.tsx b/components/locale/uk_UA.tsx index e7955024fe..b07cdfcb1c 100644 --- a/components/locale/uk_UA.tsx +++ b/components/locale/uk_UA.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/uk_UA'; import DatePicker from '../date-picker/locale/uk_UA'; import TimePicker from '../time-picker/locale/uk_UA'; import Calendar from '../calendar/locale/uk_UA'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'uk', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Даних немає', }, }; + +export default localeValues; diff --git a/components/locale/vi_VN.tsx b/components/locale/vi_VN.tsx index 1b39e6529b..5e0d49a612 100644 --- a/components/locale/vi_VN.tsx +++ b/components/locale/vi_VN.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/vi_VN'; import DatePicker from '../date-picker/locale/vi_VN'; import TimePicker from '../time-picker/locale/vi_VN'; import Calendar from '../calendar/locale/vi_VN'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'vi', Pagination, DatePicker, @@ -41,3 +42,5 @@ export default { description: 'Trống', }, }; + +export default localeValues; diff --git a/components/locale/zh_CN.tsx b/components/locale/zh_CN.tsx index 27a4a8b3c6..d49ec6012e 100644 --- a/components/locale/zh_CN.tsx +++ b/components/locale/zh_CN.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/zh_CN'; import DatePicker from '../date-picker/locale/zh_CN'; import TimePicker from '../time-picker/locale/zh_CN'; import Calendar from '../calendar/locale/zh_CN'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'zh-cn', Pagination, DatePicker, @@ -23,6 +24,9 @@ export default { sortTitle: '排序', expand: '展开行', collapse: '关闭行', + triggerDesc: '点击降序', + triggerAsc: '点击升序', + cancelSort: '取消排序', }, Modal: { okText: '确定', @@ -61,3 +65,5 @@ export default { back: '返回', }, }; + +export default localeValues; diff --git a/components/locale/zh_TW.tsx b/components/locale/zh_TW.tsx index 66838b22b3..2c756cb0fb 100644 --- a/components/locale/zh_TW.tsx +++ b/components/locale/zh_TW.tsx @@ -2,8 +2,9 @@ import Pagination from 'rc-pagination/lib/locale/zh_TW'; import DatePicker from '../date-picker/locale/zh_TW'; import TimePicker from '../time-picker/locale/zh_TW'; import Calendar from '../calendar/locale/zh_TW'; +import { Locale } from '../locale-provider'; -export default { +const localeValues: Locale = { locale: 'zh-tw', Pagination, DatePicker, @@ -44,3 +45,5 @@ export default { back: '返回', }, }; + +export default localeValues; diff --git a/components/menu/MenuItem.tsx b/components/menu/MenuItem.tsx index 416c96ecec..dd831e8b68 100644 --- a/components/menu/MenuItem.tsx +++ b/components/menu/MenuItem.tsx @@ -44,8 +44,14 @@ export default class MenuItem extends React.Component { return ( {({ inlineCollapsed, direction }: MenuContextProps) => { + let tooltipTitle = title; + if (typeof title === 'undefined') { + tooltipTitle = level === 1 ? children : ''; + } else if (title === false) { + tooltipTitle = ''; + } const tooltipProps: TooltipProps = { - title: title || (level === 1 ? children : ''), + title: tooltipTitle, }; if (!siderCollapsed && !inlineCollapsed) { diff --git a/components/menu/__tests__/index.test.js b/components/menu/__tests__/index.test.js index 812c236b2a..a834d67e76 100644 --- a/components/menu/__tests__/index.test.js +++ b/components/menu/__tests__/index.test.js @@ -3,6 +3,7 @@ import { mount } from 'enzyme'; import Menu from '..'; import Icon from '../../icon'; import Layout from '../../layout'; +import Tooltip from '../../tooltip'; import mountTest from '../../../tests/shared/mountTest'; import rtlTest from '../../../tests/shared/rtlTest'; import { resetWarned } from '../../_util/warning'; @@ -372,6 +373,42 @@ describe('Menu', () => { ).toBe(false); }); + it('inlineCollapsed Menu.Item Tooltip can be removed', () => { + const wrapper = mount( + node.parentNode} + > + + item + + + item + + + item + + + item + + + item + + + item + + , + ); + expect(wrapper.find(Menu.Item).at(0).find(Tooltip).props().title).toBe('item'); + expect(wrapper.find(Menu.Item).at(1).find(Tooltip).props().title).toBe('title'); + expect(wrapper.find(Menu.Item).at(2).find(Tooltip).props().title).toBe('item'); + expect(wrapper.find(Menu.Item).at(3).find(Tooltip).props().title).toBe(null); + expect(wrapper.find(Menu.Item).at(4).find(Tooltip).props().title).toBe(''); + expect(wrapper.find(Menu.Item).at(4).find(Tooltip).props().title).toBe(''); + }); + describe('open submenu when click submenu title', () => { beforeEach(() => { jest.useFakeTimers(); diff --git a/components/modal/locale.tsx b/components/modal/locale.tsx index 7a152cccab..afb40c676b 100644 --- a/components/modal/locale.tsx +++ b/components/modal/locale.tsx @@ -7,7 +7,7 @@ export interface ModalLocale { } let runtimeLocale: ModalLocale = { - ...defaultLocale.Modal, + ...(defaultLocale.Modal as ModalLocale), }; export function changeConfirmLocale(newLocale?: ModalLocale) { @@ -18,7 +18,7 @@ export function changeConfirmLocale(newLocale?: ModalLocale) { }; } else { runtimeLocale = { - ...defaultLocale.Modal, + ...(defaultLocale.Modal as ModalLocale), }; } } diff --git a/components/pagination/Pagination.tsx b/components/pagination/Pagination.tsx index 662fa926d6..f9c000c7dd 100644 --- a/components/pagination/Pagination.tsx +++ b/components/pagination/Pagination.tsx @@ -7,6 +7,7 @@ import RightOutlined from '@ant-design/icons/RightOutlined'; import DoubleLeftOutlined from '@ant-design/icons/DoubleLeftOutlined'; import DoubleRightOutlined from '@ant-design/icons/DoubleRightOutlined'; +import ResponsiveObserve from '../_util/responsiveObserve'; import MiniSelect from './MiniSelect'; import Select from '../select'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; @@ -26,7 +27,8 @@ export interface PaginationProps { onShowSizeChange?: (current: number, size: number) => void; showQuickJumper?: boolean | { goButton?: React.ReactNode }; showTotal?: (total: number, range: [number, number]) => React.ReactNode; - size?: string; + size?: 'default' | 'small'; + responsive?: boolean; simple?: boolean; style?: React.CSSProperties; locale?: Object; @@ -49,6 +51,26 @@ export interface PaginationConfig extends PaginationProps { export type PaginationLocale = any; export default class Pagination extends React.Component { + private token: string; + + private inferredSmall: boolean = false; + + componentDidMount() { + this.token = ResponsiveObserve.subscribe(screens => { + const { xs } = screens; + const { size, responsive } = this.props; + const inferredSmall = !!(xs && !size && responsive); + if (this.inferredSmall !== inferredSmall) { + this.inferredSmall = inferredSmall; + this.forceUpdate(); + } + }); + } + + componentWillUnmount() { + ResponsiveObserve.unsubscribe(this.token); + } + getIconsProps = (prefixCls: string, direction: 'ltr' | 'rtl' | undefined) => { let prevIcon = ( @@ -108,7 +130,7 @@ export default class Pagination extends React.Component { ...restProps } = this.props; const locale = { ...contextLocale, ...customLocale }; - const isSmall = size === 'small'; + const isSmall = size === 'small' || this.inferredSmall; return ( {({ getPrefixCls, direction }: ConfigConsumerProps) => { diff --git a/components/pagination/__tests__/index.test.js b/components/pagination/__tests__/index.test.js index cc0b264bfc..a046416ea5 100644 --- a/components/pagination/__tests__/index.test.js +++ b/components/pagination/__tests__/index.test.js @@ -36,4 +36,14 @@ describe('Pagination', () => { .props().disabled, ).toBe(true); }); + + it('should autometically be small when size is not specified', async () => { + const wrapper = mount(); + expect( + wrapper + .find('ul') + .at(0) + .hasClass('mini'), + ).toBe(true); + }); }); diff --git a/components/pagination/index.en-US.md b/components/pagination/index.en-US.md index c5c2491af0..ca681906b8 100644 --- a/components/pagination/index.en-US.md +++ b/components/pagination/index.en-US.md @@ -34,7 +34,8 @@ A long list can be divided into several pages using `Pagination`, and only one p | showTitle | Show page item's title | boolean | true | | | showTotal | To display the total number and range | Function(total, range) | - | | | simple | Whether to use simple mode | boolean | - | | -| size | Specify the size of `Pagination`, can be set to `small` | string | "" | | +| size | Specify the size of `Pagination`, can be set to `small`. | 'default' \| 'small'. | "" | | +| responsive | If `size` is not specified, `Pagination` would resize according to the width of the window | boolean | - | | | total | Total number of data items | number | 0 | | | onChange | Called when the page number is changed, and it takes the resulting page number and pageSize as its arguments | Function(page, pageSize) | noop | | | onShowSizeChange | Called when `pageSize` is changed | Function(current, size) | noop | | diff --git a/components/pagination/index.zh-CN.md b/components/pagination/index.zh-CN.md index 6f9fb954e8..6bb6371a95 100644 --- a/components/pagination/index.zh-CN.md +++ b/components/pagination/index.zh-CN.md @@ -34,7 +34,8 @@ cols: 1 | showSizeChanger | 是否可以改变 pageSize | boolean | false | | | showTotal | 用于显示数据总量和当前数据顺序 | Function(total, range) | - | | | simple | 当添加该属性时,显示为简单分页 | boolean | - | | -| size | 当为「small」时,是小尺寸分页 | string | "" | | +| size | 当为「small」时,是小尺寸分页 | 'default' \| 'small' | "" | | +| responsive | 当 size 未指定时,根据屏幕宽度自动调整尺寸 | boolean | - | | | total | 数据总数 | number | 0 | | | onChange | 页码改变的回调,参数是改变后的页码及每页条数 | Function(page, pageSize) | noop | | | onShowSizeChange | pageSize 变化的回调 | Function(current, size) | noop | | diff --git a/components/popconfirm/__tests__/__snapshots__/index.test.js.snap b/components/popconfirm/__tests__/__snapshots__/index.test.js.snap index 3605123ce0..41cdafd081 100644 --- a/components/popconfirm/__tests__/__snapshots__/index.test.js.snap +++ b/components/popconfirm/__tests__/__snapshots__/index.test.js.snap @@ -2,6 +2,8 @@ exports[`Popconfirm rtl render component should be rendered correctly in RTL direction 1`] = ``; -exports[`Popconfirm should show overlay when trigger is clicked 1`] = `"
code
"`; +exports[`Popconfirm should show overlay when trigger is clicked 1`] = `"
code
"`; -exports[`Popconfirm should show overlay when trigger is clicked 2`] = `"
code
"`; +exports[`Popconfirm should show overlay when trigger is clicked 2`] = `"
code
"`; + +exports[`Popconfirm shows content for render functions 1`] = `"
some-title
"`; diff --git a/components/popconfirm/__tests__/index.test.js b/components/popconfirm/__tests__/index.test.js index 6659443723..8928beeb78 100644 --- a/components/popconfirm/__tests__/index.test.js +++ b/components/popconfirm/__tests__/index.test.js @@ -58,6 +58,26 @@ describe('Popconfirm', () => { expect(popup.innerHTML).toMatchSnapshot(); }); + it('shows content for render functions', async () => { + const makeRenderFunction = content => () => content; + + const popconfirm = mount( + + show me your code + , + ); + + expect(popconfirm.instance().getPopupDomNode()).toBe(null); + + popconfirm.find('span').simulate('click'); + await sleep(100); + + const popup = popconfirm.instance().getPopupDomNode(); + expect(popup).not.toBe(null); + expect(popup.innerHTML).toContain('some-title'); + expect(popup.innerHTML).toMatchSnapshot(); + }); + it('should be controlled by visible', () => { jest.useFakeTimers(); const popconfirm = mount( diff --git a/components/popconfirm/index.en-US.md b/components/popconfirm/index.en-US.md index 3573b866b3..aeadfae441 100644 --- a/components/popconfirm/index.en-US.md +++ b/components/popconfirm/index.en-US.md @@ -19,7 +19,7 @@ The difference with the `confirm` modal dialog is that it's more lightweight tha | cancelText | text of the Cancel button | string | `Cancel` | | okText | text of the Confirm button | string | `OK` | | okType | Button `type` of the Confirm button | string | `primary` | -| title | title of the confirmation box | string\|ReactNode | - | +| title | title of the confirmation box | string\|ReactNode\|() => ReactNode | - | | onCancel | callback of cancel | function(e) | - | | onConfirm | callback of confirmation | function(e) | - | | icon | customize icon of confirmation | ReactNode | `` | diff --git a/components/popconfirm/index.tsx b/components/popconfirm/index.tsx index 26c79c5f99..2941d35d14 100644 --- a/components/popconfirm/index.tsx +++ b/components/popconfirm/index.tsx @@ -1,15 +1,15 @@ import * as React from 'react'; import ExclamationCircleFilled from '@ant-design/icons/ExclamationCircleFilled'; - import Tooltip, { AbstractTooltipProps } from '../tooltip'; import Button from '../button'; import { ButtonType, NativeButtonProps } from '../button/button'; import LocaleReceiver from '../locale-provider/LocaleReceiver'; import defaultLocale from '../locale/default'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; +import { getRenderPropValue, RenderFunction } from '../_util/getRenderPropValue'; export interface PopconfirmProps extends AbstractTooltipProps { - title: React.ReactNode; + title: React.ReactNode | RenderFunction; disabled?: boolean; onConfirm?: (e?: React.MouseEvent) => void; onCancel?: (e?: React.MouseEvent) => void; @@ -118,20 +118,18 @@ class Popconfirm extends React.Component { icon, } = this.props; return ( -
-
-
- {icon} -
{title}
-
-
- - -
+
+
+ {icon} +
{getRenderPropValue(title)}
+
+
+ +
); diff --git a/components/popconfirm/index.zh-CN.md b/components/popconfirm/index.zh-CN.md index 7a033abf3f..dd4366ed34 100644 --- a/components/popconfirm/index.zh-CN.md +++ b/components/popconfirm/index.zh-CN.md @@ -20,7 +20,7 @@ title: Popconfirm | cancelText | 取消按钮文字 | string | 取消 | | okText | 确认按钮文字 | string | 确定 | | okType | 确认按钮类型 | string | primary | -| title | 确认框的描述 | string\|ReactNode | - | +| title | 确认框的描述 | string\|ReactNode\|() => ReactNode | - | | onCancel | 点击取消的回调 | function(e) | - | | onConfirm | 点击确认的回调 | function(e) | - | | icon | 自定义弹出气泡 Icon 图标 | ReactNode | `` | diff --git a/components/popover/__tests__/__snapshots__/index.test.js.snap b/components/popover/__tests__/__snapshots__/index.test.js.snap index 320f2b99b5..ee388ba2f4 100644 --- a/components/popover/__tests__/__snapshots__/index.test.js.snap +++ b/components/popover/__tests__/__snapshots__/index.test.js.snap @@ -1,5 +1,7 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP +exports[`Popover handles empty title/content props safely 1`] = `"
"`; + exports[`Popover should be rendered correctly in RTL direction 1`] = ` Array [ -
-
- RTL -
-
+
+ RTL
+
@@ -39,6 +39,6 @@ Array [ ] `; -exports[`Popover should show overlay when trigger is clicked 1`] = `"
code
console.log('hello world')
"`; +exports[`Popover should show overlay when trigger is clicked 1`] = `"
code
console.log('hello world')
"`; -exports[`Popover should show overlay when trigger is clicked 2`] = `"
code
console.log('hello world')
"`; +exports[`Popover shows content for render functions 1`] = `"
some-title
some-content
"`; diff --git a/components/popover/__tests__/index.test.js b/components/popover/__tests__/index.test.js index 25d547f304..37d591eccb 100644 --- a/components/popover/__tests__/index.test.js +++ b/components/popover/__tests__/index.test.js @@ -24,6 +24,38 @@ describe('Popover', () => { expect(popup).not.toBe(null); expect(popup.className).toContain('ant-popover-placement-top'); expect(popup.innerHTML).toMatchSnapshot(); + }); + + it('shows content for render functions', () => { + const renderTitle = () => 'some-title'; + const renderContent = () => 'some-content'; + + const popover = mount( + + show me your code + , + ); + + popover.find('span').simulate('click'); + + const popup = popover.instance().getPopupDomNode(); + expect(popup).not.toBe(null); + expect(popup.innerHTML).toContain('some-title'); + expect(popup.innerHTML).toContain('some-content'); + expect(popup.innerHTML).toMatchSnapshot(); + }); + + it('handles empty title/content props safely', () => { + const popover = mount( + + show me your code + , + ); + + popover.find('span').simulate('click'); + + const popup = popover.instance().getPopupDomNode(); + expect(popup).not.toBe(null); expect(popup.innerHTML).toMatchSnapshot(); }); diff --git a/components/popover/index.en-US.md b/components/popover/index.en-US.md index 0d4266a410..481e1b9772 100644 --- a/components/popover/index.en-US.md +++ b/components/popover/index.en-US.md @@ -14,10 +14,10 @@ Comparing with `Tooltip`, besides information `Popover` card can also provide ac ## API -| Param | Description | Type | Default value | Version | -| ------- | ------------------- | ----------------- | ------------- | ------- | -| content | Content of the card | string\|ReactNode | - | | -| title | Title of the card | string\|ReactNode | - | | +| Param | Description | Type | Default value | Version | +| ------- | ------------------- | ---------------------------------- | ------------- | ------- | +| content | Content of the card | string\|ReactNode\|() => ReactNode | - | | +| title | Title of the card | string\|ReactNode\|() => ReactNode | - | | Consult [Tooltip's documentation](https://ant.design/components/tooltip/#API) to find more APIs. diff --git a/components/popover/index.tsx b/components/popover/index.tsx index babf1eb5b0..a126436036 100644 --- a/components/popover/index.tsx +++ b/components/popover/index.tsx @@ -1,10 +1,11 @@ import * as React from 'react'; import Tooltip, { AbstractTooltipProps, TooltipPlacement } from '../tooltip'; import { ConfigConsumer, ConfigConsumerProps } from '../config-provider'; +import { getRenderPropValue, RenderFunction } from '../_util/getRenderPropValue'; export interface PopoverProps extends AbstractTooltipProps { - title?: React.ReactNode; - content?: React.ReactNode; + title?: React.ReactNode | RenderFunction; + content?: React.ReactNode | RenderFunction; } export default class Popover extends React.Component { @@ -26,10 +27,10 @@ export default class Popover extends React.Component { getOverlay(prefixCls: string) { const { title, content } = this.props; return ( -
- {title &&
{title}
} -
{content}
-
+ <> + {title &&
{getRenderPropValue(title)}
} +
{getRenderPropValue(content)}
+ ); } diff --git a/components/popover/index.zh-CN.md b/components/popover/index.zh-CN.md index 860d796fb7..83034091e7 100644 --- a/components/popover/index.zh-CN.md +++ b/components/popover/index.zh-CN.md @@ -15,10 +15,10 @@ title: Popover ## API -| 参数 | 说明 | 类型 | 默认值 | 版本 | -| ------- | -------- | ----------------- | ------ | ---- | -| content | 卡片内容 | string\|ReactNode | 无 | | -| title | 卡片标题 | string\|ReactNode | 无 | | +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| ------- | -------- | ---------------------------------- | ------ | ---- | +| content | 卡片内容 | string\|ReactNode\|() => ReactNode | 无 | | +| title | 卡片标题 | string\|ReactNode\|() => ReactNode | 无 | | 更多属性请参考 [Tooltip](/components/tooltip/#API)。 diff --git a/components/select/index.en-US.md b/components/select/index.en-US.md index a034c12b2c..7c10744a1c 100644 --- a/components/select/index.en-US.md +++ b/components/select/index.en-US.md @@ -30,7 +30,7 @@ Select component to select value from options. | defaultValue | Initial selected option. | string\|string\[]
number\|number\[]
LabeledValue\|LabeledValue[] | - | | | disabled | Whether disabled select | boolean | false | | | dropdownClassName | className of dropdown menu | string | - | | -| dropdownMatchSelectWidth | Whether dropdown's width is same with select. | boolean | true | | +| dropdownMatchSelectWidth | Determine whether the dropdown menu and the select input are the same width. Default set `min-width` same as input. `false` will disable virtual scroll | boolean \| number | true | | | dropdownRender | Customize dropdown content | (menuNode: ReactNode, props) => ReactNode | - | | | dropdownStyle | style of dropdown menu | object | - | | | dropdownMenuStyle | additional style applied to dropdown menu | object | - | | @@ -56,6 +56,7 @@ Select component to select value from options. | menuItemSelectedIcon | The custom menuItemSelected icon with multiple options | ReactNode | - | | | tokenSeparators | Separator used to tokenize on tag/multiple mode | string\[] | | | | value | Current selected option. | string\|string\[]\
number\|number\[]\
LabeledValue\|LabeledValue[] | - | | +| virtual | Disable virtual scroll when set to `false` | boolean | - | 4.1.0 | | onBlur | Called when blur | function | - | | | onChange | Called when select an option or input value change, or value of input is changed in combobox mode | function(value, option:Option/Array<Option>) | - | | | onDeselect | Called when a option is deselected, param is the selected option's value. Only called for multiple or tags, effective in multiple or tags mode only. | function(string\|number\|LabeledValue) | - | | @@ -81,12 +82,12 @@ Select component to select value from options. ### Option props -| Property | Description | Type | Default | Version | -| --- | --- | --- | --- | --- | -| disabled | Disable this option | boolean | false | | -| title | `title` of Select after select this Option | string | - | | -| value | default to filter with this property | string\|number | - | | -| className | additional class to option | string | - | | +| Property | Description | Type | Default | Version | +| --------- | ------------------------------------------ | -------------- | ------- | ------- | +| disabled | Disable this option | boolean | false | | +| title | `title` of Select after select this Option | string | - | | +| value | default to filter with this property | string\|number | - | | +| className | additional class to option | string | - | | ### OptGroup props diff --git a/components/select/index.zh-CN.md b/components/select/index.zh-CN.md index b367cf7618..e2d47292fd 100644 --- a/components/select/index.zh-CN.md +++ b/components/select/index.zh-CN.md @@ -31,7 +31,7 @@ title: Select | defaultValue | 指定默认选中的条目 | string\|string\[]\
number\|number\[]\
LabeledValue\|LabeledValue[] | - | | | disabled | 是否禁用 | boolean | false | | | dropdownClassName | 下拉菜单的 className 属性 | string | - | | -| dropdownMatchSelectWidth | 下拉菜单和选择器同宽 | boolean | true | | +| dropdownMatchSelectWidth | 下拉菜单和选择器同宽。默认将设置 `min-width`。`false` 时会关闭虚拟滚动 | boolean \| number | true | | | dropdownRender | 自定义下拉框内容 | (menuNode: ReactNode, props) => ReactNode | - | | | dropdownStyle | 下拉菜单的 style 属性 | object | - | | | dropdownMenuStyle | dropdown 菜单自定义样式 | object | - | | @@ -57,6 +57,7 @@ title: Select | menuItemSelectedIcon | 自定义多选时当前选中的条目图标 | ReactNode | - | | | tokenSeparators | 在 tags 和 multiple 模式下自动分词的分隔符 | string\[] | | | | value | 指定当前选中的条目 | string\|string\[]\
number\|number\[]\
LabeledValue\|LabeledValue[] | - | | +| virtual | 设置 `false` 时关闭虚拟滚动 | boolean | - | 4.1.0 | | onBlur | 失去焦点时回调 | function | - | | | onChange | 选中 option,或 input 的 value 变化(combobox 模式下)时,调用此函数 | function(value, option:Option/Array<Option>) | - | | | onDeselect | 取消选中时调用,参数为选中项的 value (或 key) 值,仅在 multiple 或 tags 模式下生效 | function(string\|number\|LabeledValue) | - | | @@ -84,12 +85,12 @@ title: Select ### Option props -| 参数 | 说明 | 类型 | 默认值 | 版本 | -| --- | --- | --- | --- | --- | -| disabled | 是否禁用 | boolean | false | | -| title | 选中该 Option 后,Select 的 title | string | - | | -| value | 默认根据此属性值进行筛选 | string\|number | - | | -| className | Option 器类名 | string | - | | +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| --------- | --------------------------------- | -------------- | ------ | ---- | +| disabled | 是否禁用 | boolean | false | | +| title | 选中该 Option 后,Select 的 title | string | - | | +| value | 默认根据此属性值进行筛选 | string\|number | - | | +| className | Option 器类名 | string | - | | ### OptGroup props diff --git a/components/table/Table.tsx b/components/table/Table.tsx index bad9f67123..178db5e545 100644 --- a/components/table/Table.tsx +++ b/components/table/Table.tsx @@ -79,6 +79,7 @@ export interface TableProps scrollToFirstRowOnChange?: boolean; }; sortDirections?: SortOrder[]; + showSorterTooltip?: boolean; } function Table(props: TableProps) { @@ -108,6 +109,7 @@ function Table(props: TableProps) { scroll, sortDirections, locale, + showSorterTooltip = true, } = props; const tableProps = omit(props, ['className', 'style']) as TableProps; @@ -215,13 +217,14 @@ function Table(props: TableProps) { false, ); }; - const [transformSorterColumns, sortStates, sorterTitleProps, getSorters] = useSorter({ prefixCls, columns, children, onSorterChange, sortDirections: sortDirections || ['ascend', 'descend'], + tableLocale, + showSorterTooltip, }); const sortedData = React.useMemo(() => getSortData(rawData, sortStates, childrenColumnName), [ rawData, diff --git a/components/table/__tests__/Table.filter.test.js b/components/table/__tests__/Table.filter.test.js index 0f90ad8c63..a666e0d8ce 100644 --- a/components/table/__tests__/Table.filter.test.js +++ b/components/table/__tests__/Table.filter.test.js @@ -10,6 +10,15 @@ import ConfigProvider from '../../config-provider'; // https://github.com/Semantic-Org/Semantic-UI-React/blob/72c45080e4f20b531fda2e3e430e384083d6766b/test/specs/modules/Dropdown/Dropdown-test.js#L73 const nativeEvent = { nativeEvent: { stopImmediatePropagation: () => {} } }; +function getDropdownWrapper(wrapper) { + return mount( + wrapper + .find('Trigger') + .instance() + .getComponent(), + ); +} + describe('Table.filter', () => { const filterFn = (value, record) => record.name.indexOf(value) !== -1; const column = { @@ -235,7 +244,7 @@ describe('Table.filter', () => { .simulate('click'); wrapper .find('FilterDropdown') - .find('.confirm') + .find('.ant-table-filter-dropdown-btns .ant-btn-primary') .simulate('click'); expect(wrapper.find('FilterDropdown').props().filterState.filteredKeys).toEqual(['boy']); wrapper.setProps({ dataSource: [...data, { key: 999, name: 'Chris' }] }); @@ -379,7 +388,7 @@ describe('Table.filter', () => { .simulate('click'); wrapper .find('FilterDropdown') - .find('.confirm') + .find('.ant-table-filter-dropdown-btns .ant-btn-primary') .simulate('click'); expect(handleChange).toHaveBeenCalledWith( @@ -400,75 +409,73 @@ describe('Table.filter', () => { .find('.ant-dropdown-trigger') .first() .simulate('click'); - wrapper.find('.clear').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').simulate('click'); expect(handleChange).not.toHaveBeenCalled(); }); - // enzyme not correct update function component under mini store. - // It's correct in `instance().props` but failed in `props()` - // it.skip('three levels menu', () => { - // const filters = [ - // { text: 'Upper', value: 'Upper' }, - // { text: 'Lower', value: 'Lower' }, - // { - // text: 'Level2', - // value: 'Level2', - // children: [ - // { text: 'Large', value: 'Large' }, - // { text: 'Small', value: 'Small' }, - // { - // text: 'Level3', - // value: 'Level3', - // children: [ - // { text: 'Black', value: 'Black' }, - // { text: 'White', value: 'White' }, - // { text: 'Jack', value: 'Jack' }, - // ], - // }, - // ], - // }, - // ]; - // const wrapper = mount( - // createTable({ - // columns: [ - // { - // ...column, - // filters, - // }, - // ], - // }), - // ); - // jest.useFakeTimers(); - // const dropdownWrapper = getDropdownWrapper(wrapper); - // expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']); + it('three levels menu', () => { + const filters = [ + { text: 'Upper', value: 'Upper' }, + { text: 'Lower', value: 'Lower' }, + { + text: 'Level2', + value: 'Level2', + children: [ + { text: 'Large', value: 'Large' }, + { text: 'Small', value: 'Small' }, + { + text: 'Level3', + value: 'Level3', + children: [ + { text: 'Black', value: 'Black' }, + { text: 'White', value: 'White' }, + { text: 'Jack', value: 'Jack' }, + ], + }, + ], + }, + ]; + const wrapper = mount( + createTable({ + columns: [ + { + ...column, + filters, + }, + ], + }), + ); + jest.useFakeTimers(); - // // select - // dropdownWrapper - // .find('.ant-dropdown-menu-submenu-title') - // .at(0) - // .simulate('mouseEnter'); - // jest.runAllTimers(); - // dropdownWrapper.update(); - // dropdownWrapper - // .find('.ant-dropdown-menu-submenu-title') - // .at(1) - // .simulate('mouseEnter'); - // jest.runAllTimers(); - // dropdownWrapper.update(); - // dropdownWrapper - // .find('MenuItem') - // .last() - // .simulate('click'); - // dropdownWrapper.find('.confirm').simulate('click'); - // wrapper.update(); - // expect(renderedNames(wrapper)).toEqual(['Jack']); - // dropdownWrapper - // .find('MenuItem') - // .last() - // .simulate('click'); - // jest.useRealTimers(); - // }); + let dropdownWrapper = getDropdownWrapper(wrapper); + expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']); + // select + dropdownWrapper + .find('.ant-dropdown-menu-submenu-title') + .at(0) + .simulate('mouseEnter'); + jest.runAllTimers(); + dropdownWrapper = getDropdownWrapper(wrapper); + dropdownWrapper + .find('.ant-dropdown-menu-submenu-title') + .at(1) + .simulate('mouseEnter'); + jest.runAllTimers(); + dropdownWrapper = getDropdownWrapper(wrapper); + dropdownWrapper + .find('MenuItem') + .last() + .simulate('click'); + dropdownWrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); + wrapper.update(); + expect(renderedNames(wrapper)).toEqual(['Jack']); + dropdownWrapper + .find('MenuItem') + .last() + .simulate('click'); + jest.useRealTimers(); + }); describe('should support value types', () => { [ @@ -501,7 +508,7 @@ describe('Table.filter', () => { .first() .simulate('click'); // This test can be remove if refactor - wrapper.find('.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); wrapper.update(); expect( @@ -581,11 +588,11 @@ describe('Table.filter', () => { .find('MenuItem') .first() .simulate('click'); - wrapper.find('.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); wrapper.update(); expect(renderedNames(wrapper)).toEqual(['Jack']); - wrapper.find('.clear').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-link').simulate('click'); wrapper.update(); expect(renderedNames(wrapper)).toEqual(['Jack', 'Lucy', 'Tom', 'Jerry']); }); @@ -872,7 +879,7 @@ describe('Table.filter', () => { .find('MenuItem') .first() .simulate('click'); - wrapper.find('.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); expect(onChange).toHaveBeenCalled(); onChange.mockReset(); expect(onChange).not.toHaveBeenCalled(); @@ -890,7 +897,7 @@ describe('Table.filter', () => { .find('MenuItem') .first() .simulate('click'); - wrapper.find('.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); expect(onChange).toHaveBeenCalled(); }); @@ -1025,7 +1032,7 @@ describe('Table.filter', () => { .find('MenuItem') .first() .simulate('click'); - wrapper.find('.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); expect(handleChange).toHaveBeenCalledWith( { @@ -1062,7 +1069,7 @@ describe('Table.filter', () => { .find('MenuItem') .first() .simulate('click'); - wrapper.find('.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); expect(handleChange).toHaveBeenCalledWith( { @@ -1155,7 +1162,7 @@ describe('Table.filter', () => { .find('.ant-dropdown-menu-item') .first() .simulate('click'); - wrapper.find('.ant-table-filter-dropdown-link.confirm').simulate('click'); + wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').simulate('click'); expect(onChange).toHaveBeenCalledWith( expect.anything(), { @@ -1185,15 +1192,12 @@ describe('Table.filter', () => { }), ); + expect(wrapper.find('.ant-table-filter-dropdown-btns .ant-btn-primary').text()).toEqual( + 'Bamboo', + ); expect( wrapper - .find('.ant-table-filter-dropdown-link') - .first() - .text(), - ).toEqual('Bamboo'); - expect( - wrapper - .find('.ant-table-filter-dropdown-link') + .find('.ant-table-filter-dropdown-btns .ant-btn-link') .last() .text(), ).toEqual('Reset'); diff --git a/components/table/__tests__/Table.rowSelection.test.js b/components/table/__tests__/Table.rowSelection.test.js index badba7764b..709912e302 100644 --- a/components/table/__tests__/Table.rowSelection.test.js +++ b/components/table/__tests__/Table.rowSelection.test.js @@ -638,7 +638,7 @@ describe('Table.rowSelection', () => { .simulate('click'); }); wrapper - .find('.ant-table-filter-dropdown-btns .ant-table-filter-dropdown-link.confirm') + .find('.ant-table-filter-dropdown-btns .ant-btn-primary') .simulate('click'); } diff --git a/components/table/__tests__/Table.sorter.test.js b/components/table/__tests__/Table.sorter.test.js index 9eb09a438b..9dc51d7351 100644 --- a/components/table/__tests__/Table.sorter.test.js +++ b/components/table/__tests__/Table.sorter.test.js @@ -150,6 +150,45 @@ describe('Table.sorter', () => { expect(sorter3.columnKey).toBe('name'); }); + it('hover header show sorter tooltip', () => { + // tooltip has delay + jest.useFakeTimers(); + const wrapper = mount(createTable({})); + // default show sorter tooltip + wrapper.find('.ant-table-column-sorters').simulate('mouseenter'); + jest.runAllTimers(); + wrapper.update(); + expect(wrapper.find('.ant-tooltip-open').length).toBeTruthy(); + wrapper.find('.ant-table-column-sorters').simulate('mouseout'); + // set table props showSorterTooltip is false + wrapper.setProps({ showSorterTooltip: false }); + wrapper.find('.ant-table-column-sorters').simulate('mouseenter'); + jest.runAllTimers(); + wrapper.update(); + expect(wrapper.find('.ant-tooltip-open').length).toBeFalsy(); + wrapper.find('.ant-table-column-sorters').simulate('mouseout'); + // set table props showSorterTooltip is false, column showSorterTooltip is true + wrapper.setProps({ + showSorterTooltip: false, + columns: [{ ...column, showSorterTooltip: true }], + }); + wrapper.find('.ant-table-column-sorters').simulate('mouseenter'); + jest.runAllTimers(); + wrapper.update(); + expect(wrapper.find('.ant-tooltip-open').length).toBeTruthy(); + wrapper.find('.ant-table-column-sorters').simulate('mouseout'); + // set table props showSorterTooltip is true, column showSorterTooltip is false + wrapper.setProps({ + showSorterTooltip: true, + columns: [{ ...column, showSorterTooltip: false }], + }); + wrapper.find('.ant-table-column-sorters').simulate('mouseenter'); + jest.runAllTimers(); + wrapper.update(); + expect(wrapper.find('.ant-tooltip-open').length).toBeFalsy(); + wrapper.find('.ant-table-column-sorters').simulate('mouseout'); + }); + it('works with grouping columns in controlled mode', () => { const columns = [ { diff --git a/components/table/__tests__/__snapshots__/Table.filter.test.js.snap b/components/table/__tests__/__snapshots__/Table.filter.test.js.snap index 2f90b5bddc..8e6c9ba231 100644 --- a/components/table/__tests__/__snapshots__/Table.filter.test.js.snap +++ b/components/table/__tests__/__snapshots__/Table.filter.test.js.snap @@ -508,16 +508,23 @@ exports[`Table.filter renders menu correctly 1`] = `
@@ -605,16 +612,23 @@ exports[`Table.filter renders radio filter correctly 1`] = `
@@ -769,16 +783,23 @@ exports[`Table.filter should support getPopupContainer 1`] = `
@@ -995,16 +1016,23 @@ exports[`Table.filter should support getPopupContainer from ConfigProvider 1`] = diff --git a/components/table/__tests__/__snapshots__/demo.test.js.snap b/components/table/__tests__/__snapshots__/demo.test.js.snap index 9ca189fc23..22704c64fe 100755 --- a/components/table/__tests__/__snapshots__/demo.test.js.snap +++ b/components/table/__tests__/__snapshots__/demo.test.js.snap @@ -12275,6 +12275,396 @@ exports[`renders ./components/table/demo/row-selection-custom.md correctly 1`] = `; +exports[`renders ./components/table/demo/row-selection-custom-debug.md correctly 1`] = ` +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +
+
+ Name +
+ false: + + + Edward King 0 +
+ Another Row +
+ false: + + + Edward King 2 +
+ Another Row +
+ false: + + + Edward King 4 +
+ Another Row +
+ false: + + + Edward King 6 +
+ Another Row +
+ false: + + + Edward King 8 +
+ Another Row +
+
+
+
+ +
+
+
+`; + exports[`renders ./components/table/demo/size.md correctly 1`] = `

diff --git a/components/table/demo/row-selection-custom-debug.md b/components/table/demo/row-selection-custom-debug.md new file mode 100644 index 0000000000..82d212c1d6 --- /dev/null +++ b/components/table/demo/row-selection-custom-debug.md @@ -0,0 +1,50 @@ +--- +order: 99 +title: + en-US: Custom selection group + zh-CN: 自定义选择项组 +debug: true +--- + +## zh-CN + +自定义选项分组。 + +## en-US + +Customize selection group. + +```jsx +import { Table } from 'antd'; + +const columns = [ + { + title: 'Name', + dataIndex: 'name', + }, +]; + +const data = []; +for (let i = 0; i < 46; i++) { + data.push({ + key: i, + name: i % 2 === 0 ? `Edward King ${i}` : 'Another Row', + }); +} + +const App = () => { + const rowSelection = { + renderCell: (checked, record, index, node) => ({ + props: { rowSpan: index % 2 === 0 ? 2 : 0 }, + children: ( + <> + {String(checked)}: {node} + + ), + }), + }; + return ; +}; + +ReactDOM.render(, mountNode); +``` diff --git a/components/table/hooks/useFilter/FilterDropdown.tsx b/components/table/hooks/useFilter/FilterDropdown.tsx index e457e37772..fc2519c5c8 100644 --- a/components/table/hooks/useFilter/FilterDropdown.tsx +++ b/components/table/hooks/useFilter/FilterDropdown.tsx @@ -1,6 +1,7 @@ import * as React from 'react'; import classNames from 'classnames'; import FilterFilled from '@ant-design/icons/FilterFilled'; +import Button from '../../../button'; import Menu from '../../../menu'; import Checkbox from '../../../checkbox'; import Radio from '../../../radio'; @@ -173,6 +174,7 @@ function FilterDropdown(props: FilterDropdownProps) { } else if (column.filterDropdown) { dropdownContent = column.filterDropdown; } else { + const selectedKeys = (getFilteredKeysSync() || []) as any; dropdownContent = ( <> (props: FilterDropdownProps) { onClick={onMenuClick} onSelect={onSelectKeys} onDeselect={onSelectKeys} - selectedKeys={(getFilteredKeysSync() || []) as any} + selectedKeys={selectedKeys} getPopupContainer={getPopupContainer} openKeys={openKeys} onOpenChange={onOpenChange} @@ -190,12 +192,12 @@ function FilterDropdown(props: FilterDropdownProps) { {renderFilterItems(column.filters || [], prefixCls, getFilteredKeysSync(), filterMultiple)} ); diff --git a/components/table/hooks/useSelection.tsx b/components/table/hooks/useSelection.tsx index d7db413e44..fa20fb83df 100644 --- a/components/table/hooks/useSelection.tsx +++ b/components/table/hooks/useSelection.tsx @@ -76,6 +76,7 @@ export default function useSelection( type: selectionType, selections, fixed, + renderCell: customizeRenderCell, } = rowSelection || {}; const { @@ -305,111 +306,132 @@ export default function useSelection( } // Body Cell - let renderCell: (_: RecordType, record: RecordType, index: number) => React.ReactNode; + let renderCell: ( + _: RecordType, + record: RecordType, + index: number, + ) => { node: React.ReactNode; checked: boolean }; if (selectionType === 'radio') { renderCell = (_, record, index) => { const key = getRowKey(record, index); + const checked = keySet.has(key); - return ( - { - if (!keySet.has(key)) { - triggerSingleSelection(key, true, [key], event.nativeEvent); - } - }} - /> - ); + return { + node: ( + { + if (!keySet.has(key)) { + triggerSingleSelection(key, true, [key], event.nativeEvent); + } + }} + /> + ), + checked, + }; }; } else { renderCell = (_, record, index) => { const key = getRowKey(record, index); - const hasKey = keySet.has(key); + const checked = keySet.has(key); // Record checked - return ( - { - const { shiftKey } = nativeEvent; + return { + node: ( + { + const { shiftKey } = nativeEvent; - let startIndex: number = -1; - let endIndex: number = -1; + let startIndex: number = -1; + let endIndex: number = -1; - // Get range of this - if (shiftKey) { - const pointKeys = new Set([lastSelectedKey, key]); + // Get range of this + if (shiftKey) { + const pointKeys = new Set([lastSelectedKey, key]); - recordKeys.some((recordKey, recordIndex) => { - if (pointKeys.has(recordKey)) { - if (startIndex === -1) { - startIndex = recordIndex; - } else { - endIndex = recordIndex; - return true; + recordKeys.some((recordKey, recordIndex) => { + if (pointKeys.has(recordKey)) { + if (startIndex === -1) { + startIndex = recordIndex; + } else { + endIndex = recordIndex; + return true; + } } + + return false; + }); + } + + if (endIndex !== -1 && startIndex !== endIndex) { + // Batch update selections + const rangeKeys = recordKeys.slice(startIndex, endIndex + 1); + const changedKeys: Key[] = []; + + if (checked) { + rangeKeys.forEach(recordKey => { + if (keySet.has(recordKey)) { + changedKeys.push(recordKey); + keySet.delete(recordKey); + } + }); + } else { + rangeKeys.forEach(recordKey => { + if (!keySet.has(recordKey)) { + changedKeys.push(recordKey); + keySet.add(recordKey); + } + }); } - return false; - }); - } - - if (endIndex !== -1 && startIndex !== endIndex) { - // Batch update selections - const rangeKeys = recordKeys.slice(startIndex, endIndex + 1); - const changedKeys: Key[] = []; - - if (hasKey) { - rangeKeys.forEach(recordKey => { - if (keySet.has(recordKey)) { - changedKeys.push(recordKey); - keySet.delete(recordKey); - } - }); + const keys = Array.from(keySet); + setSelectedKeys(keys); + if (onSelectMultiple) { + onSelectMultiple( + !checked, + keys.map(recordKey => getRecordByKey(recordKey)), + changedKeys.map(recordKey => getRecordByKey(recordKey)), + ); + } } else { - rangeKeys.forEach(recordKey => { - if (!keySet.has(recordKey)) { - changedKeys.push(recordKey); - keySet.add(recordKey); - } - }); + // Single record selected + if (checked) { + keySet.delete(key); + } else { + keySet.add(key); + } + + triggerSingleSelection(key, !checked, Array.from(keySet), nativeEvent); } - const keys = Array.from(keySet); - setSelectedKeys(keys); - if (onSelectMultiple) { - onSelectMultiple( - !hasKey, - keys.map(recordKey => getRecordByKey(recordKey)), - changedKeys.map(recordKey => getRecordByKey(recordKey)), - ); - } - } else { - // Single record selected - if (hasKey) { - keySet.delete(key); - } else { - keySet.add(key); - } - - triggerSingleSelection(key, !hasKey, Array.from(keySet), nativeEvent); - } - - setLastSelectedKey(key); - }} - /> - ); + setLastSelectedKey(key); + }} + /> + ), + checked, + }; }; } + const renderSelectionCell = (_: any, record: RecordType, index: number) => { + const { node, checked } = renderCell(_, record, index); + + if (customizeRenderCell) { + return customizeRenderCell(checked, record, index, node); + } + + return node; + }; + // Columns const selectionColumn = { width: selectionColWidth, className: `${prefixCls}-selection-column`, title: rowSelection.columnTitle || title, - render: renderCell, + render: renderSelectionCell, }; if (expandType === 'row' && columns.length && !expandIconColumnIndex) { diff --git a/components/table/hooks/useSorter.tsx b/components/table/hooks/useSorter.tsx index 807f22c5f4..f9bce53f1c 100644 --- a/components/table/hooks/useSorter.tsx +++ b/components/table/hooks/useSorter.tsx @@ -12,9 +12,14 @@ import { CompareFn, ColumnTitleProps, SorterResult, + TableLocale, } from '../interface'; +import Tooltip from '../../tooltip'; import { getColumnKey, getColumnPos, renderColumnTitle } from '../util'; +const ASCEND = 'ascend'; +const DESCEND = 'descend'; + function getMultiplePriority(column: ColumnType): number | false { if (typeof column.sorter === 'object' && typeof column.sorter.multiple === 'number') { return column.sorter.multiple; @@ -91,6 +96,8 @@ function injectSorter( sorterSates: SortState[], triggerSorter: (sorterSates: SortState) => void, defaultSortDirections: SortOrder[], + tableLocale?: TableLocale, + tableShowSorterTooltip?: boolean, pos?: string, ): ColumnsType { return (columns || []).map((column, index) => { @@ -99,53 +106,69 @@ function injectSorter( if (newColumn.sorter) { const sortDirections: SortOrder[] = newColumn.sortDirections || defaultSortDirections; + const showSorterTooltip = + newColumn.showSorterTooltip === undefined + ? tableShowSorterTooltip + : newColumn.showSorterTooltip; const columnKey = getColumnKey(newColumn, columnPos); const sorterState = sorterSates.find(({ key }) => key === columnKey); const sorterOrder = sorterState ? sorterState.sortOrder : null; - - const upNode: React.ReactNode = sortDirections.includes('ascend') && ( + const nextSortOrder = nextSortDirection(sortDirections, sorterOrder); + const upNode: React.ReactNode = sortDirections.includes(ASCEND) && ( ); - const downNode: React.ReactNode = sortDirections.includes('descend') && ( + const downNode: React.ReactNode = sortDirections.includes(DESCEND) && ( ); - + const { cancelSort, triggerAsc, triggerDesc } = tableLocale || {}; + let sortTip: string | undefined = cancelSort; + if (nextSortOrder === DESCEND) { + sortTip = triggerDesc; + } else if (nextSortOrder === ASCEND) { + sortTip = triggerAsc; + } newColumn = { ...newColumn, className: classNames(newColumn.className, { [`${prefixCls}-column-sort`]: sorterOrder }), - title: (renderProps: ColumnTitleProps) => ( -
- {renderColumnTitle(column.title, renderProps)} - - - {upNode} - {downNode} + title: (renderProps: ColumnTitleProps) => { + const renderSortTitle = ( +
+ {renderColumnTitle(column.title, renderProps)} + + + {upNode} + {downNode} + - -
- ), +
+ ); + return showSorterTooltip ? ( + {renderSortTitle} + ) : ( + renderSortTitle + ); + }, onHeaderCell: col => { const cell: React.HTMLAttributes = (column.onHeaderCell && column.onHeaderCell(col)) || {}; const originOnClick = cell.onClick; - cell.onClick = (event: React.MouseEvent) => { triggerSorter({ column, key: columnKey, - sortOrder: nextSortDirection(sortDirections, sorterOrder), + sortOrder: nextSortOrder, multiplePriority: getMultiplePriority(column), }); @@ -170,6 +193,8 @@ function injectSorter( sorterSates, triggerSorter, defaultSortDirections, + tableLocale, + tableShowSorterTooltip, columnPos, ), }; @@ -240,7 +265,7 @@ export function getSortData( const compareResult = compareFn(record1, record2, sortOrder); if (compareResult !== 0) { - return sortOrder === 'ascend' ? compareResult : -compareResult; + return sortOrder === ASCEND ? compareResult : -compareResult; } } } @@ -268,6 +293,8 @@ interface SorterConfig { sortStates: SortState[], ) => void; sortDirections: SortOrder[]; + tableLocale?: TableLocale; + showSorterTooltip?: boolean; } export default function useFilterSorter({ @@ -276,6 +303,8 @@ export default function useFilterSorter({ children, onSorterChange, sortDirections, + tableLocale, + showSorterTooltip, }: SorterConfig): [ TransformColumns, SortState[], @@ -371,7 +400,15 @@ export default function useFilterSorter({ } const transformColumns = (innerColumns: ColumnsType) => - injectSorter(prefixCls, innerColumns, mergedSorterStates, triggerSorter, sortDirections); + injectSorter( + prefixCls, + innerColumns, + mergedSorterStates, + triggerSorter, + sortDirections, + tableLocale, + showSorterTooltip, + ); const getSorters = () => { return generateSorterInfo(mergedSorterStates); diff --git a/components/table/index.en-US.md b/components/table/index.en-US.md index 14e6dfea4d..0ff94d4d8b 100644 --- a/components/table/index.en-US.md +++ b/components/table/index.en-US.md @@ -82,6 +82,7 @@ const columns = [ | onRow | Set props on per row | Function(record, index) | - | | getPopupContainer | the render container of dropdowns in table | (triggerNode) => HTMLElement | `() => TableHtmlElement` | | sortDirections | supported sort way, could be `'ascend'`, `'descend'` | Array | `['ascend', 'descend']` | +| showSorterTooltip | header show next sorter direction tooltip | boolean | `true` | #### onRow usage @@ -138,6 +139,7 @@ One of the Table `columns` prop for describing the table's columns, Column has t | onFilter | Callback executed when the confirm filter button is clicked | Function | - | | onFilterDropdownVisibleChange | Callback executed when `filterDropdownVisible` is changed | function(visible) {} | - | | onHeaderCell | Set props on per header cell | Function(column) | - | +| showSorterTooltip | header show next sorter direction tooltip, override `showSorterTooltip` in table | boolean | `true` | ### ColumnGroup @@ -178,20 +180,21 @@ Properties for expandable. Properties for row selection. -| Property | Description | Type | Default | -| --- | --- | --- | --- | -| columnWidth | Set the width of the selection column | string\|number | `60px` | -| columnTitle | Set the title of the selection column | string\|React.ReactNode | - | -| fixed | Fixed selection column on the left | boolean | - | -| getCheckboxProps | Get Checkbox or Radio props | Function(record) | - | -| hideDefaultSelections | Remove the default `Select All` and `Select Invert` selections when [custom selection](#components-table-demo-row-selection-custom) | boolean | `false` | -| selectedRowKeys | Controlled selected row keys | string\[]\|number[] | \[] | -| selections | Custom selection [config](#rowSelection), only displays default selections when set to `true` | object\[]\|boolean | - | -| type | `checkbox` or `radio` | `checkbox` \| `radio` | `checkbox` | -| onChange | Callback executed when selected rows change | Function(selectedRowKeys, selectedRows) | - | -| onSelect | Callback executed when select/deselect one row | Function(record, selected, selectedRows, nativeEvent) | - | -| onSelectAll | Callback executed when select/deselect all rows | Function(selected, selectedRows, changeRows) | - | -| onSelectInvert | Callback executed when row selection is inverted | Function(selectedRowKeys) | - | +| Property | Description | Type | Default | Version | +| --- | --- | --- | --- | --- | +| columnWidth | Set the width of the selection column | string\|number | `60px` | 4.0 | +| columnTitle | Set the title of the selection column | string\|React.ReactNode | - | 4.0 | +| fixed | Fixed selection column on the left | boolean | - | 4.0 | +| getCheckboxProps | Get Checkbox or Radio props | Function(record) | - | 4.0 | +| hideDefaultSelections | Remove the default `Select All` and `Select Invert` selections when [custom selection](#components-table-demo-row-selection-custom) | boolean | `false` | 4.0 | +| renderCell | Renderer of the table cell. Same as `render` in column | Function(checked, record, index, originNode) {} | - | 4.1 | +| selectedRowKeys | Controlled selected row keys | string\[]\|number[] | \[] | 4.0 | +| selections | Custom selection [config](#rowSelection), only displays default selections when set to `true` | object\[]\|boolean | - | 4.0 | +| type | `checkbox` or `radio` | `checkbox` \| `radio` | `checkbox` | 4.0 | +| onChange | Callback executed when selected rows change | Function(selectedRowKeys, selectedRows) | - | 4.0 | +| onSelect | Callback executed when select/deselect one row | Function(record, selected, selectedRows, nativeEvent) | - | 4.0 | +| onSelectAll | Callback executed when select/deselect all rows | Function(selected, selectedRows, changeRows) | - | 4.0 | +| onSelectInvert | Callback executed when row selection is inverted | Function(selectedRowKeys) | - | 4.0 | ### scroll diff --git a/components/table/index.zh-CN.md b/components/table/index.zh-CN.md index 49e31c820c..f8a39b6d6f 100644 --- a/components/table/index.zh-CN.md +++ b/components/table/index.zh-CN.md @@ -87,6 +87,7 @@ const columns = [ | onRow | 设置行属性 | Function(record, index) | - | | getPopupContainer | 设置表格内各类浮层的渲染节点,如筛选菜单 | (triggerNode) => HTMLElement | `() => TableHtmlElement` | | sortDirections | 支持的排序方式,取值为 `'ascend'` `'descend'` | Array | `['ascend', 'descend']` | +| showSorterTooltip | 表头是否显示下一次排序的 tooltip 提示 | boolean | `true` | #### onRow 用法 @@ -143,6 +144,7 @@ const columns = [ | onFilter | 本地模式下,确定筛选的运行函数 | Function | - | | onFilterDropdownVisibleChange | 自定义筛选菜单可见变化时调用 | function(visible) {} | - | | onHeaderCell | 设置头部单元格属性 | Function(column) | - | +| showSorterTooltip | 表头显示下一次排序的 tooltip 提示, 覆盖 table 中`showSorterTooltip` | boolean | `true` | ### ColumnGroup @@ -183,20 +185,21 @@ const columns = [ 选择功能的配置。 -| 参数 | 说明 | 类型 | 默认值 | -| --- | --- | --- | --- | -| columnWidth | 自定义列表选择框宽度 | string\|number | `60px` | -| columnTitle | 自定义列表选择框标题 | string\|React.ReactNode | - | -| fixed | 把选择框列固定在左边 | boolean | - | -| getCheckboxProps | 选择框的默认属性配置 | Function(record) | - | -| hideDefaultSelections | [自定义选择项](#components-table-demo-row-selection-custom)时去掉『全选』『反选』两个默认选项 | boolean | false | -| selectedRowKeys | 指定选中项的 key 数组,需要和 onChange 进行配合 | string\[]\|number[] | \[] | -| selections | 自定义选择项 [配置项](#selection), 设为 `true` 时使用默认选择项 | object\[]\|boolean | true | -| type | 多选/单选,`checkbox` or `radio` | string | `checkbox` | -| onChange | 选中项发生变化时的回调 | Function(selectedRowKeys, selectedRows) | - | -| onSelect | 用户手动选择/取消选择某行的回调 | Function(record, selected, selectedRows, nativeEvent) | - | -| onSelectAll | 用户手动选择/取消选择所有行的回调 | Function(selected, selectedRows, changeRows) | - | -| onSelectInvert | 用户手动选择反选的回调 | Function(selectedRowKeys) | - | +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| --- | --- | --- | --- | --- | +| columnWidth | 自定义列表选择框宽度 | string\|number | `60px` | 4.0 | +| columnTitle | 自定义列表选择框标题 | string\|React.ReactNode | - | 4.0 | +| fixed | 把选择框列固定在左边 | boolean | - | 4.0 | +| getCheckboxProps | 选择框的默认属性配置 | Function(record) | - | 4.0 | +| hideDefaultSelections | [自定义选择项](#components-table-demo-row-selection-custom)时去掉『全选』『反选』两个默认选项 | boolean | false | 4.0 | +| renderCell | 渲染勾选框,用法与 Column 的 `render` 相同 | Function(checked, record, index, originNode) {} | - | 4.1 | +| selectedRowKeys | 指定选中项的 key 数组,需要和 onChange 进行配合 | string\[]\|number[] | \[] | 4.0 | +| selections | 自定义选择项 [配置项](#selection), 设为 `true` 时使用默认选择项 | object\[]\|boolean | true | 4.0 | +| type | 多选/单选,`checkbox` or `radio` | string | `checkbox` | 4.0 | +| onChange | 选中项发生变化时的回调 | Function(selectedRowKeys, selectedRows) | - | 4.0 | +| onSelect | 用户手动选择/取消选择某行的回调 | Function(record, selected, selectedRows, nativeEvent) | - | 4.0 | +| onSelectAll | 用户手动选择/取消选择所有行的回调 | Function(selected, selectedRows, changeRows) | - | 4.0 | +| onSelectInvert | 用户手动选择反选的回调 | Function(selectedRowKeys) | - | 4.0 | ### scroll diff --git a/components/table/interface.tsx b/components/table/interface.tsx index 640b63d602..1e8de83948 100644 --- a/components/table/interface.tsx +++ b/components/table/interface.tsx @@ -1,4 +1,9 @@ -import { GetRowKey, ColumnType as RcColumnType, ExpandableConfig } from 'rc-table/lib/interface'; +import { + GetRowKey, + ColumnType as RcColumnType, + RenderedCell as RcRenderedCell, + ExpandableConfig, +} from 'rc-table/lib/interface'; import { CheckboxProps } from '../checkbox'; import { PaginationConfig } from '../pagination'; @@ -23,6 +28,9 @@ export interface TableLocale { sortTitle?: string; expand?: string; collapse?: string; + triggerDesc?: string; + triggerAsc?: string; + cancelSort?: string; } export type SortOrder = 'descend' | 'ascend' | null; @@ -74,6 +82,7 @@ export interface ColumnType extends RcColumnType { sortOrder?: SortOrder; defaultSortOrder?: SortOrder; sortDirections?: SortOrder[]; + showSorterTooltip?: boolean; // Filter filtered?: boolean; @@ -126,6 +135,12 @@ export interface TableRowSelection { fixed?: boolean; columnWidth?: string | number; columnTitle?: string | React.ReactNode; + renderCell?: ( + value: boolean, + record: T, + index: number, + originNode: React.ReactNode, + ) => React.ReactNode | RcRenderedCell; } export type TransformColumns = ( diff --git a/components/table/style/index.less b/components/table/style/index.less index a226674ee0..38b7806b88 100644 --- a/components/table/style/index.less +++ b/components/table/style/index.less @@ -195,6 +195,7 @@ // ============================ Sorter ============================ thead th.@{table-prefix-cls}-column-has-sorters { + padding: 0; cursor: pointer; transition: all 0.3s; @@ -217,6 +218,8 @@ &-column-sorters { display: inline-flex; align-items: center; + width: 100%; + padding: @table-padding-vertical @table-padding-horizontal; } &-column-sorter { @@ -333,7 +336,7 @@ box-shadow: none; } - min-width: 96px; + min-width: 120px; background-color: @table-filter-dropdown-bg; border-radius: @border-radius-base; @@ -362,7 +365,7 @@ &-btns { display: flex; justify-content: space-between; - padding: 7px 8px; + padding: 7px 8px 7px 3px; overflow: hidden; background-color: @table-filter-btns-bg; border-top: @border-width-base @border-style-base @border-color-split; diff --git a/components/table/style/index.tsx b/components/table/style/index.tsx index c1ff86a1ad..ef3b1e86b4 100644 --- a/components/table/style/index.tsx +++ b/components/table/style/index.tsx @@ -3,9 +3,11 @@ import './index.less'; // style dependencies // deps-lint-skip: menu +import '../../button/style'; import '../../empty/style'; import '../../radio/style'; import '../../checkbox/style'; import '../../dropdown/style'; import '../../spin/style'; import '../../pagination/style'; +import '../../tooltip/style'; diff --git a/components/time-picker/index.en-US.md b/components/time-picker/index.en-US.md index b5b77c212c..df07827b3e 100644 --- a/components/time-picker/index.en-US.md +++ b/components/time-picker/index.en-US.md @@ -59,6 +59,14 @@ import moment from 'moment'; | blur() | remove focus | | | focus() | get focus | | +### RangePicker + +Same props from [RangePicker](/components/date-picker/#RangePicker) of DatePicker. And includes additional props: + +| Property | Description | Type | Default | Version | +| -------- | ------------------------ | ------- | ------- | ------- | +| order | Order start and end time | boolean | true | 4.1.0 | + ## FAQ diff --git a/components/time-picker/index.tsx b/components/time-picker/index.tsx index abab98d9df..8219b50327 100644 --- a/components/time-picker/index.tsx +++ b/components/time-picker/index.tsx @@ -7,6 +7,11 @@ import { Omit } from '../_util/type'; const { TimePicker: InternalTimePicker, RangePicker: InternalRangePicker } = DatePicker; +export interface TimePickerLocale { + placeholder?: string; + rangePlaceholder?: [string, string]; +} + export interface TimeRangePickerProps extends RangePickerTimeProps {} const RangePicker = React.forwardRef((props, ref) => { diff --git a/components/time-picker/index.zh-CN.md b/components/time-picker/index.zh-CN.md index 845721d4cc..e66e0b3a28 100644 --- a/components/time-picker/index.zh-CN.md +++ b/components/time-picker/index.zh-CN.md @@ -60,6 +60,14 @@ import moment from 'moment'; | blur() | 移除焦点 | | | focus() | 获取焦点 | | +### RangePicker + +属性与 DatePicker 的 [RangePicker](/components/date-picker/#RangePicker) 相同。还包含以下属性: + +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| ----- | -------------------- | ------- | ------ | ----- | +| order | 始末时间是否自动排序 | boolean | true | 4.1.0 | + ## FAQ diff --git a/components/time-picker/locale/ar_EG.tsx b/components/time-picker/locale/ar_EG.tsx index 48ba68e078..8656103750 100644 --- a/components/time-picker/locale/ar_EG.tsx +++ b/components/time-picker/locale/ar_EG.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'اختيار الوقت', }; diff --git a/components/time-picker/locale/az_AZ.tsx b/components/time-picker/locale/az_AZ.tsx index 1cc47f4a2a..d1944d9195 100644 --- a/components/time-picker/locale/az_AZ.tsx +++ b/components/time-picker/locale/az_AZ.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Vaxtı seç', }; diff --git a/components/time-picker/locale/bg_BG.tsx b/components/time-picker/locale/bg_BG.tsx index e6896fe4a6..62c0ba8125 100644 --- a/components/time-picker/locale/bg_BG.tsx +++ b/components/time-picker/locale/bg_BG.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Избор на час', }; diff --git a/components/time-picker/locale/ca_ES.tsx b/components/time-picker/locale/ca_ES.tsx index cfd60a8b93..f0a9e8780a 100644 --- a/components/time-picker/locale/ca_ES.tsx +++ b/components/time-picker/locale/ca_ES.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Seleccionar hora', }; diff --git a/components/time-picker/locale/cs_CZ.tsx b/components/time-picker/locale/cs_CZ.tsx index 5c89f7affc..907efd2220 100644 --- a/components/time-picker/locale/cs_CZ.tsx +++ b/components/time-picker/locale/cs_CZ.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Vybrat čas', }; diff --git a/components/time-picker/locale/da_DK.tsx b/components/time-picker/locale/da_DK.tsx index b3e966e6ba..6fe3131473 100644 --- a/components/time-picker/locale/da_DK.tsx +++ b/components/time-picker/locale/da_DK.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Vælg tid', }; diff --git a/components/time-picker/locale/de_DE.tsx b/components/time-picker/locale/de_DE.tsx index c912e9e8fb..d343e86b02 100644 --- a/components/time-picker/locale/de_DE.tsx +++ b/components/time-picker/locale/de_DE.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Zeit auswählen', }; diff --git a/components/time-picker/locale/el_GR.tsx b/components/time-picker/locale/el_GR.tsx index 2c0dea51f1..e7828f2d61 100644 --- a/components/time-picker/locale/el_GR.tsx +++ b/components/time-picker/locale/el_GR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Επιλέξτε ώρα', }; diff --git a/components/time-picker/locale/en_GB.tsx b/components/time-picker/locale/en_GB.tsx index b95b5a3625..7f4b5b42f5 100644 --- a/components/time-picker/locale/en_GB.tsx +++ b/components/time-picker/locale/en_GB.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Select time', }; diff --git a/components/time-picker/locale/en_US.tsx b/components/time-picker/locale/en_US.tsx index 47a00e8353..14e181f9e9 100644 --- a/components/time-picker/locale/en_US.tsx +++ b/components/time-picker/locale/en_US.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Select time', rangePlaceholder: ['Start time', 'End time'], }; diff --git a/components/time-picker/locale/es_ES.tsx b/components/time-picker/locale/es_ES.tsx index cfd60a8b93..f0a9e8780a 100644 --- a/components/time-picker/locale/es_ES.tsx +++ b/components/time-picker/locale/es_ES.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Seleccionar hora', }; diff --git a/components/time-picker/locale/et_EE.tsx b/components/time-picker/locale/et_EE.tsx index 7ebc008d0d..7ded47e07e 100644 --- a/components/time-picker/locale/et_EE.tsx +++ b/components/time-picker/locale/et_EE.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Vali aeg', }; diff --git a/components/time-picker/locale/fa_IR.tsx b/components/time-picker/locale/fa_IR.tsx index 0dcc5d924b..ff818509d2 100644 --- a/components/time-picker/locale/fa_IR.tsx +++ b/components/time-picker/locale/fa_IR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'انتخاب زمان', }; diff --git a/components/time-picker/locale/fi_FI.tsx b/components/time-picker/locale/fi_FI.tsx index 6c4d9a1228..8c689a94d8 100644 --- a/components/time-picker/locale/fi_FI.tsx +++ b/components/time-picker/locale/fi_FI.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Valitse aika', }; diff --git a/components/time-picker/locale/fr_BE.tsx b/components/time-picker/locale/fr_BE.tsx index decc193733..52bbeda32d 100644 --- a/components/time-picker/locale/fr_BE.tsx +++ b/components/time-picker/locale/fr_BE.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: "Sélectionner l'heure", }; diff --git a/components/time-picker/locale/fr_FR.tsx b/components/time-picker/locale/fr_FR.tsx index decc193733..52bbeda32d 100644 --- a/components/time-picker/locale/fr_FR.tsx +++ b/components/time-picker/locale/fr_FR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: "Sélectionner l'heure", }; diff --git a/components/time-picker/locale/he_IL.tsx b/components/time-picker/locale/he_IL.tsx index 6f0cf1a31f..0eb8256579 100644 --- a/components/time-picker/locale/he_IL.tsx +++ b/components/time-picker/locale/he_IL.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'בחר שעה', }; diff --git a/components/time-picker/locale/hi_IN.tsx b/components/time-picker/locale/hi_IN.tsx index 9daaecf3ab..04967ec584 100644 --- a/components/time-picker/locale/hi_IN.tsx +++ b/components/time-picker/locale/hi_IN.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'समय का चयन करें', }; diff --git a/components/time-picker/locale/hr_HR.tsx b/components/time-picker/locale/hr_HR.tsx index 06096123de..647fef34c8 100644 --- a/components/time-picker/locale/hr_HR.tsx +++ b/components/time-picker/locale/hr_HR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Odaberite vrijeme', }; diff --git a/components/time-picker/locale/hu_HU.tsx b/components/time-picker/locale/hu_HU.tsx index 404d13ebd7..63696d67c7 100644 --- a/components/time-picker/locale/hu_HU.tsx +++ b/components/time-picker/locale/hu_HU.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Válasszon időt', }; diff --git a/components/time-picker/locale/id_ID.tsx b/components/time-picker/locale/id_ID.tsx index 92c81ffe17..aefffb16ef 100644 --- a/components/time-picker/locale/id_ID.tsx +++ b/components/time-picker/locale/id_ID.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Pilih waktu', }; diff --git a/components/time-picker/locale/is_IS.tsx b/components/time-picker/locale/is_IS.tsx index 6a5994a281..1d1d73bca2 100644 --- a/components/time-picker/locale/is_IS.tsx +++ b/components/time-picker/locale/is_IS.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Velja tíma', }; diff --git a/components/time-picker/locale/it_IT.tsx b/components/time-picker/locale/it_IT.tsx index b9dd24e3b2..0666ba6e30 100644 --- a/components/time-picker/locale/it_IT.tsx +++ b/components/time-picker/locale/it_IT.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: "Selezionare l'orario", }; diff --git a/components/time-picker/locale/ja_JP.tsx b/components/time-picker/locale/ja_JP.tsx index 366344d418..484618a96b 100644 --- a/components/time-picker/locale/ja_JP.tsx +++ b/components/time-picker/locale/ja_JP.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: '時刻を選択', }; diff --git a/components/time-picker/locale/kn_IN.tsx b/components/time-picker/locale/kn_IN.tsx index 7d54cd70c2..4819666c73 100644 --- a/components/time-picker/locale/kn_IN.tsx +++ b/components/time-picker/locale/kn_IN.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'ಸಮಯ ಆಯ್ಕೆಮಾಡಿ', }; diff --git a/components/time-picker/locale/ko_KR.tsx b/components/time-picker/locale/ko_KR.tsx index fad0ffd8c5..0c40763432 100644 --- a/components/time-picker/locale/ko_KR.tsx +++ b/components/time-picker/locale/ko_KR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: '날짜 선택', }; diff --git a/components/time-picker/locale/ku_IQ.tsx b/components/time-picker/locale/ku_IQ.tsx index 838b1958dc..a02ab860d0 100755 --- a/components/time-picker/locale/ku_IQ.tsx +++ b/components/time-picker/locale/ku_IQ.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Demê hilbijêre', }; diff --git a/components/time-picker/locale/lv_LV.tsx b/components/time-picker/locale/lv_LV.tsx index 5e3890e7b8..1b8776f323 100644 --- a/components/time-picker/locale/lv_LV.tsx +++ b/components/time-picker/locale/lv_LV.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Izvēlieties laiku', }; diff --git a/components/time-picker/locale/mk_MK.tsx b/components/time-picker/locale/mk_MK.tsx index b5b355ccfc..a952dd98cf 100644 --- a/components/time-picker/locale/mk_MK.tsx +++ b/components/time-picker/locale/mk_MK.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Избери време', }; diff --git a/components/time-picker/locale/mn_MN.tsx b/components/time-picker/locale/mn_MN.tsx index 70f5486111..a5e19333d8 100644 --- a/components/time-picker/locale/mn_MN.tsx +++ b/components/time-picker/locale/mn_MN.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Цаг сонгох', }; diff --git a/components/time-picker/locale/ms_MY.tsx b/components/time-picker/locale/ms_MY.tsx index 2e66160ff8..369f5c6ab8 100644 --- a/components/time-picker/locale/ms_MY.tsx +++ b/components/time-picker/locale/ms_MY.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Sila pilih masa', }; diff --git a/components/time-picker/locale/nb_NO.tsx b/components/time-picker/locale/nb_NO.tsx index dfc0d96e92..42efca5a20 100644 --- a/components/time-picker/locale/nb_NO.tsx +++ b/components/time-picker/locale/nb_NO.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Velg tid', }; diff --git a/components/time-picker/locale/nl_BE.tsx b/components/time-picker/locale/nl_BE.tsx index 7318ca9f6e..873056b6aa 100644 --- a/components/time-picker/locale/nl_BE.tsx +++ b/components/time-picker/locale/nl_BE.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Selecteer tijd', }; diff --git a/components/time-picker/locale/nl_NL.tsx b/components/time-picker/locale/nl_NL.tsx index 7318ca9f6e..873056b6aa 100644 --- a/components/time-picker/locale/nl_NL.tsx +++ b/components/time-picker/locale/nl_NL.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Selecteer tijd', }; diff --git a/components/time-picker/locale/pl_PL.tsx b/components/time-picker/locale/pl_PL.tsx index bd48f4f681..81d1f4ced5 100644 --- a/components/time-picker/locale/pl_PL.tsx +++ b/components/time-picker/locale/pl_PL.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Wybierz godzinę', }; diff --git a/components/time-picker/locale/pt_BR.tsx b/components/time-picker/locale/pt_BR.tsx index ed0247e106..ae6627072c 100644 --- a/components/time-picker/locale/pt_BR.tsx +++ b/components/time-picker/locale/pt_BR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Hora', }; diff --git a/components/time-picker/locale/pt_PT.tsx b/components/time-picker/locale/pt_PT.tsx index ed0247e106..ae6627072c 100644 --- a/components/time-picker/locale/pt_PT.tsx +++ b/components/time-picker/locale/pt_PT.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Hora', }; diff --git a/components/time-picker/locale/ro_RO.tsx b/components/time-picker/locale/ro_RO.tsx index d6ad6c1616..e6c1635cc8 100644 --- a/components/time-picker/locale/ro_RO.tsx +++ b/components/time-picker/locale/ro_RO.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Selectează ora', }; diff --git a/components/time-picker/locale/ru_RU.tsx b/components/time-picker/locale/ru_RU.tsx index 0490573e73..0b97fc658c 100644 --- a/components/time-picker/locale/ru_RU.tsx +++ b/components/time-picker/locale/ru_RU.tsx @@ -1,7 +1,9 @@ /** * Created by Andrey Gayvoronsky on 13/04/16. */ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Выберите время', }; diff --git a/components/time-picker/locale/sk_SK.tsx b/components/time-picker/locale/sk_SK.tsx index 4c62d104b6..6a1299f262 100644 --- a/components/time-picker/locale/sk_SK.tsx +++ b/components/time-picker/locale/sk_SK.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Vybrať čas', }; diff --git a/components/time-picker/locale/sl_SI.tsx b/components/time-picker/locale/sl_SI.tsx index 1d77c9a5be..7450339b6c 100644 --- a/components/time-picker/locale/sl_SI.tsx +++ b/components/time-picker/locale/sl_SI.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Izberite čas', }; diff --git a/components/time-picker/locale/sr_RS.tsx b/components/time-picker/locale/sr_RS.tsx index ef621a0d7e..aa8dd8f3d2 100644 --- a/components/time-picker/locale/sr_RS.tsx +++ b/components/time-picker/locale/sr_RS.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Izaberite vreme', }; diff --git a/components/time-picker/locale/sv_SE.tsx b/components/time-picker/locale/sv_SE.tsx index 063c46b785..97b3b923f0 100644 --- a/components/time-picker/locale/sv_SE.tsx +++ b/components/time-picker/locale/sv_SE.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Välj tid', }; diff --git a/components/time-picker/locale/ta_IN.tsx b/components/time-picker/locale/ta_IN.tsx index e549c9ad11..0471f00a4a 100644 --- a/components/time-picker/locale/ta_IN.tsx +++ b/components/time-picker/locale/ta_IN.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'நேரத்தைத் தேர்ந்தெடுக்கவும்', }; diff --git a/components/time-picker/locale/th_TH.tsx b/components/time-picker/locale/th_TH.tsx index 335e55e014..fadebd1a69 100644 --- a/components/time-picker/locale/th_TH.tsx +++ b/components/time-picker/locale/th_TH.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'เลือกเวลา', }; diff --git a/components/time-picker/locale/tr_TR.tsx b/components/time-picker/locale/tr_TR.tsx index 66f860dca2..fea8f00a9e 100644 --- a/components/time-picker/locale/tr_TR.tsx +++ b/components/time-picker/locale/tr_TR.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Zaman Seç', }; diff --git a/components/time-picker/locale/uk_UA.tsx b/components/time-picker/locale/uk_UA.tsx index 20a81cc535..1c7b6cfa52 100644 --- a/components/time-picker/locale/uk_UA.tsx +++ b/components/time-picker/locale/uk_UA.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Оберіть час', }; diff --git a/components/time-picker/locale/vi_VN.tsx b/components/time-picker/locale/vi_VN.tsx index 05dff1df55..f7722b3ce5 100644 --- a/components/time-picker/locale/vi_VN.tsx +++ b/components/time-picker/locale/vi_VN.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: 'Chọn thời gian', }; diff --git a/components/time-picker/locale/zh_CN.tsx b/components/time-picker/locale/zh_CN.tsx index 531b71cf52..e1f427a5ab 100644 --- a/components/time-picker/locale/zh_CN.tsx +++ b/components/time-picker/locale/zh_CN.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: '请选择时间', rangePlaceholder: ['开始时间', '结束时间'], }; diff --git a/components/time-picker/locale/zh_TW.tsx b/components/time-picker/locale/zh_TW.tsx index cde48a9199..74bdf6dd8d 100644 --- a/components/time-picker/locale/zh_TW.tsx +++ b/components/time-picker/locale/zh_TW.tsx @@ -1,4 +1,6 @@ -const locale = { +import { TimePickerLocale } from '../index'; + +const locale: TimePickerLocale = { placeholder: '請選擇時間', }; diff --git a/components/tree-select/index.en-US.md b/components/tree-select/index.en-US.md index 60748e8e90..926c98cdac 100644 --- a/components/tree-select/index.en-US.md +++ b/components/tree-select/index.en-US.md @@ -22,7 +22,7 @@ Tree selection control. | defaultValue | To set the initial selected treeNode(s). | string\|string\[] | - | | | disabled | Disabled or not | boolean | false | | | dropdownClassName | className of dropdown menu | string | - | | -| dropdownMatchSelectWidth | Determine whether the dropdown menu and the select input are the same width. Default set `min-width` same as input. | boolean | true | | +| dropdownMatchSelectWidth | Determine whether the dropdown menu and the select input are the same width. Default set `min-width` same as input. `false` will disable virtual scroll | boolean \| number | true | | | dropdownStyle | To set the style of the dropdown menu | object | - | | | filterTreeNode | Whether to filter treeNodes by input value. The value of `treeNodeFilterProp` is used for filtering by default. | boolean\|Function(inputValue: string, treeNode: TreeNode) (should return boolean) | Function | | | getPopupContainer | To set the container of the dropdown menu. The default is to create a `div` element in `body`, you can reset it to the scrolling area and make a relative reposition. [example](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body | | @@ -49,6 +49,7 @@ Tree selection control. | treeNodeFilterProp | Will be used for filtering if `filterTreeNode` returns true | string | 'value' | | | treeNodeLabelProp | Will render as content of select | string | 'title' | | | value | To set the current selected treeNode(s). | string\|string\[] | - | | +| virtual | Disable virtual scroll when set to `false` | boolean | - | 4.1.0 | | onChange | A callback function, can be executed when selected treeNodes or input value change | function(value, label, extra) | - | | | onSearch | A callback function, can be executed when the search input changes. | function(value: string) | - | | | onSelect | A callback function, can be executed when you select a treeNode. | function(value, node, extra) | - | | diff --git a/components/tree-select/index.zh-CN.md b/components/tree-select/index.zh-CN.md index 5ed5bfabca..8a5e3a33df 100644 --- a/components/tree-select/index.zh-CN.md +++ b/components/tree-select/index.zh-CN.md @@ -23,7 +23,7 @@ title: TreeSelect | defaultValue | 指定默认选中的条目 | string/string\[] | - | | | disabled | 是否禁用 | boolean | false | | | dropdownClassName | 下拉菜单的 className 属性 | string | - | | -| dropdownMatchSelectWidth | 下拉菜单和选择器同宽。默认将设置 `min-width`。 | boolean | true | | +| dropdownMatchSelectWidth | 下拉菜单和选择器同宽。默认将设置 `min-width`。`false` 时会关闭虚拟滚动 | boolean \| number | true | | | dropdownStyle | 下拉菜单的样式 | object | - | | | filterTreeNode | 是否根据输入项进行筛选,默认用 treeNodeFilterProp 的值作为要筛选的 TreeNode 的属性值 | boolean\|Function(inputValue: string, treeNode: TreeNode) (函数需要返回 bool 值) | Function | | | getPopupContainer | 菜单渲染父节点。默认渲染到 body 上,如果你遇到菜单滚动定位问题,试试修改为滚动的区域,并相对其定位。[示例](https://codepen.io/afc163/pen/zEjNOy?editors=0010) | Function(triggerNode) | () => document.body | | @@ -50,6 +50,7 @@ title: TreeSelect | treeNodeFilterProp | 输入项过滤对应的 treeNode 属性 | string | 'value' | | | treeNodeLabelProp | 作为显示的 prop 设置 | string | 'title' | | | value | 指定当前选中的条目 | string/string\[] | - | | +| virtual | 设置 `false` 时关闭虚拟滚动 | boolean | - | 4.1.0 | | onChange | 选中树节点时调用此函数 | function(value, label, extra) | - | | | onSearch | 文本框值变化时回调 | function(value: string) | - | | | onSelect | 被选中时调用 | function(value, node, extra) | - | | diff --git a/components/tree/index.en-US.md b/components/tree/index.en-US.md index 00e70adc4c..054b560763 100644 --- a/components/tree/index.en-US.md +++ b/components/tree/index.en-US.md @@ -14,42 +14,43 @@ Almost anything can be represented in a tree structure. Examples include directo ### Tree props -| Property | Description | Type | Default | -| --- | --- | --- | --- | -| autoExpandParent | Whether to automatically expand a parent treeNode | boolean | true | -| blockNode | Whether treeNode fill remaining horizontal space | boolean | false | -| checkable | Adds a `Checkbox` before the treeNodes | boolean | false | -| checkedKeys | (Controlled) Specifies the keys of the checked treeNodes (PS: When this specifies the key of a treeNode which is also a parent treeNode, all the children treeNodes of will be checked; and vice versa, when it specifies the key of a treeNode which is a child treeNode, its parent treeNode will also be checked. When `checkable` and `checkStrictly` is true, its object has `checked` and `halfChecked` property. Regardless of whether the child or parent treeNode is checked, they won't impact each other. | string\[] \| {checked: string\[], halfChecked: string\[]} | \[] | -| checkStrictly | Check treeNode precisely; parent treeNode and children treeNodes are not associated | boolean | false | -| defaultCheckedKeys | Specifies the keys of the default checked treeNodes | string\[] | \[] | -| defaultExpandAll | Whether to expand all treeNodes by default | boolean | false | -| defaultExpandedKeys | Specify the keys of the default expanded treeNodes | string\[] | \[] | -| defaultExpandParent | auto expand parent treeNodes when init | bool | true | -| defaultSelectedKeys | Specifies the keys of the default selected treeNodes | string\[] | \[] | -| disabled | whether disabled the tree | bool | false | -| draggable | Specifies whether this Tree is draggable (IE > 8) | boolean | false | -| expandedKeys | (Controlled) Specifies the keys of the expanded treeNodes | string\[] | \[] | -| filterTreeNode | Defines a function to filter (highlight) treeNodes. When the function returns `true`, the corresponding treeNode will be highlighted | function(node) | - | -| loadData | Load data asynchronously | function(node) | - | -| loadedKeys | (Controlled) Set loaded tree nodes. Need work with `loadData` | string\[] | \[] | -| multiple | Allows selecting multiple treeNodes | boolean | false | -| selectable | whether can be selected | boolean | true | -| selectedKeys | (Controlled) Specifies the keys of the selected treeNodes | string\[] | - | -| showIcon | Shows the icon before a TreeNode's title. There is no default style; you must set a custom style for it if set to `true` | boolean | false | -| switcherIcon | customize collapse/expand icon of tree node | React.ReactElement | - | -| showLine | Shows a connecting line | boolean | false | -| onCheck | Callback function for when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event, halfCheckedKeys}) | - | -| onDragEnd | Callback function for when the onDragEnd event occurs | function({event, node}) | - | -| onDragEnter | Callback function for when the onDragEnter event occurs | function({event, node, expandedKeys}) | - | -| onDragLeave | Callback function for when the onDragLeave event occurs | function({event, node}) | - | -| onDragOver | Callback function for when the onDragOver event occurs | function({event, node}) | - | -| onDragStart | Callback function for when the onDragStart event occurs | function({event, node}) | - | -| onDrop | Callback function for when the onDrop event occurs | function({event, node, dragNode, dragNodesKeys}) | - | -| onExpand | Callback function for when a treeNode is expanded or collapsed | function(expandedKeys, {expanded: bool, node}) | - | -| onLoad | Callback function for when a treeNode is loaded | function(loadedKeys, {event, node}) | - | -| onRightClick | Callback function for when the user right clicks a treeNode | function({event, node}) | - | -| onSelect | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - | -| treeData | treeNodes data Array, if set it then you need not to construct children TreeNode. (key should be unique across the whole array) | array\<{ key, title, children, \[disabled, selectable] }> | - | +| Property | Description | Type | Default | Version | +| --- | --- | --- | --- | --- | +| autoExpandParent | Whether to automatically expand a parent treeNode | boolean | true | | +| blockNode | Whether treeNode fill remaining horizontal space | boolean | false | | +| checkable | Adds a `Checkbox` before the treeNodes | boolean | false | | +| checkedKeys | (Controlled) Specifies the keys of the checked treeNodes (PS: When this specifies the key of a treeNode which is also a parent treeNode, all the children treeNodes of will be checked; and vice versa, when it specifies the key of a treeNode which is a child treeNode, its parent treeNode will also be checked. When `checkable` and `checkStrictly` is true, its object has `checked` and `halfChecked` property. Regardless of whether the child or parent treeNode is checked, they won't impact each other. | string\[] \| {checked: string\[], halfChecked: string\[]} | \[] | | +| checkStrictly | Check treeNode precisely; parent treeNode and children treeNodes are not associated | boolean | false | | +| defaultCheckedKeys | Specifies the keys of the default checked treeNodes | string\[] | \[] | | +| defaultExpandAll | Whether to expand all treeNodes by default | boolean | false | | +| defaultExpandedKeys | Specify the keys of the default expanded treeNodes | string\[] | \[] | | +| defaultExpandParent | auto expand parent treeNodes when init | bool | true | | +| defaultSelectedKeys | Specifies the keys of the default selected treeNodes | string\[] | \[] | | +| disabled | whether disabled the tree | bool | false | | +| draggable | Specifies whether this Tree is draggable (IE > 8) | boolean | false | | +| expandedKeys | (Controlled) Specifies the keys of the expanded treeNodes | string\[] | \[] | | +| filterTreeNode | Defines a function to filter (highlight) treeNodes. When the function returns `true`, the corresponding treeNode will be highlighted | function(node) | - | | +| loadData | Load data asynchronously | function(node) | - | | +| loadedKeys | (Controlled) Set loaded tree nodes. Need work with `loadData` | string\[] | \[] | | +| multiple | Allows selecting multiple treeNodes | boolean | false | | +| selectable | whether can be selected | boolean | true | | +| selectedKeys | (Controlled) Specifies the keys of the selected treeNodes | string\[] | - | | +| showIcon | Shows the icon before a TreeNode's title. There is no default style; you must set a custom style for it if set to `true` | boolean | false | | +| switcherIcon | customize collapse/expand icon of tree node | React.ReactElement | - | | +| showLine | Shows a connecting line | boolean | false | | +| treeData | treeNodes data Array, if set it then you need not to construct children TreeNode. (key should be unique across the whole array) | array\<{ key, title, children, \[disabled, selectable] }> | - | | +| virtual | Disable virtual scroll when set to `false` | boolean | - | 4.1.0 | +| onCheck | Callback function for when the onCheck event occurs | function(checkedKeys, e:{checked: bool, checkedNodes, node, event, halfCheckedKeys}) | - | | +| onDragEnd | Callback function for when the onDragEnd event occurs | function({event, node}) | - | | +| onDragEnter | Callback function for when the onDragEnter event occurs | function({event, node, expandedKeys}) | - | | +| onDragLeave | Callback function for when the onDragLeave event occurs | function({event, node}) | - | | +| onDragOver | Callback function for when the onDragOver event occurs | function({event, node}) | - | | +| onDragStart | Callback function for when the onDragStart event occurs | function({event, node}) | - | | +| onDrop | Callback function for when the onDrop event occurs | function({event, node, dragNode, dragNodesKeys}) | - | | +| onExpand | Callback function for when a treeNode is expanded or collapsed | function(expandedKeys, {expanded: bool, node}) | - | | +| onLoad | Callback function for when a treeNode is loaded | function(loadedKeys, {event, node}) | - | | +| onRightClick | Callback function for when the user right clicks a treeNode | function({event, node}) | - | | +| onSelect | Callback function for when the user clicks a treeNode | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - | | ### TreeNode props diff --git a/components/tree/index.zh-CN.md b/components/tree/index.zh-CN.md index 722be5abf4..505d3f237f 100644 --- a/components/tree/index.zh-CN.md +++ b/components/tree/index.zh-CN.md @@ -15,42 +15,43 @@ subtitle: 树形控件 ### Tree props -| 参数 | 说明 | 类型 | 默认值 | -| --- | --- | --- | --- | -| autoExpandParent | 是否自动展开父节点 | boolean | true | -| blockNode | 是否节点占据一行 | boolean | false | -| checkable | 节点前添加 Checkbox 复选框 | boolean | false | -| checkedKeys | (受控)选中复选框的树节点(注意:父子节点有关联,如果传入父节点 key,则子节点自动选中;相应当子节点 key 都传入,父节点也自动选中。当设置`checkable`和`checkStrictly`,它是一个有`checked`和`halfChecked`属性的对象,并且父子节点的选中与否不再关联 | string\[] \| {checked: string\[], halfChecked: string\[]} | \[] | -| checkStrictly | checkable 状态下节点选择完全受控(父子节点选中状态不再关联) | boolean | false | -| defaultCheckedKeys | 默认选中复选框的树节点 | string\[] | \[] | -| defaultExpandAll | 默认展开所有树节点 | boolean | false | -| defaultExpandedKeys | 默认展开指定的树节点 | string\[] | \[] | -| defaultExpandParent | 默认展开父节点 | bool | true | -| defaultSelectedKeys | 默认选中的树节点 | string\[] | \[] | -| disabled | 将树禁用 | bool | false | -| draggable | 设置节点可拖拽(IE>8) | boolean | false | -| expandedKeys | (受控)展开指定的树节点 | string\[] | \[] | -| filterTreeNode | 按需筛选树节点(高亮),返回 true | function(node) | - | -| loadData | 异步加载数据 | function(node) | - | -| loadedKeys | (受控)已经加载的节点,需要配合 `loadData` 使用 | string\[] | \[] | -| multiple | 支持点选多个节点(节点本身) | boolean | false | -| selectable | 是否可选中 | boolean | true | -| selectedKeys | (受控)设置选中的树节点 | string\[] | - | -| showIcon | 是否展示 TreeNode title 前的图标,没有默认样式,如设置为 true,需要自行定义图标相关样式 | boolean | false | -| switcherIcon | 自定义树节点的展开/折叠图标 | React.ReactElement | - | -| showLine | 是否展示连接线 | boolean | false | -| onCheck | 点击复选框触发 | function(checkedKeys, e:{checked: bool, checkedNodes, node, event, halfCheckedKeys}) | - | -| onDragEnd | dragend 触发时调用 | function({event, node}) | - | -| onDragEnter | dragenter 触发时调用 | function({event, node, expandedKeys}) | - | -| onDragLeave | dragleave 触发时调用 | function({event, node}) | - | -| onDragOver | dragover 触发时调用 | function({event, node}) | - | -| onDragStart | 开始拖拽时调用 | function({event, node}) | - | -| onDrop | drop 触发时调用 | function({event, node, dragNode, dragNodesKeys}) | - | -| onExpand | 展开/收起节点时触发 | function(expandedKeys, {expanded: bool, node}) | - | -| onLoad | 节点加载完毕时触发 | function(loadedKeys, {event, node}) | - | -| onRightClick | 响应右键点击 | function({event, node}) | - | -| onSelect | 点击树节点触发 | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - | -| treeData | treeNodes 数据,如果设置则不需要手动构造 TreeNode 节点(key 在整个树范围内唯一) | array\<{key, title, children, \[disabled, selectable]}> | - | +| 参数 | 说明 | 类型 | 默认值 | 版本 | +| --- | --- | --- | --- | --- | +| autoExpandParent | 是否自动展开父节点 | boolean | true | | +| blockNode | 是否节点占据一行 | boolean | false | | +| checkable | 节点前添加 Checkbox 复选框 | boolean | false | | +| checkedKeys | (受控)选中复选框的树节点(注意:父子节点有关联,如果传入父节点 key,则子节点自动选中;相应当子节点 key 都传入,父节点也自动选中。当设置`checkable`和`checkStrictly`,它是一个有`checked`和`halfChecked`属性的对象,并且父子节点的选中与否不再关联 | string\[] \| {checked: string\[], halfChecked: string\[]} | \[] | | +| checkStrictly | checkable 状态下节点选择完全受控(父子节点选中状态不再关联) | boolean | false | | +| defaultCheckedKeys | 默认选中复选框的树节点 | string\[] | \[] | | +| defaultExpandAll | 默认展开所有树节点 | boolean | false | | +| defaultExpandedKeys | 默认展开指定的树节点 | string\[] | \[] | | +| defaultExpandParent | 默认展开父节点 | bool | true | | +| defaultSelectedKeys | 默认选中的树节点 | string\[] | \[] | | +| disabled | 将树禁用 | bool | false | | +| draggable | 设置节点可拖拽(IE>8) | boolean | false | | +| expandedKeys | (受控)展开指定的树节点 | string\[] | \[] | | +| filterTreeNode | 按需筛选树节点(高亮),返回 true | function(node) | - | | +| loadData | 异步加载数据 | function(node) | - | | +| loadedKeys | (受控)已经加载的节点,需要配合 `loadData` 使用 | string\[] | \[] | | +| multiple | 支持点选多个节点(节点本身) | boolean | false | | +| selectable | 是否可选中 | boolean | true | | +| selectedKeys | (受控)设置选中的树节点 | string\[] | - | | +| showIcon | 是否展示 TreeNode title 前的图标,没有默认样式,如设置为 true,需要自行定义图标相关样式 | boolean | false | | +| switcherIcon | 自定义树节点的展开/折叠图标 | React.ReactElement | - | | +| showLine | 是否展示连接线 | boolean | false | | +| treeData | treeNodes 数据,如果设置则不需要手动构造 TreeNode 节点(key 在整个树范围内唯一) | array\<{key, title, children, \[disabled, selectable]}> | - | | +| virtual | 设置 `false` 时关闭虚拟滚动 | boolean | - | 4.1.0 | +| onCheck | 点击复选框触发 | function(checkedKeys, e:{checked: bool, checkedNodes, node, event, halfCheckedKeys}) | - | | +| onDragEnd | dragend 触发时调用 | function({event, node}) | - | | +| onDragEnter | dragenter 触发时调用 | function({event, node, expandedKeys}) | - | | +| onDragLeave | dragleave 触发时调用 | function({event, node}) | - | | +| onDragOver | dragover 触发时调用 | function({event, node}) | - | | +| onDragStart | 开始拖拽时调用 | function({event, node}) | - | | +| onDrop | drop 触发时调用 | function({event, node, dragNode, dragNodesKeys}) | - | | +| onExpand | 展开/收起节点时触发 | function(expandedKeys, {expanded: bool, node}) | - | | +| onLoad | 节点加载完毕时触发 | function(loadedKeys, {event, node}) | - | | +| onRightClick | 响应右键点击 | function({event, node}) | - | | +| onSelect | 点击树节点触发 | function(selectedKeys, e:{selected: bool, selectedNodes, node, event}) | - | | ### TreeNode props diff --git a/components/typography/Base.tsx b/components/typography/Base.tsx index f46e21b2f5..1f7aea2010 100644 --- a/components/typography/Base.tsx +++ b/components/typography/Base.tsx @@ -40,7 +40,7 @@ interface EllipsisConfig { rows?: number; expandable?: boolean; suffix?: string; - onExpand?: () => void; + onExpand?: React.MouseEventHandler; } export interface BlockProps extends TypographyProps { @@ -165,13 +165,13 @@ class Base extends React.Component { + // =============== Expand =============== + onExpandClick: React.MouseEventHandler = e => { const { onExpand } = this.getEllipsis(); this.setState({ expanded: true }); if (onExpand) { - onExpand(); + (onExpand as React.MouseEventHandler)(e); } }; diff --git a/components/typography/index.en-US.md b/components/typography/index.en-US.md index f3bbb18d54..9505e00316 100644 --- a/components/typography/index.en-US.md +++ b/components/typography/index.en-US.md @@ -39,7 +39,7 @@ Basic text writing, including headings, body text, lists, and more. | delete | Deleted line style | boolean | false | | | disabled | Disabled content | boolean | false | | | editable | Editable. Can control edit state when is object | boolean \| { editing: boolean, onStart: Function, onChange: Function(string) } | false | | -| ellipsis | Display ellipsis when text overflows. Can configure rows and expandable by using object | boolean \| { rows: number, expandable: boolean, onExpand: Function } | false | | +| ellipsis | Display ellipsis when text overflows. Can configure rows and expandable by using object | boolean \| { rows: number, expandable: boolean, onExpand: Function(event) } | false | | | level | Set content importance. Match with `h1`, `h2`, `h3`, `h4` | number: `1`, `2`, `3`, `4` | 1 | | | mark | Marked style | boolean | false | | | underline | Underlined style | boolean | false | | @@ -55,7 +55,7 @@ Basic text writing, including headings, body text, lists, and more. | delete | Deleted line style | boolean | false | | | disabled | Disabled content | boolean | false | | | editable | Editable. Can control edit state when is object | boolean \| { editing: boolean, onStart: Function, onChange: Function(string) } | false | | -| ellipsis | Display ellipsis when text overflows. Can configure rows expandable and suffix by using object | boolean \| { rows: number, expandable: boolean suffix: string, onExpand: Function } | false | | +| ellipsis | Display ellipsis when text overflows. Can configure rows expandable and suffix by using object | boolean \| { rows: number, expandable: boolean suffix: string, onExpand: Function(event) } | false | | | mark | Marked style | boolean | false | | | underline | Underlined style | boolean | false | | | onChange | Trigger when user edits the content | Function(string) | - | | diff --git a/package.json b/package.json index 6c66b6ffd1..c1732a502c 100644 --- a/package.json +++ b/package.json @@ -113,29 +113,29 @@ "rc-dialog": "~7.6.0", "rc-drawer": "~3.1.1", "rc-dropdown": "~3.0.0", - "rc-field-form": "~1.0.0", + "rc-field-form": "~1.1.0", "rc-input-number": "~4.5.4", "rc-mentions": "~1.0.0", "rc-menu": "~8.0.1", "rc-notification": "~4.0.0", "rc-pagination": "~2.0.1", - "rc-picker": "~1.1.0", + "rc-picker": "~1.3.0", "rc-progress": "~2.5.0", "rc-rate": "~2.5.1", "rc-resize-observer": "^0.1.0", - "rc-select": "~10.0.0", + "rc-select": "~10.1.0", "rc-slider": "~9.2.3", "rc-steps": "~3.5.0", "rc-switch": "~1.9.0", "rc-table": "~7.3.0", "rc-tabs": "~10.0.0", "rc-tooltip": "~4.0.2", - "rc-tree": "~3.0.0", - "rc-tree-select": "~3.0.0", + "rc-tree": "~3.1.0", + "rc-tree-select": "~3.1.0", "rc-trigger": "~4.0.0", "rc-upload": "~3.0.0", "rc-util": "^4.20.0", - "rc-virtual-list": "~1.0.0", + "rc-virtual-list": "^1.1.0", "resize-observer-polyfill": "^1.5.1", "scroll-into-view-if-needed": "^2.2.20", "warning": "~4.0.3" diff --git a/tests/__snapshots__/index.test.js.snap b/tests/__snapshots__/index.test.js.snap index 64a70bcbc4..64ac53e671 100644 --- a/tests/__snapshots__/index.test.js.snap +++ b/tests/__snapshots__/index.test.js.snap @@ -27,6 +27,7 @@ Array [ "Drawer", "Empty", "Form", + "Grid", "Input", "InputNumber", "Layout",