From 7b4d1d28d71998df63a523b546d3b16c33256c5f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A1ndor=20Bal=C3=A1zs?= Date: Tue, 11 Apr 2017 10:52:51 +0200 Subject: [PATCH 1/2] react-widgets: add disabled, readonly, dropUp --- types/react-widgets/index.d.ts | 2 +- types/react-widgets/lib/Calendar.d.ts | 9 ++----- types/react-widgets/lib/Combobox.d.ts | 19 ++----------- types/react-widgets/lib/CommonProps.d.ts | 30 +++++++++++++++++++++ types/react-widgets/lib/DateTimePicker.d.ts | 9 ++----- types/react-widgets/lib/DropdownList.d.ts | 18 ++----------- types/react-widgets/lib/Multiselect.d.ts | 20 ++------------ types/react-widgets/lib/NumberPicker.d.ts | 10 ++----- types/react-widgets/lib/SelectList.d.ts | 20 ++------------ types/react-widgets/react-widgets-tests.tsx | 9 +++++++ 10 files changed, 54 insertions(+), 92 deletions(-) create mode 100644 types/react-widgets/lib/CommonProps.d.ts diff --git a/types/react-widgets/index.d.ts b/types/react-widgets/index.d.ts index 9db30eb706..6326212c63 100644 --- a/types/react-widgets/index.d.ts +++ b/types/react-widgets/index.d.ts @@ -1,6 +1,6 @@ // Type definitions for react-widgets v3.2.1 // Project: https://github.com/jquense/react-widgets -// Definitions by: Rogier Schouten +// Definitions by: Rogier Schouten , Balázs Sándor // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.1 diff --git a/types/react-widgets/lib/Calendar.d.ts b/types/react-widgets/lib/Calendar.d.ts index 16922ca797..1f68410dd9 100644 --- a/types/react-widgets/lib/Calendar.d.ts +++ b/types/react-widgets/lib/Calendar.d.ts @@ -1,6 +1,7 @@ import * as React from 'react'; +import {ReactWidgetsCommonProps} from './CommonProps'; -interface CalendarProps extends React.Props{ +interface CalendarProps extends ReactWidgetsCommonProps{ /** * The current selected date, should be a Date object or null. */ @@ -97,12 +98,6 @@ interface CalendarProps extends React.Props{ * 1900 - 1999. */ centuryFormat?: string | ((day: Date) => string); - /** - * Mark whether the widget should render right-to-left. This property can also be implicitly - * passed to the widget through a childContext prop (isRtl) this allows higher level - * application components to specify the direction. - */ - isRtl?: boolean; messages?: CalendarMessages; } diff --git a/types/react-widgets/lib/Combobox.d.ts b/types/react-widgets/lib/Combobox.d.ts index 3b60ed9e18..79ac6272ec 100644 --- a/types/react-widgets/lib/Combobox.d.ts +++ b/types/react-widgets/lib/Combobox.d.ts @@ -1,4 +1,5 @@ import * as React from 'react'; +import {ReactWidgetsCommonDropdownProps} from './CommonProps'; interface ComboBoxMessages { /** @@ -15,7 +16,7 @@ interface ComboBoxMessages { emptyFilter: string | ((props: ComboBoxProps) => string); } -interface ComboBoxProps extends React.Props { +interface ComboBoxProps extends ReactWidgetsCommonDropdownProps { /** * The current value of the Combobox. This can be an object (such as a member of the data * array) or a primitive value, hinted to by the valueField. The widget value does not need @@ -62,16 +63,6 @@ interface ComboBoxProps extends React.Props { * component renders the text of the selected item (specified by textfield) */ itemComponent?: React.ReactType; - /** - * Disable the widget, if an Array of values is passed in only those values will be - * disabled. - */ - disabled?: boolean | any[]; - /** - * Place the Combobox in a read-only mode, If an Array of values is passed in only those - * values will be read-only. - */ - readOnly?: boolean | any[]; /** * Determines how to group the Combobox. Providing a string will group the data array by * that property. You can also provide a function which should return the group value. @@ -127,12 +118,6 @@ interface ComboBoxProps extends React.Props { * The speed, in milliseconds, of the dropdown animation. */ duration?: number; - /** - * mark whether the widget should render right-to-left. This property can also be implicitly - * passed to the widget through a childContext prop (isRtl) this allows higher level - * application components to specify the direction. - */ - isRtl?: boolean; /** * Object hash containing display text and/or text for screen readers. Use the messages * object to localize widget text and increase accessibility. diff --git a/types/react-widgets/lib/CommonProps.d.ts b/types/react-widgets/lib/CommonProps.d.ts new file mode 100644 index 0000000000..2547a579a8 --- /dev/null +++ b/types/react-widgets/lib/CommonProps.d.ts @@ -0,0 +1,30 @@ +import * as React from 'react'; + +interface ReactWidgetsCommonProps extends React.Props { + /** + * Disable the widget, if an Array of values is passed in only those values will be disabled. + * @default false + */ + disabled?: boolean | any[]; + /** + * Place the widget in a read-only mode, If an Array of values is passed in only those + * values will be read-only. + * @default false + */ + readOnly?: boolean | any[]; + /** + * Mark whether the SelectList should render right-to-left. This property can also be + * implicitly passed to the widget through a childContext prop (isRtl) this allows higher + * level application components to specify the direction. + * @default false + */ + isRtl?: boolean; +} + +interface ReactWidgetsCommonDropdownProps extends ReactWidgetsCommonProps { + /** + * Show "drop up" not "drop down" + * @default false + */ + dropUp?: boolean; +} diff --git a/types/react-widgets/lib/DateTimePicker.d.ts b/types/react-widgets/lib/DateTimePicker.d.ts index 0760648984..87f95a15e9 100644 --- a/types/react-widgets/lib/DateTimePicker.d.ts +++ b/types/react-widgets/lib/DateTimePicker.d.ts @@ -1,6 +1,7 @@ import * as React from 'react'; +import {ReactWidgetsCommonDropdownProps} from './CommonProps'; -interface DateTimePickerProps extends React.Props { +interface DateTimePickerProps extends ReactWidgetsCommonDropdownProps { /** * Whether to show the date picker button. * @default true @@ -116,12 +117,6 @@ interface DateTimePickerProps extends React.Props { * The speed, in milliseconds, of the either dropdown animation. */ duration?: number; - /** - * Mark whether the widget should render right-to-left. This property can also be implicitly - * passed to the widget through a childContext prop (isRtl) this allows higher level - * application components to specify the direction. - */ - isRtl?: boolean; /** * Object hash containing display text and/or text for screen readers. Use the messages * object to localize widget text and increase accessibility. diff --git a/types/react-widgets/lib/DropdownList.d.ts b/types/react-widgets/lib/DropdownList.d.ts index 52a8e83a99..b0aebc1de8 100644 --- a/types/react-widgets/lib/DropdownList.d.ts +++ b/types/react-widgets/lib/DropdownList.d.ts @@ -1,6 +1,7 @@ import * as React from 'react'; +import {ReactWidgetsCommonDropdownProps} from './CommonProps'; -interface DropdownListProps extends React.Props { +interface DropdownListProps extends ReactWidgetsCommonDropdownProps { /** * The current value of the DropdownList. This can be an object (such as a member of the * data array) or a primitive value, hinted to by the valueField. The widget value does not @@ -50,15 +51,6 @@ interface DropdownListProps extends React.Props { * component renders the text of the selected item (specified by textfield) */ itemComponent?: React.ReactType; - /** - * Disable the widget, if an Array of values is passed in only those values will be disabled. - */ - disabled?: boolean | any[]; - /** - * Place the DropdownList in a read-only mode, If an Array of values is passed in only those - * values will be read-only. - */ - readOnly?: boolean | any[]; /** * Determines how to group the DropdownList. Providing a string will group the data array by * that property. You can also provide a function which should return the group value. @@ -131,12 +123,6 @@ interface DropdownListProps extends React.Props { * @default 250 */ duration?: number; - /** - * Mark whether the widget should render right-to-left. This property can also be implicitly - * passed to the widget through a childContext prop (isRtl) this allows higher level - * application components to specify the direction. - */ - isRtl?: boolean; /** * Object hash containing display text and/or text for screen readers. Use the messages * object to localize widget text and increase accessibility. diff --git a/types/react-widgets/lib/Multiselect.d.ts b/types/react-widgets/lib/Multiselect.d.ts index 65b3394330..0b528dd14c 100644 --- a/types/react-widgets/lib/Multiselect.d.ts +++ b/types/react-widgets/lib/Multiselect.d.ts @@ -1,6 +1,7 @@ import * as React from 'react'; +import {ReactWidgetsCommonDropdownProps} from './CommonProps'; -interface MultiselectProps extends React.Props { +interface MultiselectProps extends ReactWidgetsCommonDropdownProps { /** * The current values of the Multiselect. The value should can null, or an array of * valueField values, or an array of objects (such as a few items in the data array) @@ -127,23 +128,6 @@ interface MultiselectProps extends React.Props { * @default 250 */ duration?: number; - /** - * Disable the widget, If an Array of values is passed in only the tags specified will be - * disabled. - */ - disabled?: boolean | any[]; - /** - * Place the widget in a readonly mode, If an Array of values is passed in only the tags - * specified will be readonly. - */ - readOnly?: boolean | any[]; - /** - * Mark whether the widget should render right-to-left. This property can also be implicitly - * passed to the widget through a childContext prop (isRtl) this allows higher level - * application components to specify the direction. - * @default false - */ - isRtl?: boolean; /** * Object hash containing display text and/or text for screen readers. Use the messages * object to localize widget text and increase accessibility. diff --git a/types/react-widgets/lib/NumberPicker.d.ts b/types/react-widgets/lib/NumberPicker.d.ts index b66dcdeeca..59f46ee3c1 100644 --- a/types/react-widgets/lib/NumberPicker.d.ts +++ b/types/react-widgets/lib/NumberPicker.d.ts @@ -1,6 +1,7 @@ import * as React from 'react'; +import {ReactWidgetsCommonProps} from './CommonProps'; -interface NumberPickerProps extends React.Props{ +interface NumberPickerProps extends ReactWidgetsCommonProps{ /** * The current value of the NumberPicker. */ @@ -45,13 +46,6 @@ interface NumberPickerProps extends React.Props{ * value. When empty, precision is parsed from the current format and culture. */ precision?: number; - /** - * Mark whether the widget should render right-to-left. This property can also be implicitly - * passed to the widget through a childContext prop (isRtl) this allows higher level - * application components to specify the direction. - * @default false - */ - isRtl?: boolean; /** * Object hash containing display text and/or text for screen readers. Use the messages * object to localize widget text and increase accessibility. diff --git a/types/react-widgets/lib/SelectList.d.ts b/types/react-widgets/lib/SelectList.d.ts index a425589b12..ca925898c6 100644 --- a/types/react-widgets/lib/SelectList.d.ts +++ b/types/react-widgets/lib/SelectList.d.ts @@ -1,6 +1,7 @@ import * as React from 'react'; +import {ReactWidgetsCommonProps} from './CommonProps'; -interface SelectListProps extends React.Props{ +interface SelectListProps extends ReactWidgetsCommonProps{ /** * The current value or values of the SelectList. This can be an object (such as a member of * the data array) or a primitive value, hinted to by the valueField. The widget value does @@ -71,23 +72,6 @@ interface SelectListProps extends React.Props{ * @default false */ busy?: boolean; - /** - * Disable the widget, if an Array of values is passed in only those values will be - * disabled. - */ - disabled?: boolean | any[]; - /** - * Place the SelectList in a read-only mode, If an Array of values is passed in only those - * values will be read-only. - */ - readOnly?: boolean | any[]; - /** - * Mark whether the SelectList should render right-to-left. This property can also be - * implicitly passed to the widget through a childContext prop (isRtl) this allows higher - * level application components to specify the direction. - * @default false - */ - isRtl?: boolean; /** * Object hash containing display text and/or text for screen readers. Use the messages * object to localize widget text and increase accessibility. diff --git a/types/react-widgets/react-widgets-tests.tsx b/types/react-widgets/react-widgets-tests.tsx index 0f66458c36..156a639408 100644 --- a/types/react-widgets/react-widgets-tests.tsx +++ b/types/react-widgets/react-widgets-tests.tsx @@ -46,6 +46,15 @@ class Test extends React.Component, {}> { itemComponent={itemComponent} /> +
+ + + + + + + +
) } From 9fd17d98ff3ecae91c1e870eeed310a71530ea9d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?S=C3=A1ndor=20Bal=C3=A1zs?= Date: Tue, 11 Apr 2017 11:13:22 +0200 Subject: [PATCH 2/2] react-widgets: add tslint.json --- types/react-widgets/react-widgets-tests.tsx | 12 +++++------- types/react-widgets/tslint.json | 1 + 2 files changed, 6 insertions(+), 7 deletions(-) create mode 100644 types/react-widgets/tslint.json diff --git a/types/react-widgets/react-widgets-tests.tsx b/types/react-widgets/react-widgets-tests.tsx index 156a639408..8efd554299 100644 --- a/types/react-widgets/react-widgets-tests.tsx +++ b/types/react-widgets/react-widgets-tests.tsx @@ -1,7 +1,7 @@ -import * as React from "react" -import * as ReactDOM from "react-dom" +import * as React from "react"; +import * as ReactDOM from "react-dom"; -import { Calendar, Combobox, DateTimePicker, DropdownList, Multiselect, NumberPicker, SelectList } from "react-widgets" +import { Calendar, Combobox, DateTimePicker, DropdownList, Multiselect, NumberPicker, SelectList } from "react-widgets"; function tagComponent(props: { value: string }) { return {props.value}; @@ -12,7 +12,6 @@ function itemComponent(props: { value: string }) { } class Test extends React.Component, {}> { - render() { return (
@@ -56,7 +55,6 @@ class Test extends React.Component, {}> {
- ) + ); } - -} \ No newline at end of file +} diff --git a/types/react-widgets/tslint.json b/types/react-widgets/tslint.json new file mode 100644 index 0000000000..2221e40e4a --- /dev/null +++ b/types/react-widgets/tslint.json @@ -0,0 +1 @@ +{ "extends": "../tslint.json" } \ No newline at end of file