Do not omit the anyFunctionType from intersections (#35658)
* Do not omit the anyFunctionType from intersections * Move check into isEmptyResolvedType
This commit is contained in:
Wesley Wigham
GitHub
parent
d044e0680a
commit
88677de380
|
|
@ -14410,7 +14410,8 @@ namespace ts {
|
|||
}
|
||||
|
||||
function isEmptyResolvedType(t: ResolvedType) {
|
||||
return t.properties.length === 0 &&
|
||||
return t !== anyFunctionType &&
|
||||
t.properties.length === 0 &&
|
||||
t.callSignatures.length === 0 &&
|
||||
t.constructSignatures.length === 0 &&
|
||||
!t.stringIndexInfo &&
|
||||
|
|
|
|||
|
|
@ -0,0 +1,636 @@
|
|||
//// [jsxComplexSignatureHasApplicabilityError.tsx]
|
||||
/// <reference path="/.lib/react16.d.ts" />
|
||||
|
||||
import * as React from "react";
|
||||
|
||||
|
||||
interface Props<T extends OptionValues> {
|
||||
value?: Option<T> | T;
|
||||
onChange?(value: Option<T> | undefined): void;
|
||||
}
|
||||
|
||||
type ExtractValueType<T> = T extends ReactSelectProps<infer U> ? U : never;
|
||||
|
||||
export type ReactSingleSelectProps<
|
||||
WrappedProps extends ReactSelectProps<any>
|
||||
> = Overwrite<
|
||||
Omit<WrappedProps, "multi">,
|
||||
Props<ExtractValueType<WrappedProps>>
|
||||
>;
|
||||
|
||||
export function createReactSingleSelect<
|
||||
WrappedProps extends ReactSelectProps<any>
|
||||
>(
|
||||
WrappedComponent: React.ComponentType<WrappedProps>
|
||||
): React.ComponentType<ReactSingleSelectProps<WrappedProps>> {
|
||||
return (props) => {
|
||||
return (
|
||||
<ReactSelectClass<ExtractValueType<WrappedProps>>
|
||||
{...props}
|
||||
multi={false}
|
||||
autosize={false}
|
||||
value={props.value}
|
||||
onChange={(value) => {
|
||||
if (props.onChange) {
|
||||
props.onChange(value === null ? undefined : value);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// Copied from "type-zoo" version 3.4.0
|
||||
export type Omit<T, K extends keyof any> = T extends any ? Pick<T, Exclude<keyof T, K>> : never;
|
||||
export type Overwrite<T, U> = Omit<T, keyof T & keyof U> & U;
|
||||
|
||||
// Everything below here copied from "@types/react-select" version 1.3.4
|
||||
declare class ReactSelectClass<TValue = OptionValues> extends React.Component<ReactSelectProps<TValue>> {
|
||||
focus(): void;
|
||||
setValue(value: Option<TValue>): void;
|
||||
}
|
||||
|
||||
export type OptionComponentType<TValue = OptionValues> = React.ComponentType<OptionComponentProps<TValue>>;
|
||||
export type ValueComponentType<TValue = OptionValues> = React.ComponentType<ValueComponentProps<TValue>>;
|
||||
|
||||
export type HandlerRendererResult = JSX.Element | null | false;
|
||||
|
||||
// Handlers
|
||||
export type FocusOptionHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
export type SelectValueHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
export type ArrowRendererHandler = (props: ArrowRendererProps) => HandlerRendererResult;
|
||||
export type ClearRendererHandler = () => HandlerRendererResult;
|
||||
export type FilterOptionHandler<TValue = OptionValues> = (option: Option<TValue>, filter: string) => boolean;
|
||||
export type FilterOptionsHandler<TValue = OptionValues> = (options: Options<TValue>, filter: string, currentValues: Options<TValue>) => Options<TValue>;
|
||||
export type InputRendererHandler = (props: { [key: string]: any }) => HandlerRendererResult;
|
||||
export type MenuRendererHandler<TValue = OptionValues> = (props: MenuRendererProps<TValue>) => HandlerRendererResult;
|
||||
export type OnCloseHandler = () => void;
|
||||
export type OnInputChangeHandler = (inputValue: string) => string;
|
||||
export type OnInputKeyDownHandler = React.KeyboardEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
export type OnMenuScrollToBottomHandler = () => void;
|
||||
export type OnOpenHandler = () => void;
|
||||
export type OnFocusHandler = React.FocusEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
export type OnBlurHandler = React.FocusEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
export type OptionRendererHandler<TValue = OptionValues> = (option: Option<TValue>) => HandlerRendererResult;
|
||||
export type ValueRendererHandler<TValue = OptionValues> = (option: Option<TValue>, index?: number) => HandlerRendererResult;
|
||||
export type OnValueClickHandler<TValue = OptionValues> = (option: Option<TValue>, event: React.MouseEvent<HTMLAnchorElement>) => void;
|
||||
export type IsOptionUniqueHandler<TValue = OptionValues> = (arg: { option: Option<TValue>, options: Options<TValue>, labelKey: string, valueKey: string }) => boolean;
|
||||
export type IsValidNewOptionHandler = (arg: { label: string }) => boolean;
|
||||
export type NewOptionCreatorHandler<TValue = OptionValues> = (arg: { label: string, labelKey: string, valueKey: string }) => Option<TValue>;
|
||||
export type PromptTextCreatorHandler = (filterText: string) => string;
|
||||
export type ShouldKeyDownEventCreateNewOptionHandler = (arg: { keyCode: number }) => boolean;
|
||||
|
||||
export type OnChangeSingleHandler<TValue = OptionValues> = OnChangeHandler<TValue, Option<TValue>>;
|
||||
export type OnChangeMultipleHandler<TValue = OptionValues> = OnChangeHandler<TValue, Options<TValue>>;
|
||||
export type OnChangeHandler<TValue = OptionValues, TOption = Option<TValue> | Options<TValue>> = (newValue: TOption | null) => void;
|
||||
export type OnNewOptionClickHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
|
||||
export type LoadOptionsHandler<TValue = OptionValues> = LoadOptionsAsyncHandler<TValue> | LoadOptionsLegacyHandler<TValue>;
|
||||
export type LoadOptionsAsyncHandler<TValue = OptionValues> = (input: string) => Promise<AutocompleteResult<TValue>>;
|
||||
export type LoadOptionsLegacyHandler<TValue = OptionValues> = (input: string, callback: (err: any, result: AutocompleteResult<TValue>) => void) => void;
|
||||
|
||||
export interface AutocompleteResult<TValue = OptionValues> {
|
||||
/** The search-results to be displayed */
|
||||
options: Options<TValue>;
|
||||
/**
|
||||
* Should be set to true, if and only if a longer query with the same prefix
|
||||
* would return a subset of the results
|
||||
* If set to true, more specific queries will not be sent to the server.
|
||||
*/
|
||||
complete: boolean;
|
||||
}
|
||||
|
||||
export type Options<TValue = OptionValues> = Array<Option<TValue>>;
|
||||
|
||||
export interface Option<TValue = OptionValues> {
|
||||
/** Text for rendering */
|
||||
label?: string;
|
||||
/** Value for searching */
|
||||
value?: TValue;
|
||||
/**
|
||||
* Allow this option to be cleared
|
||||
* @default true
|
||||
*/
|
||||
clearableValue?: boolean;
|
||||
/**
|
||||
* Do not allow this option to be selected
|
||||
* @default false
|
||||
*/
|
||||
disabled?: boolean;
|
||||
/**
|
||||
* In the event that a custom menuRenderer is provided, Option should be able
|
||||
* to accept arbitrary key-value pairs. See react-virtualized-select.
|
||||
*/
|
||||
[property: string]: any;
|
||||
}
|
||||
|
||||
export type OptionValues = string | number | boolean;
|
||||
|
||||
export interface MenuRendererProps<TValue = OptionValues> {
|
||||
/**
|
||||
* The currently focused option; should be visible in the menu by default.
|
||||
* default {}
|
||||
*/
|
||||
focusedOption: Option<TValue>;
|
||||
|
||||
/**
|
||||
* Callback to focus a new option; receives the option as a parameter.
|
||||
*/
|
||||
focusOption: FocusOptionHandler<TValue>;
|
||||
|
||||
/**
|
||||
* Option labels are accessible with this string key.
|
||||
*/
|
||||
labelKey: string;
|
||||
|
||||
/**
|
||||
* Ordered array of options to render.
|
||||
*/
|
||||
options: Options<TValue>;
|
||||
|
||||
/**
|
||||
* Callback to select a new option; receives the option as a parameter.
|
||||
*/
|
||||
selectValue: SelectValueHandler<TValue>;
|
||||
|
||||
/**
|
||||
* Array of currently selected options.
|
||||
*/
|
||||
valueArray: Options<TValue>;
|
||||
|
||||
/**
|
||||
* Callback to remove selection from option; receives the option as a parameter.
|
||||
*/
|
||||
removeValue: SelectValueHandler<TValue>;
|
||||
|
||||
/**
|
||||
* function which returns a custom way to render the options in the menu
|
||||
*/
|
||||
optionRenderer: OptionRendererHandler<TValue>;
|
||||
}
|
||||
|
||||
export interface OptionComponentProps<TValue = OptionValues> {
|
||||
/**
|
||||
* Classname(s) to apply to the option component.
|
||||
*/
|
||||
className?: string;
|
||||
|
||||
/**
|
||||
* Currently focused option.
|
||||
*/
|
||||
focusOption?: Option<TValue>;
|
||||
|
||||
inputValue?: string;
|
||||
instancePrefix?: string;
|
||||
|
||||
/**
|
||||
* True if this option is disabled.
|
||||
*/
|
||||
isDisabled?: boolean;
|
||||
|
||||
/**
|
||||
* True if this option is focused.
|
||||
*/
|
||||
isFocused?: boolean;
|
||||
|
||||
/**
|
||||
* True if this option is selected.
|
||||
*/
|
||||
isSelected?: boolean;
|
||||
|
||||
/**
|
||||
* Callback to be invoked when this option is focused.
|
||||
*/
|
||||
onFocus?: (option: Option<TValue>, event: any) => void;
|
||||
|
||||
/**
|
||||
* Callback to be invoked when this option is selected.
|
||||
*/
|
||||
onSelect?: (option: Option<TValue>, event: any) => void;
|
||||
|
||||
/**
|
||||
* Option to be rendered by this component.
|
||||
*/
|
||||
option: Option<TValue>;
|
||||
|
||||
/**
|
||||
* Index of the option being rendered in the list
|
||||
*/
|
||||
optionIndex?: number;
|
||||
|
||||
/**
|
||||
* Callback to invoke when removing an option from a multi-selection. (Not necessarily the one
|
||||
* being rendered)
|
||||
*/
|
||||
removeValue?: (value: TValue | TValue[]) => void;
|
||||
|
||||
/**
|
||||
* Callback to invoke to select an option. (Not necessarily the one being rendered)
|
||||
*/
|
||||
selectValue?: (value: TValue | TValue[]) => void;
|
||||
}
|
||||
|
||||
export interface ArrowRendererProps {
|
||||
/**
|
||||
* Arrow mouse down event handler.
|
||||
*/
|
||||
onMouseDown: React.MouseEventHandler<any>;
|
||||
|
||||
/**
|
||||
* whether the Select is open or not.
|
||||
*/
|
||||
isOpen: boolean;
|
||||
}
|
||||
|
||||
export interface ValueComponentProps<TValue = OptionValues> {
|
||||
disabled: ReactSelectProps<TValue>['disabled'];
|
||||
id: string;
|
||||
instancePrefix: string;
|
||||
onClick: OnValueClickHandler<TValue> | null;
|
||||
onRemove?: SelectValueHandler<TValue>;
|
||||
placeholder: ReactSelectProps<TValue>['placeholder'];
|
||||
value: Option<TValue>;
|
||||
values?: Array<Option<TValue>>;
|
||||
}
|
||||
|
||||
export interface ReactSelectProps<TValue = OptionValues> extends React.Props<ReactSelectClass<TValue>> {
|
||||
/**
|
||||
* text to display when `allowCreate` is true.
|
||||
* @default 'Add "{label}"?'
|
||||
*/
|
||||
addLabelText?: string;
|
||||
/**
|
||||
* renders a custom drop-down arrow to be shown in the right-hand side of the select.
|
||||
* @default undefined
|
||||
*/
|
||||
arrowRenderer?: ArrowRendererHandler | null;
|
||||
/**
|
||||
* blurs the input element after a selection has been made. Handy for lowering the keyboard on mobile devices.
|
||||
* @default false
|
||||
*/
|
||||
autoBlur?: boolean;
|
||||
/**
|
||||
* autofocus the component on mount
|
||||
* @deprecated. Use autoFocus instead
|
||||
* @default false
|
||||
*/
|
||||
autofocus?: boolean;
|
||||
/**
|
||||
* autofocus the component on mount
|
||||
* @default false
|
||||
*/
|
||||
autoFocus?: boolean;
|
||||
/**
|
||||
* If enabled, the input will expand as the length of its value increases
|
||||
*/
|
||||
autosize?: boolean;
|
||||
/**
|
||||
* whether pressing backspace removes the last item when there is no input value
|
||||
* @default true
|
||||
*/
|
||||
backspaceRemoves?: boolean;
|
||||
/**
|
||||
* Message to use for screenreaders to press backspace to remove the current item
|
||||
* {label} is replaced with the item label
|
||||
* @default "Press backspace to remove..."
|
||||
*/
|
||||
backspaceToRemoveMessage?: string;
|
||||
/**
|
||||
* CSS className for the outer element
|
||||
*/
|
||||
className?: string;
|
||||
/**
|
||||
* Prefix prepended to element default className if no className is defined
|
||||
*/
|
||||
classNamePrefix?: string;
|
||||
/**
|
||||
* title for the "clear" control when `multi` is true
|
||||
* @default "Clear all"
|
||||
*/
|
||||
clearAllText?: string;
|
||||
/**
|
||||
* Renders a custom clear to be shown in the right-hand side of the select when clearable true
|
||||
* @default undefined
|
||||
*/
|
||||
clearRenderer?: ClearRendererHandler;
|
||||
/**
|
||||
* title for the "clear" control
|
||||
* @default "Clear value"
|
||||
*/
|
||||
clearValueText?: string;
|
||||
/**
|
||||
* whether to close the menu when a value is selected
|
||||
* @default true
|
||||
*/
|
||||
closeOnSelect?: boolean;
|
||||
/**
|
||||
* whether it is possible to reset value. if enabled, an X button will appear at the right side.
|
||||
* @default true
|
||||
*/
|
||||
clearable?: boolean;
|
||||
/**
|
||||
* whether backspace removes an item if there is no text input
|
||||
* @default true
|
||||
*/
|
||||
deleteRemoves?: boolean;
|
||||
/**
|
||||
* delimiter to use to join multiple values
|
||||
* @default ","
|
||||
*/
|
||||
delimiter?: string;
|
||||
/**
|
||||
* whether the Select is disabled or not
|
||||
* @default false
|
||||
*/
|
||||
disabled?: boolean;
|
||||
/**
|
||||
* whether escape clears the value when the menu is closed
|
||||
* @default true
|
||||
*/
|
||||
escapeClearsValue?: boolean;
|
||||
/**
|
||||
* method to filter a single option
|
||||
*/
|
||||
filterOption?: FilterOptionHandler<TValue>;
|
||||
/**
|
||||
* method to filter the options array
|
||||
*/
|
||||
filterOptions?: FilterOptionsHandler<TValue>;
|
||||
/**
|
||||
* id for the underlying HTML input element
|
||||
* @default undefined
|
||||
*/
|
||||
id?: string;
|
||||
/**
|
||||
* whether to strip diacritics when filtering
|
||||
* @default true
|
||||
*/
|
||||
ignoreAccents?: boolean;
|
||||
/**
|
||||
* whether to perform case-insensitive filtering
|
||||
* @default true
|
||||
*/
|
||||
ignoreCase?: boolean;
|
||||
/**
|
||||
* custom attributes for the Input (in the Select-control) e.g: {'data-foo': 'bar'}
|
||||
* @default {}
|
||||
*/
|
||||
inputProps?: { [key: string]: any };
|
||||
/**
|
||||
* renders a custom input
|
||||
*/
|
||||
inputRenderer?: InputRendererHandler;
|
||||
/**
|
||||
* allows for synchronization of component id's on server and client.
|
||||
* @see https://github.com/JedWatson/react-select/pull/1105
|
||||
*/
|
||||
instanceId?: string;
|
||||
/**
|
||||
* whether the Select is loading externally or not (such as options being loaded).
|
||||
* if true, a loading spinner will be shown at the right side.
|
||||
* @default false
|
||||
*/
|
||||
isLoading?: boolean;
|
||||
/**
|
||||
* (legacy mode) joins multiple values into a single form field with the delimiter
|
||||
* @default false
|
||||
*/
|
||||
joinValues?: boolean;
|
||||
/**
|
||||
* the option property to use for the label
|
||||
* @default "label"
|
||||
*/
|
||||
labelKey?: string;
|
||||
/**
|
||||
* (any, start) match the start or entire string when filtering
|
||||
* @default "any"
|
||||
*/
|
||||
matchPos?: string;
|
||||
/**
|
||||
* (any, label, value) which option property to filter on
|
||||
* @default "any"
|
||||
*/
|
||||
matchProp?: string;
|
||||
/**
|
||||
* buffer of px between the base of the dropdown and the viewport to shift if menu doesnt fit in viewport
|
||||
* @default 0
|
||||
*/
|
||||
menuBuffer?: number;
|
||||
/**
|
||||
* optional style to apply to the menu container
|
||||
*/
|
||||
menuContainerStyle?: React.CSSProperties;
|
||||
/**
|
||||
* renders a custom menu with options
|
||||
*/
|
||||
menuRenderer?: MenuRendererHandler<TValue>;
|
||||
/**
|
||||
* optional style to apply to the menu
|
||||
*/
|
||||
menuStyle?: React.CSSProperties;
|
||||
/**
|
||||
* multi-value input
|
||||
* @default false
|
||||
*/
|
||||
multi?: boolean;
|
||||
/**
|
||||
* field name, for hidden `<input>` tag
|
||||
*/
|
||||
name?: string;
|
||||
/**
|
||||
* placeholder displayed when there are no matching search results or a falsy value to hide it
|
||||
* @default "No results found"
|
||||
*/
|
||||
noResultsText?: string | JSX.Element;
|
||||
/**
|
||||
* onBlur handler: function (event) {}
|
||||
*/
|
||||
onBlur?: OnBlurHandler;
|
||||
/**
|
||||
* whether to clear input on blur or not
|
||||
* @default true
|
||||
*/
|
||||
onBlurResetsInput?: boolean;
|
||||
/**
|
||||
* whether the input value should be reset when options are selected.
|
||||
* Also input value will be set to empty if 'onSelectResetsInput=true' and
|
||||
* Select will get new value that not equal previous value.
|
||||
* @default true
|
||||
*/
|
||||
onSelectResetsInput?: boolean;
|
||||
/**
|
||||
* whether to clear input when closing the menu through the arrow
|
||||
* @default true
|
||||
*/
|
||||
onCloseResetsInput?: boolean;
|
||||
/**
|
||||
* onChange handler: function (newValue) {}
|
||||
*/
|
||||
onChange?: OnChangeHandler<TValue>;
|
||||
/**
|
||||
* fires when the menu is closed
|
||||
*/
|
||||
onClose?: OnCloseHandler;
|
||||
/**
|
||||
* onFocus handler: function (event) {}
|
||||
*/
|
||||
onFocus?: OnFocusHandler;
|
||||
/**
|
||||
* onInputChange handler: function (inputValue) {}
|
||||
*/
|
||||
onInputChange?: OnInputChangeHandler;
|
||||
/**
|
||||
* onInputKeyDown handler: function (keyboardEvent) {}
|
||||
*/
|
||||
onInputKeyDown?: OnInputKeyDownHandler;
|
||||
/**
|
||||
* fires when the menu is scrolled to the bottom; can be used to paginate options
|
||||
*/
|
||||
onMenuScrollToBottom?: OnMenuScrollToBottomHandler;
|
||||
/**
|
||||
* fires when the menu is opened
|
||||
*/
|
||||
onOpen?: OnOpenHandler;
|
||||
/**
|
||||
* boolean to enable opening dropdown when focused
|
||||
* @default false
|
||||
*/
|
||||
openOnClick?: boolean;
|
||||
/**
|
||||
* open the options menu when the input gets focus (requires searchable = true)
|
||||
* @default true
|
||||
*/
|
||||
openOnFocus?: boolean;
|
||||
/**
|
||||
* className to add to each option component
|
||||
*/
|
||||
optionClassName?: string;
|
||||
/**
|
||||
* option component to render in dropdown
|
||||
*/
|
||||
optionComponent?: OptionComponentType<TValue>;
|
||||
/**
|
||||
* function which returns a custom way to render the options in the menu
|
||||
*/
|
||||
optionRenderer?: OptionRendererHandler<TValue>;
|
||||
/**
|
||||
* array of Select options
|
||||
* @default false
|
||||
*/
|
||||
options?: Options<TValue>;
|
||||
/**
|
||||
* number of options to jump when using page up/down keys
|
||||
* @default 5
|
||||
*/
|
||||
pageSize?: number;
|
||||
/**
|
||||
* field placeholder, displayed when there's no value
|
||||
* @default "Select..."
|
||||
*/
|
||||
placeholder?: string | JSX.Element;
|
||||
/**
|
||||
* whether the selected option is removed from the dropdown on multi selects
|
||||
* @default true
|
||||
*/
|
||||
removeSelected?: boolean;
|
||||
/**
|
||||
* applies HTML5 required attribute when needed
|
||||
* @default false
|
||||
*/
|
||||
required?: boolean;
|
||||
/**
|
||||
* value to use when you clear the control
|
||||
*/
|
||||
resetValue?: any;
|
||||
/**
|
||||
* use react-select in right-to-left direction
|
||||
* @default false
|
||||
*/
|
||||
rtl?: boolean;
|
||||
/**
|
||||
* whether the viewport will shift to display the entire menu when engaged
|
||||
* @default true
|
||||
*/
|
||||
scrollMenuIntoView?: boolean;
|
||||
/**
|
||||
* whether to enable searching feature or not
|
||||
* @default true;
|
||||
*/
|
||||
searchable?: boolean;
|
||||
/**
|
||||
* whether to select the currently focused value when the [tab] key is pressed
|
||||
*/
|
||||
tabSelectsValue?: boolean;
|
||||
/**
|
||||
* initial field value
|
||||
*/
|
||||
value?: Option<TValue> | Options<TValue> | string | string[] | number | number[] | boolean;
|
||||
/**
|
||||
* the option property to use for the value
|
||||
* @default "value"
|
||||
*/
|
||||
valueKey?: string;
|
||||
/**
|
||||
* function which returns a custom way to render the value selected
|
||||
* @default false
|
||||
*/
|
||||
valueRenderer?: ValueRendererHandler<TValue>;
|
||||
/**
|
||||
* optional style to apply to the control
|
||||
*/
|
||||
style?: React.CSSProperties;
|
||||
|
||||
/**
|
||||
* optional tab index of the control
|
||||
*/
|
||||
tabIndex?: string | number;
|
||||
|
||||
/**
|
||||
* value component to render
|
||||
*/
|
||||
valueComponent?: ValueComponentType<TValue>;
|
||||
|
||||
/**
|
||||
* optional style to apply to the component wrapper
|
||||
*/
|
||||
wrapperStyle?: React.CSSProperties;
|
||||
|
||||
/**
|
||||
* onClick handler for value labels: function (value, event) {}
|
||||
*/
|
||||
onValueClick?: OnValueClickHandler<TValue>;
|
||||
|
||||
/**
|
||||
* pass the value to onChange as a simple value (legacy pre 1.0 mode), defaults to false
|
||||
*/
|
||||
simpleValue?: boolean;
|
||||
}
|
||||
|
||||
|
||||
//// [jsxComplexSignatureHasApplicabilityError.js]
|
||||
"use strict";
|
||||
/// <reference path="react16.d.ts" />
|
||||
var __assign = (this && this.__assign) || function () {
|
||||
__assign = Object.assign || function(t) {
|
||||
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
||||
s = arguments[i];
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
|
||||
t[p] = s[p];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
return __assign.apply(this, arguments);
|
||||
};
|
||||
exports.__esModule = true;
|
||||
var React = require("react");
|
||||
function createReactSingleSelect(WrappedComponent) {
|
||||
return function (props) {
|
||||
return (React.createElement(ReactSelectClass, __assign({}, props, { multi: false, autosize: false, value: props.value, onChange: function (value) {
|
||||
if (props.onChange) {
|
||||
props.onChange(value === null ? undefined : value);
|
||||
}
|
||||
} })));
|
||||
};
|
||||
}
|
||||
exports.createReactSingleSelect = createReactSingleSelect;
|
||||
File diff suppressed because it is too large
Load diff
|
|
@ -0,0 +1,997 @@
|
|||
=== tests/cases/compiler/jsxComplexSignatureHasApplicabilityError.tsx ===
|
||||
/// <reference path="react16.d.ts" />
|
||||
|
||||
import * as React from "react";
|
||||
>React : typeof React
|
||||
|
||||
|
||||
interface Props<T extends OptionValues> {
|
||||
value?: Option<T> | T;
|
||||
>value : T | Option<T> | undefined
|
||||
|
||||
onChange?(value: Option<T> | undefined): void;
|
||||
>onChange : ((value: Option<T> | undefined) => void) | undefined
|
||||
>value : Option<T> | undefined
|
||||
}
|
||||
|
||||
type ExtractValueType<T> = T extends ReactSelectProps<infer U> ? U : never;
|
||||
>ExtractValueType : ExtractValueType<T>
|
||||
|
||||
export type ReactSingleSelectProps<
|
||||
>ReactSingleSelectProps : Overwrite<Omit<WrappedProps, "multi">, Props<ExtractValueType<WrappedProps>>>
|
||||
|
||||
WrappedProps extends ReactSelectProps<any>
|
||||
> = Overwrite<
|
||||
Omit<WrappedProps, "multi">,
|
||||
Props<ExtractValueType<WrappedProps>>
|
||||
>;
|
||||
|
||||
export function createReactSingleSelect<
|
||||
>createReactSingleSelect : <WrappedProps extends ReactSelectProps<any>>(WrappedComponent: React.ComponentType<WrappedProps>) => React.ComponentType<Overwrite<Omit<WrappedProps, "multi">, Props<ExtractValueType<WrappedProps>>>>
|
||||
|
||||
WrappedProps extends ReactSelectProps<any>
|
||||
>(
|
||||
WrappedComponent: React.ComponentType<WrappedProps>
|
||||
>WrappedComponent : React.ComponentType<WrappedProps>
|
||||
>React : any
|
||||
|
||||
): React.ComponentType<ReactSingleSelectProps<WrappedProps>> {
|
||||
>React : any
|
||||
|
||||
return (props) => {
|
||||
>(props) => { return ( <ReactSelectClass<ExtractValueType<WrappedProps>> {...props} multi={false} autosize={false} value={props.value} onChange={(value) => { if (props.onChange) { props.onChange(value === null ? undefined : value); } }} /> ); } : (props: Omit<Omit<WrappedProps, "multi">, (keyof Omit<WrappedProps, "multi"> & "value") | (keyof Omit<WrappedProps, "multi"> & "onChange")> & Props<ExtractValueType<WrappedProps>> & { children?: React.ReactNode; }) => JSX.Element
|
||||
>props : Omit<Omit<WrappedProps, "multi">, (keyof Omit<WrappedProps, "multi"> & "value") | (keyof Omit<WrappedProps, "multi"> & "onChange")> & Props<ExtractValueType<WrappedProps>> & { children?: React.ReactNode; }
|
||||
|
||||
return (
|
||||
>( <ReactSelectClass<ExtractValueType<WrappedProps>> {...props} multi={false} autosize={false} value={props.value} onChange={(value) => { if (props.onChange) { props.onChange(value === null ? undefined : value); } }} /> ) : JSX.Element
|
||||
|
||||
<ReactSelectClass<ExtractValueType<WrappedProps>>
|
||||
><ReactSelectClass<ExtractValueType<WrappedProps>> {...props} multi={false} autosize={false} value={props.value} onChange={(value) => { if (props.onChange) { props.onChange(value === null ? undefined : value); } }} /> : JSX.Element
|
||||
>ReactSelectClass : typeof ReactSelectClass
|
||||
|
||||
{...props}
|
||||
>props : Omit<Omit<WrappedProps, "multi">, (keyof Omit<WrappedProps, "multi"> & "value") | (keyof Omit<WrappedProps, "multi"> & "onChange")> & Props<ExtractValueType<WrappedProps>> & { children?: React.ReactNode; }
|
||||
|
||||
multi={false}
|
||||
>multi : false
|
||||
>false : false
|
||||
|
||||
autosize={false}
|
||||
>autosize : false
|
||||
>false : false
|
||||
|
||||
value={props.value}
|
||||
>value : ExtractValueType<WrappedProps> | Option<ExtractValueType<WrappedProps>> | undefined
|
||||
>props.value : ExtractValueType<WrappedProps> | Option<ExtractValueType<WrappedProps>> | undefined
|
||||
>props : Omit<Omit<WrappedProps, "multi">, (keyof Omit<WrappedProps, "multi"> & "value") | (keyof Omit<WrappedProps, "multi"> & "onChange")> & Props<ExtractValueType<WrappedProps>> & { children?: React.ReactNode; }
|
||||
>value : ExtractValueType<WrappedProps> | Option<ExtractValueType<WrappedProps>> | undefined
|
||||
|
||||
onChange={(value) => {
|
||||
>onChange : (value: Option<ExtractValueType<WrappedProps>> | Options<ExtractValueType<WrappedProps>> | null) => void
|
||||
>(value) => { if (props.onChange) { props.onChange(value === null ? undefined : value); } } : (value: Option<ExtractValueType<WrappedProps>> | Options<ExtractValueType<WrappedProps>> | null) => void
|
||||
>value : Option<ExtractValueType<WrappedProps>> | Options<ExtractValueType<WrappedProps>> | null
|
||||
|
||||
if (props.onChange) {
|
||||
>props.onChange : ((value: Option<ExtractValueType<WrappedProps>> | undefined) => void) | undefined
|
||||
>props : Omit<Omit<WrappedProps, "multi">, (keyof Omit<WrappedProps, "multi"> & "value") | (keyof Omit<WrappedProps, "multi"> & "onChange")> & Props<ExtractValueType<WrappedProps>> & { children?: React.ReactNode; }
|
||||
>onChange : ((value: Option<ExtractValueType<WrappedProps>> | undefined) => void) | undefined
|
||||
|
||||
props.onChange(value === null ? undefined : value);
|
||||
>props.onChange(value === null ? undefined : value) : void
|
||||
>props.onChange : (value: Option<ExtractValueType<WrappedProps>> | undefined) => void
|
||||
>props : Omit<Omit<WrappedProps, "multi">, (keyof Omit<WrappedProps, "multi"> & "value") | (keyof Omit<WrappedProps, "multi"> & "onChange")> & Props<ExtractValueType<WrappedProps>> & { children?: React.ReactNode; }
|
||||
>onChange : (value: Option<ExtractValueType<WrappedProps>> | undefined) => void
|
||||
>value === null ? undefined : value : Option<ExtractValueType<WrappedProps>> | Options<ExtractValueType<WrappedProps>> | undefined
|
||||
>value === null : boolean
|
||||
>value : Option<ExtractValueType<WrappedProps>> | Options<ExtractValueType<WrappedProps>> | null
|
||||
>null : null
|
||||
>undefined : undefined
|
||||
>value : Option<ExtractValueType<WrappedProps>> | Options<ExtractValueType<WrappedProps>>
|
||||
}
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// Copied from "type-zoo" version 3.4.0
|
||||
export type Omit<T, K extends keyof any> = T extends any ? Pick<T, Exclude<keyof T, K>> : never;
|
||||
>Omit : Omit<T, K>
|
||||
|
||||
export type Overwrite<T, U> = Omit<T, keyof T & keyof U> & U;
|
||||
>Overwrite : Overwrite<T, U>
|
||||
|
||||
// Everything below here copied from "@types/react-select" version 1.3.4
|
||||
declare class ReactSelectClass<TValue = OptionValues> extends React.Component<ReactSelectProps<TValue>> {
|
||||
>ReactSelectClass : ReactSelectClass<TValue>
|
||||
>React.Component : React.Component<ReactSelectProps<TValue>, {}, any>
|
||||
>React : typeof React
|
||||
>Component : typeof React.Component
|
||||
|
||||
focus(): void;
|
||||
>focus : () => void
|
||||
|
||||
setValue(value: Option<TValue>): void;
|
||||
>setValue : (value: Option<TValue>) => void
|
||||
>value : Option<TValue>
|
||||
}
|
||||
|
||||
export type OptionComponentType<TValue = OptionValues> = React.ComponentType<OptionComponentProps<TValue>>;
|
||||
>OptionComponentType : React.ComponentType<OptionComponentProps<TValue>>
|
||||
>React : any
|
||||
|
||||
export type ValueComponentType<TValue = OptionValues> = React.ComponentType<ValueComponentProps<TValue>>;
|
||||
>ValueComponentType : React.ComponentType<ValueComponentProps<TValue>>
|
||||
>React : any
|
||||
|
||||
export type HandlerRendererResult = JSX.Element | null | false;
|
||||
>HandlerRendererResult : HandlerRendererResult
|
||||
>JSX : any
|
||||
>null : null
|
||||
>false : false
|
||||
|
||||
// Handlers
|
||||
export type FocusOptionHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
>FocusOptionHandler : FocusOptionHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
|
||||
export type SelectValueHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
>SelectValueHandler : SelectValueHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
|
||||
export type ArrowRendererHandler = (props: ArrowRendererProps) => HandlerRendererResult;
|
||||
>ArrowRendererHandler : ArrowRendererHandler
|
||||
>props : ArrowRendererProps
|
||||
|
||||
export type ClearRendererHandler = () => HandlerRendererResult;
|
||||
>ClearRendererHandler : ClearRendererHandler
|
||||
|
||||
export type FilterOptionHandler<TValue = OptionValues> = (option: Option<TValue>, filter: string) => boolean;
|
||||
>FilterOptionHandler : FilterOptionHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
>filter : string
|
||||
|
||||
export type FilterOptionsHandler<TValue = OptionValues> = (options: Options<TValue>, filter: string, currentValues: Options<TValue>) => Options<TValue>;
|
||||
>FilterOptionsHandler : FilterOptionsHandler<TValue>
|
||||
>options : Options<TValue>
|
||||
>filter : string
|
||||
>currentValues : Options<TValue>
|
||||
|
||||
export type InputRendererHandler = (props: { [key: string]: any }) => HandlerRendererResult;
|
||||
>InputRendererHandler : InputRendererHandler
|
||||
>props : { [key: string]: any; }
|
||||
>key : string
|
||||
|
||||
export type MenuRendererHandler<TValue = OptionValues> = (props: MenuRendererProps<TValue>) => HandlerRendererResult;
|
||||
>MenuRendererHandler : MenuRendererHandler<TValue>
|
||||
>props : MenuRendererProps<TValue>
|
||||
|
||||
export type OnCloseHandler = () => void;
|
||||
>OnCloseHandler : OnCloseHandler
|
||||
|
||||
export type OnInputChangeHandler = (inputValue: string) => string;
|
||||
>OnInputChangeHandler : OnInputChangeHandler
|
||||
>inputValue : string
|
||||
|
||||
export type OnInputKeyDownHandler = React.KeyboardEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
>OnInputKeyDownHandler : (event: React.KeyboardEvent<HTMLDivElement | HTMLInputElement>) => void
|
||||
>React : any
|
||||
|
||||
export type OnMenuScrollToBottomHandler = () => void;
|
||||
>OnMenuScrollToBottomHandler : OnMenuScrollToBottomHandler
|
||||
|
||||
export type OnOpenHandler = () => void;
|
||||
>OnOpenHandler : OnOpenHandler
|
||||
|
||||
export type OnFocusHandler = React.FocusEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
>OnFocusHandler : (event: React.FocusEvent<HTMLDivElement | HTMLInputElement>) => void
|
||||
>React : any
|
||||
|
||||
export type OnBlurHandler = React.FocusEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
>OnBlurHandler : (event: React.FocusEvent<HTMLDivElement | HTMLInputElement>) => void
|
||||
>React : any
|
||||
|
||||
export type OptionRendererHandler<TValue = OptionValues> = (option: Option<TValue>) => HandlerRendererResult;
|
||||
>OptionRendererHandler : OptionRendererHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
|
||||
export type ValueRendererHandler<TValue = OptionValues> = (option: Option<TValue>, index?: number) => HandlerRendererResult;
|
||||
>ValueRendererHandler : ValueRendererHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
>index : number | undefined
|
||||
|
||||
export type OnValueClickHandler<TValue = OptionValues> = (option: Option<TValue>, event: React.MouseEvent<HTMLAnchorElement>) => void;
|
||||
>OnValueClickHandler : OnValueClickHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
>event : React.MouseEvent<HTMLAnchorElement>
|
||||
>React : any
|
||||
|
||||
export type IsOptionUniqueHandler<TValue = OptionValues> = (arg: { option: Option<TValue>, options: Options<TValue>, labelKey: string, valueKey: string }) => boolean;
|
||||
>IsOptionUniqueHandler : IsOptionUniqueHandler<TValue>
|
||||
>arg : { option: Option<TValue>; options: Options<TValue>; labelKey: string; valueKey: string; }
|
||||
>option : Option<TValue>
|
||||
>options : Options<TValue>
|
||||
>labelKey : string
|
||||
>valueKey : string
|
||||
|
||||
export type IsValidNewOptionHandler = (arg: { label: string }) => boolean;
|
||||
>IsValidNewOptionHandler : IsValidNewOptionHandler
|
||||
>arg : { label: string; }
|
||||
>label : string
|
||||
|
||||
export type NewOptionCreatorHandler<TValue = OptionValues> = (arg: { label: string, labelKey: string, valueKey: string }) => Option<TValue>;
|
||||
>NewOptionCreatorHandler : NewOptionCreatorHandler<TValue>
|
||||
>arg : { label: string; labelKey: string; valueKey: string; }
|
||||
>label : string
|
||||
>labelKey : string
|
||||
>valueKey : string
|
||||
|
||||
export type PromptTextCreatorHandler = (filterText: string) => string;
|
||||
>PromptTextCreatorHandler : PromptTextCreatorHandler
|
||||
>filterText : string
|
||||
|
||||
export type ShouldKeyDownEventCreateNewOptionHandler = (arg: { keyCode: number }) => boolean;
|
||||
>ShouldKeyDownEventCreateNewOptionHandler : ShouldKeyDownEventCreateNewOptionHandler
|
||||
>arg : { keyCode: number; }
|
||||
>keyCode : number
|
||||
|
||||
export type OnChangeSingleHandler<TValue = OptionValues> = OnChangeHandler<TValue, Option<TValue>>;
|
||||
>OnChangeSingleHandler : OnChangeHandler<TValue, Option<TValue>>
|
||||
|
||||
export type OnChangeMultipleHandler<TValue = OptionValues> = OnChangeHandler<TValue, Options<TValue>>;
|
||||
>OnChangeMultipleHandler : OnChangeHandler<TValue, Options<TValue>>
|
||||
|
||||
export type OnChangeHandler<TValue = OptionValues, TOption = Option<TValue> | Options<TValue>> = (newValue: TOption | null) => void;
|
||||
>OnChangeHandler : OnChangeHandler<TValue, TOption>
|
||||
>newValue : TOption | null
|
||||
>null : null
|
||||
|
||||
export type OnNewOptionClickHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
>OnNewOptionClickHandler : OnNewOptionClickHandler<TValue>
|
||||
>option : Option<TValue>
|
||||
|
||||
export type LoadOptionsHandler<TValue = OptionValues> = LoadOptionsAsyncHandler<TValue> | LoadOptionsLegacyHandler<TValue>;
|
||||
>LoadOptionsHandler : LoadOptionsHandler<TValue>
|
||||
|
||||
export type LoadOptionsAsyncHandler<TValue = OptionValues> = (input: string) => Promise<AutocompleteResult<TValue>>;
|
||||
>LoadOptionsAsyncHandler : LoadOptionsAsyncHandler<TValue>
|
||||
>input : string
|
||||
|
||||
export type LoadOptionsLegacyHandler<TValue = OptionValues> = (input: string, callback: (err: any, result: AutocompleteResult<TValue>) => void) => void;
|
||||
>LoadOptionsLegacyHandler : LoadOptionsLegacyHandler<TValue>
|
||||
>input : string
|
||||
>callback : (err: any, result: AutocompleteResult<TValue>) => void
|
||||
>err : any
|
||||
>result : AutocompleteResult<TValue>
|
||||
|
||||
export interface AutocompleteResult<TValue = OptionValues> {
|
||||
/** The search-results to be displayed */
|
||||
options: Options<TValue>;
|
||||
>options : Options<TValue>
|
||||
|
||||
/**
|
||||
* Should be set to true, if and only if a longer query with the same prefix
|
||||
* would return a subset of the results
|
||||
* If set to true, more specific queries will not be sent to the server.
|
||||
*/
|
||||
complete: boolean;
|
||||
>complete : boolean
|
||||
}
|
||||
|
||||
export type Options<TValue = OptionValues> = Array<Option<TValue>>;
|
||||
>Options : Options<TValue>
|
||||
|
||||
export interface Option<TValue = OptionValues> {
|
||||
/** Text for rendering */
|
||||
label?: string;
|
||||
>label : string | undefined
|
||||
|
||||
/** Value for searching */
|
||||
value?: TValue;
|
||||
>value : TValue | undefined
|
||||
|
||||
/**
|
||||
* Allow this option to be cleared
|
||||
* @default true
|
||||
*/
|
||||
clearableValue?: boolean;
|
||||
>clearableValue : boolean | undefined
|
||||
|
||||
/**
|
||||
* Do not allow this option to be selected
|
||||
* @default false
|
||||
*/
|
||||
disabled?: boolean;
|
||||
>disabled : boolean | undefined
|
||||
|
||||
/**
|
||||
* In the event that a custom menuRenderer is provided, Option should be able
|
||||
* to accept arbitrary key-value pairs. See react-virtualized-select.
|
||||
*/
|
||||
[property: string]: any;
|
||||
>property : string
|
||||
}
|
||||
|
||||
export type OptionValues = string | number | boolean;
|
||||
>OptionValues : OptionValues
|
||||
|
||||
export interface MenuRendererProps<TValue = OptionValues> {
|
||||
/**
|
||||
* The currently focused option; should be visible in the menu by default.
|
||||
* default {}
|
||||
*/
|
||||
focusedOption: Option<TValue>;
|
||||
>focusedOption : Option<TValue>
|
||||
|
||||
/**
|
||||
* Callback to focus a new option; receives the option as a parameter.
|
||||
*/
|
||||
focusOption: FocusOptionHandler<TValue>;
|
||||
>focusOption : FocusOptionHandler<TValue>
|
||||
|
||||
/**
|
||||
* Option labels are accessible with this string key.
|
||||
*/
|
||||
labelKey: string;
|
||||
>labelKey : string
|
||||
|
||||
/**
|
||||
* Ordered array of options to render.
|
||||
*/
|
||||
options: Options<TValue>;
|
||||
>options : Options<TValue>
|
||||
|
||||
/**
|
||||
* Callback to select a new option; receives the option as a parameter.
|
||||
*/
|
||||
selectValue: SelectValueHandler<TValue>;
|
||||
>selectValue : SelectValueHandler<TValue>
|
||||
|
||||
/**
|
||||
* Array of currently selected options.
|
||||
*/
|
||||
valueArray: Options<TValue>;
|
||||
>valueArray : Options<TValue>
|
||||
|
||||
/**
|
||||
* Callback to remove selection from option; receives the option as a parameter.
|
||||
*/
|
||||
removeValue: SelectValueHandler<TValue>;
|
||||
>removeValue : SelectValueHandler<TValue>
|
||||
|
||||
/**
|
||||
* function which returns a custom way to render the options in the menu
|
||||
*/
|
||||
optionRenderer: OptionRendererHandler<TValue>;
|
||||
>optionRenderer : OptionRendererHandler<TValue>
|
||||
}
|
||||
|
||||
export interface OptionComponentProps<TValue = OptionValues> {
|
||||
/**
|
||||
* Classname(s) to apply to the option component.
|
||||
*/
|
||||
className?: string;
|
||||
>className : string | undefined
|
||||
|
||||
/**
|
||||
* Currently focused option.
|
||||
*/
|
||||
focusOption?: Option<TValue>;
|
||||
>focusOption : Option<TValue> | undefined
|
||||
|
||||
inputValue?: string;
|
||||
>inputValue : string | undefined
|
||||
|
||||
instancePrefix?: string;
|
||||
>instancePrefix : string | undefined
|
||||
|
||||
/**
|
||||
* True if this option is disabled.
|
||||
*/
|
||||
isDisabled?: boolean;
|
||||
>isDisabled : boolean | undefined
|
||||
|
||||
/**
|
||||
* True if this option is focused.
|
||||
*/
|
||||
isFocused?: boolean;
|
||||
>isFocused : boolean | undefined
|
||||
|
||||
/**
|
||||
* True if this option is selected.
|
||||
*/
|
||||
isSelected?: boolean;
|
||||
>isSelected : boolean | undefined
|
||||
|
||||
/**
|
||||
* Callback to be invoked when this option is focused.
|
||||
*/
|
||||
onFocus?: (option: Option<TValue>, event: any) => void;
|
||||
>onFocus : ((option: Option<TValue>, event: any) => void) | undefined
|
||||
>option : Option<TValue>
|
||||
>event : any
|
||||
|
||||
/**
|
||||
* Callback to be invoked when this option is selected.
|
||||
*/
|
||||
onSelect?: (option: Option<TValue>, event: any) => void;
|
||||
>onSelect : ((option: Option<TValue>, event: any) => void) | undefined
|
||||
>option : Option<TValue>
|
||||
>event : any
|
||||
|
||||
/**
|
||||
* Option to be rendered by this component.
|
||||
*/
|
||||
option: Option<TValue>;
|
||||
>option : Option<TValue>
|
||||
|
||||
/**
|
||||
* Index of the option being rendered in the list
|
||||
*/
|
||||
optionIndex?: number;
|
||||
>optionIndex : number | undefined
|
||||
|
||||
/**
|
||||
* Callback to invoke when removing an option from a multi-selection. (Not necessarily the one
|
||||
* being rendered)
|
||||
*/
|
||||
removeValue?: (value: TValue | TValue[]) => void;
|
||||
>removeValue : ((value: TValue | TValue[]) => void) | undefined
|
||||
>value : TValue | TValue[]
|
||||
|
||||
/**
|
||||
* Callback to invoke to select an option. (Not necessarily the one being rendered)
|
||||
*/
|
||||
selectValue?: (value: TValue | TValue[]) => void;
|
||||
>selectValue : ((value: TValue | TValue[]) => void) | undefined
|
||||
>value : TValue | TValue[]
|
||||
}
|
||||
|
||||
export interface ArrowRendererProps {
|
||||
/**
|
||||
* Arrow mouse down event handler.
|
||||
*/
|
||||
onMouseDown: React.MouseEventHandler<any>;
|
||||
>onMouseDown : (event: React.MouseEvent<any>) => void
|
||||
>React : any
|
||||
|
||||
/**
|
||||
* whether the Select is open or not.
|
||||
*/
|
||||
isOpen: boolean;
|
||||
>isOpen : boolean
|
||||
}
|
||||
|
||||
export interface ValueComponentProps<TValue = OptionValues> {
|
||||
disabled: ReactSelectProps<TValue>['disabled'];
|
||||
>disabled : boolean | undefined
|
||||
|
||||
id: string;
|
||||
>id : string
|
||||
|
||||
instancePrefix: string;
|
||||
>instancePrefix : string
|
||||
|
||||
onClick: OnValueClickHandler<TValue> | null;
|
||||
>onClick : OnValueClickHandler<TValue> | null
|
||||
>null : null
|
||||
|
||||
onRemove?: SelectValueHandler<TValue>;
|
||||
>onRemove : SelectValueHandler<TValue> | undefined
|
||||
|
||||
placeholder: ReactSelectProps<TValue>['placeholder'];
|
||||
>placeholder : string | JSX.Element | undefined
|
||||
|
||||
value: Option<TValue>;
|
||||
>value : Option<TValue>
|
||||
|
||||
values?: Array<Option<TValue>>;
|
||||
>values : Option<TValue>[] | undefined
|
||||
}
|
||||
|
||||
export interface ReactSelectProps<TValue = OptionValues> extends React.Props<ReactSelectClass<TValue>> {
|
||||
>React : typeof React
|
||||
|
||||
/**
|
||||
* text to display when `allowCreate` is true.
|
||||
* @default 'Add "{label}"?'
|
||||
*/
|
||||
addLabelText?: string;
|
||||
>addLabelText : string | undefined
|
||||
|
||||
/**
|
||||
* renders a custom drop-down arrow to be shown in the right-hand side of the select.
|
||||
* @default undefined
|
||||
*/
|
||||
arrowRenderer?: ArrowRendererHandler | null;
|
||||
>arrowRenderer : ArrowRendererHandler | null | undefined
|
||||
>null : null
|
||||
|
||||
/**
|
||||
* blurs the input element after a selection has been made. Handy for lowering the keyboard on mobile devices.
|
||||
* @default false
|
||||
*/
|
||||
autoBlur?: boolean;
|
||||
>autoBlur : boolean | undefined
|
||||
|
||||
/**
|
||||
* autofocus the component on mount
|
||||
* @deprecated. Use autoFocus instead
|
||||
* @default false
|
||||
*/
|
||||
autofocus?: boolean;
|
||||
>autofocus : boolean | undefined
|
||||
|
||||
/**
|
||||
* autofocus the component on mount
|
||||
* @default false
|
||||
*/
|
||||
autoFocus?: boolean;
|
||||
>autoFocus : boolean | undefined
|
||||
|
||||
/**
|
||||
* If enabled, the input will expand as the length of its value increases
|
||||
*/
|
||||
autosize?: boolean;
|
||||
>autosize : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether pressing backspace removes the last item when there is no input value
|
||||
* @default true
|
||||
*/
|
||||
backspaceRemoves?: boolean;
|
||||
>backspaceRemoves : boolean | undefined
|
||||
|
||||
/**
|
||||
* Message to use for screenreaders to press backspace to remove the current item
|
||||
* {label} is replaced with the item label
|
||||
* @default "Press backspace to remove..."
|
||||
*/
|
||||
backspaceToRemoveMessage?: string;
|
||||
>backspaceToRemoveMessage : string | undefined
|
||||
|
||||
/**
|
||||
* CSS className for the outer element
|
||||
*/
|
||||
className?: string;
|
||||
>className : string | undefined
|
||||
|
||||
/**
|
||||
* Prefix prepended to element default className if no className is defined
|
||||
*/
|
||||
classNamePrefix?: string;
|
||||
>classNamePrefix : string | undefined
|
||||
|
||||
/**
|
||||
* title for the "clear" control when `multi` is true
|
||||
* @default "Clear all"
|
||||
*/
|
||||
clearAllText?: string;
|
||||
>clearAllText : string | undefined
|
||||
|
||||
/**
|
||||
* Renders a custom clear to be shown in the right-hand side of the select when clearable true
|
||||
* @default undefined
|
||||
*/
|
||||
clearRenderer?: ClearRendererHandler;
|
||||
>clearRenderer : ClearRendererHandler | undefined
|
||||
|
||||
/**
|
||||
* title for the "clear" control
|
||||
* @default "Clear value"
|
||||
*/
|
||||
clearValueText?: string;
|
||||
>clearValueText : string | undefined
|
||||
|
||||
/**
|
||||
* whether to close the menu when a value is selected
|
||||
* @default true
|
||||
*/
|
||||
closeOnSelect?: boolean;
|
||||
>closeOnSelect : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether it is possible to reset value. if enabled, an X button will appear at the right side.
|
||||
* @default true
|
||||
*/
|
||||
clearable?: boolean;
|
||||
>clearable : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether backspace removes an item if there is no text input
|
||||
* @default true
|
||||
*/
|
||||
deleteRemoves?: boolean;
|
||||
>deleteRemoves : boolean | undefined
|
||||
|
||||
/**
|
||||
* delimiter to use to join multiple values
|
||||
* @default ","
|
||||
*/
|
||||
delimiter?: string;
|
||||
>delimiter : string | undefined
|
||||
|
||||
/**
|
||||
* whether the Select is disabled or not
|
||||
* @default false
|
||||
*/
|
||||
disabled?: boolean;
|
||||
>disabled : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether escape clears the value when the menu is closed
|
||||
* @default true
|
||||
*/
|
||||
escapeClearsValue?: boolean;
|
||||
>escapeClearsValue : boolean | undefined
|
||||
|
||||
/**
|
||||
* method to filter a single option
|
||||
*/
|
||||
filterOption?: FilterOptionHandler<TValue>;
|
||||
>filterOption : FilterOptionHandler<TValue> | undefined
|
||||
|
||||
/**
|
||||
* method to filter the options array
|
||||
*/
|
||||
filterOptions?: FilterOptionsHandler<TValue>;
|
||||
>filterOptions : FilterOptionsHandler<TValue> | undefined
|
||||
|
||||
/**
|
||||
* id for the underlying HTML input element
|
||||
* @default undefined
|
||||
*/
|
||||
id?: string;
|
||||
>id : string | undefined
|
||||
|
||||
/**
|
||||
* whether to strip diacritics when filtering
|
||||
* @default true
|
||||
*/
|
||||
ignoreAccents?: boolean;
|
||||
>ignoreAccents : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether to perform case-insensitive filtering
|
||||
* @default true
|
||||
*/
|
||||
ignoreCase?: boolean;
|
||||
>ignoreCase : boolean | undefined
|
||||
|
||||
/**
|
||||
* custom attributes for the Input (in the Select-control) e.g: {'data-foo': 'bar'}
|
||||
* @default {}
|
||||
*/
|
||||
inputProps?: { [key: string]: any };
|
||||
>inputProps : { [key: string]: any; } | undefined
|
||||
>key : string
|
||||
|
||||
/**
|
||||
* renders a custom input
|
||||
*/
|
||||
inputRenderer?: InputRendererHandler;
|
||||
>inputRenderer : InputRendererHandler | undefined
|
||||
|
||||
/**
|
||||
* allows for synchronization of component id's on server and client.
|
||||
* @see https://github.com/JedWatson/react-select/pull/1105
|
||||
*/
|
||||
instanceId?: string;
|
||||
>instanceId : string | undefined
|
||||
|
||||
/**
|
||||
* whether the Select is loading externally or not (such as options being loaded).
|
||||
* if true, a loading spinner will be shown at the right side.
|
||||
* @default false
|
||||
*/
|
||||
isLoading?: boolean;
|
||||
>isLoading : boolean | undefined
|
||||
|
||||
/**
|
||||
* (legacy mode) joins multiple values into a single form field with the delimiter
|
||||
* @default false
|
||||
*/
|
||||
joinValues?: boolean;
|
||||
>joinValues : boolean | undefined
|
||||
|
||||
/**
|
||||
* the option property to use for the label
|
||||
* @default "label"
|
||||
*/
|
||||
labelKey?: string;
|
||||
>labelKey : string | undefined
|
||||
|
||||
/**
|
||||
* (any, start) match the start or entire string when filtering
|
||||
* @default "any"
|
||||
*/
|
||||
matchPos?: string;
|
||||
>matchPos : string | undefined
|
||||
|
||||
/**
|
||||
* (any, label, value) which option property to filter on
|
||||
* @default "any"
|
||||
*/
|
||||
matchProp?: string;
|
||||
>matchProp : string | undefined
|
||||
|
||||
/**
|
||||
* buffer of px between the base of the dropdown and the viewport to shift if menu doesnt fit in viewport
|
||||
* @default 0
|
||||
*/
|
||||
menuBuffer?: number;
|
||||
>menuBuffer : number | undefined
|
||||
|
||||
/**
|
||||
* optional style to apply to the menu container
|
||||
*/
|
||||
menuContainerStyle?: React.CSSProperties;
|
||||
>menuContainerStyle : React.CSSProperties | undefined
|
||||
>React : any
|
||||
|
||||
/**
|
||||
* renders a custom menu with options
|
||||
*/
|
||||
menuRenderer?: MenuRendererHandler<TValue>;
|
||||
>menuRenderer : MenuRendererHandler<TValue> | undefined
|
||||
|
||||
/**
|
||||
* optional style to apply to the menu
|
||||
*/
|
||||
menuStyle?: React.CSSProperties;
|
||||
>menuStyle : React.CSSProperties | undefined
|
||||
>React : any
|
||||
|
||||
/**
|
||||
* multi-value input
|
||||
* @default false
|
||||
*/
|
||||
multi?: boolean;
|
||||
>multi : boolean | undefined
|
||||
|
||||
/**
|
||||
* field name, for hidden `<input>` tag
|
||||
*/
|
||||
name?: string;
|
||||
>name : string | undefined
|
||||
|
||||
/**
|
||||
* placeholder displayed when there are no matching search results or a falsy value to hide it
|
||||
* @default "No results found"
|
||||
*/
|
||||
noResultsText?: string | JSX.Element;
|
||||
>noResultsText : string | JSX.Element | undefined
|
||||
>JSX : any
|
||||
|
||||
/**
|
||||
* onBlur handler: function (event) {}
|
||||
*/
|
||||
onBlur?: OnBlurHandler;
|
||||
>onBlur : ((event: React.FocusEvent<HTMLDivElement | HTMLInputElement>) => void) | undefined
|
||||
|
||||
/**
|
||||
* whether to clear input on blur or not
|
||||
* @default true
|
||||
*/
|
||||
onBlurResetsInput?: boolean;
|
||||
>onBlurResetsInput : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether the input value should be reset when options are selected.
|
||||
* Also input value will be set to empty if 'onSelectResetsInput=true' and
|
||||
* Select will get new value that not equal previous value.
|
||||
* @default true
|
||||
*/
|
||||
onSelectResetsInput?: boolean;
|
||||
>onSelectResetsInput : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether to clear input when closing the menu through the arrow
|
||||
* @default true
|
||||
*/
|
||||
onCloseResetsInput?: boolean;
|
||||
>onCloseResetsInput : boolean | undefined
|
||||
|
||||
/**
|
||||
* onChange handler: function (newValue) {}
|
||||
*/
|
||||
onChange?: OnChangeHandler<TValue>;
|
||||
>onChange : OnChangeHandler<TValue, Option<TValue> | Options<TValue>> | undefined
|
||||
|
||||
/**
|
||||
* fires when the menu is closed
|
||||
*/
|
||||
onClose?: OnCloseHandler;
|
||||
>onClose : OnCloseHandler | undefined
|
||||
|
||||
/**
|
||||
* onFocus handler: function (event) {}
|
||||
*/
|
||||
onFocus?: OnFocusHandler;
|
||||
>onFocus : ((event: React.FocusEvent<HTMLDivElement | HTMLInputElement>) => void) | undefined
|
||||
|
||||
/**
|
||||
* onInputChange handler: function (inputValue) {}
|
||||
*/
|
||||
onInputChange?: OnInputChangeHandler;
|
||||
>onInputChange : OnInputChangeHandler | undefined
|
||||
|
||||
/**
|
||||
* onInputKeyDown handler: function (keyboardEvent) {}
|
||||
*/
|
||||
onInputKeyDown?: OnInputKeyDownHandler;
|
||||
>onInputKeyDown : ((event: React.KeyboardEvent<HTMLDivElement | HTMLInputElement>) => void) | undefined
|
||||
|
||||
/**
|
||||
* fires when the menu is scrolled to the bottom; can be used to paginate options
|
||||
*/
|
||||
onMenuScrollToBottom?: OnMenuScrollToBottomHandler;
|
||||
>onMenuScrollToBottom : OnMenuScrollToBottomHandler | undefined
|
||||
|
||||
/**
|
||||
* fires when the menu is opened
|
||||
*/
|
||||
onOpen?: OnOpenHandler;
|
||||
>onOpen : OnOpenHandler | undefined
|
||||
|
||||
/**
|
||||
* boolean to enable opening dropdown when focused
|
||||
* @default false
|
||||
*/
|
||||
openOnClick?: boolean;
|
||||
>openOnClick : boolean | undefined
|
||||
|
||||
/**
|
||||
* open the options menu when the input gets focus (requires searchable = true)
|
||||
* @default true
|
||||
*/
|
||||
openOnFocus?: boolean;
|
||||
>openOnFocus : boolean | undefined
|
||||
|
||||
/**
|
||||
* className to add to each option component
|
||||
*/
|
||||
optionClassName?: string;
|
||||
>optionClassName : string | undefined
|
||||
|
||||
/**
|
||||
* option component to render in dropdown
|
||||
*/
|
||||
optionComponent?: OptionComponentType<TValue>;
|
||||
>optionComponent : React.ComponentClass<OptionComponentProps<TValue>, any> | React.StatelessComponent<OptionComponentProps<TValue>> | undefined
|
||||
|
||||
/**
|
||||
* function which returns a custom way to render the options in the menu
|
||||
*/
|
||||
optionRenderer?: OptionRendererHandler<TValue>;
|
||||
>optionRenderer : OptionRendererHandler<TValue> | undefined
|
||||
|
||||
/**
|
||||
* array of Select options
|
||||
* @default false
|
||||
*/
|
||||
options?: Options<TValue>;
|
||||
>options : Options<TValue> | undefined
|
||||
|
||||
/**
|
||||
* number of options to jump when using page up/down keys
|
||||
* @default 5
|
||||
*/
|
||||
pageSize?: number;
|
||||
>pageSize : number | undefined
|
||||
|
||||
/**
|
||||
* field placeholder, displayed when there's no value
|
||||
* @default "Select..."
|
||||
*/
|
||||
placeholder?: string | JSX.Element;
|
||||
>placeholder : string | JSX.Element | undefined
|
||||
>JSX : any
|
||||
|
||||
/**
|
||||
* whether the selected option is removed from the dropdown on multi selects
|
||||
* @default true
|
||||
*/
|
||||
removeSelected?: boolean;
|
||||
>removeSelected : boolean | undefined
|
||||
|
||||
/**
|
||||
* applies HTML5 required attribute when needed
|
||||
* @default false
|
||||
*/
|
||||
required?: boolean;
|
||||
>required : boolean | undefined
|
||||
|
||||
/**
|
||||
* value to use when you clear the control
|
||||
*/
|
||||
resetValue?: any;
|
||||
>resetValue : any
|
||||
|
||||
/**
|
||||
* use react-select in right-to-left direction
|
||||
* @default false
|
||||
*/
|
||||
rtl?: boolean;
|
||||
>rtl : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether the viewport will shift to display the entire menu when engaged
|
||||
* @default true
|
||||
*/
|
||||
scrollMenuIntoView?: boolean;
|
||||
>scrollMenuIntoView : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether to enable searching feature or not
|
||||
* @default true;
|
||||
*/
|
||||
searchable?: boolean;
|
||||
>searchable : boolean | undefined
|
||||
|
||||
/**
|
||||
* whether to select the currently focused value when the [tab] key is pressed
|
||||
*/
|
||||
tabSelectsValue?: boolean;
|
||||
>tabSelectsValue : boolean | undefined
|
||||
|
||||
/**
|
||||
* initial field value
|
||||
*/
|
||||
value?: Option<TValue> | Options<TValue> | string | string[] | number | number[] | boolean;
|
||||
>value : string | number | boolean | Option<TValue> | Options<TValue> | string[] | number[] | undefined
|
||||
|
||||
/**
|
||||
* the option property to use for the value
|
||||
* @default "value"
|
||||
*/
|
||||
valueKey?: string;
|
||||
>valueKey : string | undefined
|
||||
|
||||
/**
|
||||
* function which returns a custom way to render the value selected
|
||||
* @default false
|
||||
*/
|
||||
valueRenderer?: ValueRendererHandler<TValue>;
|
||||
>valueRenderer : ValueRendererHandler<TValue> | undefined
|
||||
|
||||
/**
|
||||
* optional style to apply to the control
|
||||
*/
|
||||
style?: React.CSSProperties;
|
||||
>style : React.CSSProperties | undefined
|
||||
>React : any
|
||||
|
||||
/**
|
||||
* optional tab index of the control
|
||||
*/
|
||||
tabIndex?: string | number;
|
||||
>tabIndex : string | number | undefined
|
||||
|
||||
/**
|
||||
* value component to render
|
||||
*/
|
||||
valueComponent?: ValueComponentType<TValue>;
|
||||
>valueComponent : React.ComponentClass<ValueComponentProps<TValue>, any> | React.StatelessComponent<ValueComponentProps<TValue>> | undefined
|
||||
|
||||
/**
|
||||
* optional style to apply to the component wrapper
|
||||
*/
|
||||
wrapperStyle?: React.CSSProperties;
|
||||
>wrapperStyle : React.CSSProperties | undefined
|
||||
>React : any
|
||||
|
||||
/**
|
||||
* onClick handler for value labels: function (value, event) {}
|
||||
*/
|
||||
onValueClick?: OnValueClickHandler<TValue>;
|
||||
>onValueClick : OnValueClickHandler<TValue> | undefined
|
||||
|
||||
/**
|
||||
* pass the value to onChange as a simple value (legacy pre 1.0 mode), defaults to false
|
||||
*/
|
||||
simpleValue?: boolean;
|
||||
>simpleValue : boolean | undefined
|
||||
}
|
||||
|
||||
|
|
@ -0,0 +1,610 @@
|
|||
// @strict: true
|
||||
// @jsx: react
|
||||
// @skipLibCheck: true
|
||||
/// <reference path="/.lib/react16.d.ts" />
|
||||
|
||||
import * as React from "react";
|
||||
|
||||
|
||||
interface Props<T extends OptionValues> {
|
||||
value?: Option<T> | T;
|
||||
onChange?(value: Option<T> | undefined): void;
|
||||
}
|
||||
|
||||
type ExtractValueType<T> = T extends ReactSelectProps<infer U> ? U : never;
|
||||
|
||||
export type ReactSingleSelectProps<
|
||||
WrappedProps extends ReactSelectProps<any>
|
||||
> = Overwrite<
|
||||
Omit<WrappedProps, "multi">,
|
||||
Props<ExtractValueType<WrappedProps>>
|
||||
>;
|
||||
|
||||
export function createReactSingleSelect<
|
||||
WrappedProps extends ReactSelectProps<any>
|
||||
>(
|
||||
WrappedComponent: React.ComponentType<WrappedProps>
|
||||
): React.ComponentType<ReactSingleSelectProps<WrappedProps>> {
|
||||
return (props) => {
|
||||
return (
|
||||
<ReactSelectClass<ExtractValueType<WrappedProps>>
|
||||
{...props}
|
||||
multi={false}
|
||||
autosize={false}
|
||||
value={props.value}
|
||||
onChange={(value) => {
|
||||
if (props.onChange) {
|
||||
props.onChange(value === null ? undefined : value);
|
||||
}
|
||||
}}
|
||||
/>
|
||||
);
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
// Copied from "type-zoo" version 3.4.0
|
||||
export type Omit<T, K extends keyof any> = T extends any ? Pick<T, Exclude<keyof T, K>> : never;
|
||||
export type Overwrite<T, U> = Omit<T, keyof T & keyof U> & U;
|
||||
|
||||
// Everything below here copied from "@types/react-select" version 1.3.4
|
||||
declare class ReactSelectClass<TValue = OptionValues> extends React.Component<ReactSelectProps<TValue>> {
|
||||
focus(): void;
|
||||
setValue(value: Option<TValue>): void;
|
||||
}
|
||||
|
||||
export type OptionComponentType<TValue = OptionValues> = React.ComponentType<OptionComponentProps<TValue>>;
|
||||
export type ValueComponentType<TValue = OptionValues> = React.ComponentType<ValueComponentProps<TValue>>;
|
||||
|
||||
export type HandlerRendererResult = JSX.Element | null | false;
|
||||
|
||||
// Handlers
|
||||
export type FocusOptionHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
export type SelectValueHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
export type ArrowRendererHandler = (props: ArrowRendererProps) => HandlerRendererResult;
|
||||
export type ClearRendererHandler = () => HandlerRendererResult;
|
||||
export type FilterOptionHandler<TValue = OptionValues> = (option: Option<TValue>, filter: string) => boolean;
|
||||
export type FilterOptionsHandler<TValue = OptionValues> = (options: Options<TValue>, filter: string, currentValues: Options<TValue>) => Options<TValue>;
|
||||
export type InputRendererHandler = (props: { [key: string]: any }) => HandlerRendererResult;
|
||||
export type MenuRendererHandler<TValue = OptionValues> = (props: MenuRendererProps<TValue>) => HandlerRendererResult;
|
||||
export type OnCloseHandler = () => void;
|
||||
export type OnInputChangeHandler = (inputValue: string) => string;
|
||||
export type OnInputKeyDownHandler = React.KeyboardEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
export type OnMenuScrollToBottomHandler = () => void;
|
||||
export type OnOpenHandler = () => void;
|
||||
export type OnFocusHandler = React.FocusEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
export type OnBlurHandler = React.FocusEventHandler<HTMLDivElement | HTMLInputElement>;
|
||||
export type OptionRendererHandler<TValue = OptionValues> = (option: Option<TValue>) => HandlerRendererResult;
|
||||
export type ValueRendererHandler<TValue = OptionValues> = (option: Option<TValue>, index?: number) => HandlerRendererResult;
|
||||
export type OnValueClickHandler<TValue = OptionValues> = (option: Option<TValue>, event: React.MouseEvent<HTMLAnchorElement>) => void;
|
||||
export type IsOptionUniqueHandler<TValue = OptionValues> = (arg: { option: Option<TValue>, options: Options<TValue>, labelKey: string, valueKey: string }) => boolean;
|
||||
export type IsValidNewOptionHandler = (arg: { label: string }) => boolean;
|
||||
export type NewOptionCreatorHandler<TValue = OptionValues> = (arg: { label: string, labelKey: string, valueKey: string }) => Option<TValue>;
|
||||
export type PromptTextCreatorHandler = (filterText: string) => string;
|
||||
export type ShouldKeyDownEventCreateNewOptionHandler = (arg: { keyCode: number }) => boolean;
|
||||
|
||||
export type OnChangeSingleHandler<TValue = OptionValues> = OnChangeHandler<TValue, Option<TValue>>;
|
||||
export type OnChangeMultipleHandler<TValue = OptionValues> = OnChangeHandler<TValue, Options<TValue>>;
|
||||
export type OnChangeHandler<TValue = OptionValues, TOption = Option<TValue> | Options<TValue>> = (newValue: TOption | null) => void;
|
||||
export type OnNewOptionClickHandler<TValue = OptionValues> = (option: Option<TValue>) => void;
|
||||
|
||||
export type LoadOptionsHandler<TValue = OptionValues> = LoadOptionsAsyncHandler<TValue> | LoadOptionsLegacyHandler<TValue>;
|
||||
export type LoadOptionsAsyncHandler<TValue = OptionValues> = (input: string) => Promise<AutocompleteResult<TValue>>;
|
||||
export type LoadOptionsLegacyHandler<TValue = OptionValues> = (input: string, callback: (err: any, result: AutocompleteResult<TValue>) => void) => void;
|
||||
|
||||
export interface AutocompleteResult<TValue = OptionValues> {
|
||||
/** The search-results to be displayed */
|
||||
options: Options<TValue>;
|
||||
/**
|
||||
* Should be set to true, if and only if a longer query with the same prefix
|
||||
* would return a subset of the results
|
||||
* If set to true, more specific queries will not be sent to the server.
|
||||
*/
|
||||
complete: boolean;
|
||||
}
|
||||
|
||||
export type Options<TValue = OptionValues> = Array<Option<TValue>>;
|
||||
|
||||
export interface Option<TValue = OptionValues> {
|
||||
/** Text for rendering */
|
||||
label?: string;
|
||||
/** Value for searching */
|
||||
value?: TValue;
|
||||
/**
|
||||
* Allow this option to be cleared
|
||||
* @default true
|
||||
*/
|
||||
clearableValue?: boolean;
|
||||
/**
|
||||
* Do not allow this option to be selected
|
||||
* @default false
|
||||
*/
|
||||
disabled?: boolean;
|
||||
/**
|
||||
* In the event that a custom menuRenderer is provided, Option should be able
|
||||
* to accept arbitrary key-value pairs. See react-virtualized-select.
|
||||
*/
|
||||
[property: string]: any;
|
||||
}
|
||||
|
||||
export type OptionValues = string | number | boolean;
|
||||
|
||||
export interface MenuRendererProps<TValue = OptionValues> {
|
||||
/**
|
||||
* The currently focused option; should be visible in the menu by default.
|
||||
* default {}
|
||||
*/
|
||||
focusedOption: Option<TValue>;
|
||||
|
||||
/**
|
||||
* Callback to focus a new option; receives the option as a parameter.
|
||||
*/
|
||||
focusOption: FocusOptionHandler<TValue>;
|
||||
|
||||
/**
|
||||
* Option labels are accessible with this string key.
|
||||
*/
|
||||
labelKey: string;
|
||||
|
||||
/**
|
||||
* Ordered array of options to render.
|
||||
*/
|
||||
options: Options<TValue>;
|
||||
|
||||
/**
|
||||
* Callback to select a new option; receives the option as a parameter.
|
||||
*/
|
||||
selectValue: SelectValueHandler<TValue>;
|
||||
|
||||
/**
|
||||
* Array of currently selected options.
|
||||
*/
|
||||
valueArray: Options<TValue>;
|
||||
|
||||
/**
|
||||
* Callback to remove selection from option; receives the option as a parameter.
|
||||
*/
|
||||
removeValue: SelectValueHandler<TValue>;
|
||||
|
||||
/**
|
||||
* function which returns a custom way to render the options in the menu
|
||||
*/
|
||||
optionRenderer: OptionRendererHandler<TValue>;
|
||||
}
|
||||
|
||||
export interface OptionComponentProps<TValue = OptionValues> {
|
||||
/**
|
||||
* Classname(s) to apply to the option component.
|
||||
*/
|
||||
className?: string;
|
||||
|
||||
/**
|
||||
* Currently focused option.
|
||||
*/
|
||||
focusOption?: Option<TValue>;
|
||||
|
||||
inputValue?: string;
|
||||
instancePrefix?: string;
|
||||
|
||||
/**
|
||||
* True if this option is disabled.
|
||||
*/
|
||||
isDisabled?: boolean;
|
||||
|
||||
/**
|
||||
* True if this option is focused.
|
||||
*/
|
||||
isFocused?: boolean;
|
||||
|
||||
/**
|
||||
* True if this option is selected.
|
||||
*/
|
||||
isSelected?: boolean;
|
||||
|
||||
/**
|
||||
* Callback to be invoked when this option is focused.
|
||||
*/
|
||||
onFocus?: (option: Option<TValue>, event: any) => void;
|
||||
|
||||
/**
|
||||
* Callback to be invoked when this option is selected.
|
||||
*/
|
||||
onSelect?: (option: Option<TValue>, event: any) => void;
|
||||
|
||||
/**
|
||||
* Option to be rendered by this component.
|
||||
*/
|
||||
option: Option<TValue>;
|
||||
|
||||
/**
|
||||
* Index of the option being rendered in the list
|
||||
*/
|
||||
optionIndex?: number;
|
||||
|
||||
/**
|
||||
* Callback to invoke when removing an option from a multi-selection. (Not necessarily the one
|
||||
* being rendered)
|
||||
*/
|
||||
removeValue?: (value: TValue | TValue[]) => void;
|
||||
|
||||
/**
|
||||
* Callback to invoke to select an option. (Not necessarily the one being rendered)
|
||||
*/
|
||||
selectValue?: (value: TValue | TValue[]) => void;
|
||||
}
|
||||
|
||||
export interface ArrowRendererProps {
|
||||
/**
|
||||
* Arrow mouse down event handler.
|
||||
*/
|
||||
onMouseDown: React.MouseEventHandler<any>;
|
||||
|
||||
/**
|
||||
* whether the Select is open or not.
|
||||
*/
|
||||
isOpen: boolean;
|
||||
}
|
||||
|
||||
export interface ValueComponentProps<TValue = OptionValues> {
|
||||
disabled: ReactSelectProps<TValue>['disabled'];
|
||||
id: string;
|
||||
instancePrefix: string;
|
||||
onClick: OnValueClickHandler<TValue> | null;
|
||||
onRemove?: SelectValueHandler<TValue>;
|
||||
placeholder: ReactSelectProps<TValue>['placeholder'];
|
||||
value: Option<TValue>;
|
||||
values?: Array<Option<TValue>>;
|
||||
}
|
||||
|
||||
export interface ReactSelectProps<TValue = OptionValues> extends React.Props<ReactSelectClass<TValue>> {
|
||||
/**
|
||||
* text to display when `allowCreate` is true.
|
||||
* @default 'Add "{label}"?'
|
||||
*/
|
||||
addLabelText?: string;
|
||||
/**
|
||||
* renders a custom drop-down arrow to be shown in the right-hand side of the select.
|
||||
* @default undefined
|
||||
*/
|
||||
arrowRenderer?: ArrowRendererHandler | null;
|
||||
/**
|
||||
* blurs the input element after a selection has been made. Handy for lowering the keyboard on mobile devices.
|
||||
* @default false
|
||||
*/
|
||||
autoBlur?: boolean;
|
||||
/**
|
||||
* autofocus the component on mount
|
||||
* @deprecated. Use autoFocus instead
|
||||
* @default false
|
||||
*/
|
||||
autofocus?: boolean;
|
||||
/**
|
||||
* autofocus the component on mount
|
||||
* @default false
|
||||
*/
|
||||
autoFocus?: boolean;
|
||||
/**
|
||||
* If enabled, the input will expand as the length of its value increases
|
||||
*/
|
||||
autosize?: boolean;
|
||||
/**
|
||||
* whether pressing backspace removes the last item when there is no input value
|
||||
* @default true
|
||||
*/
|
||||
backspaceRemoves?: boolean;
|
||||
/**
|
||||
* Message to use for screenreaders to press backspace to remove the current item
|
||||
* {label} is replaced with the item label
|
||||
* @default "Press backspace to remove..."
|
||||
*/
|
||||
backspaceToRemoveMessage?: string;
|
||||
/**
|
||||
* CSS className for the outer element
|
||||
*/
|
||||
className?: string;
|
||||
/**
|
||||
* Prefix prepended to element default className if no className is defined
|
||||
*/
|
||||
classNamePrefix?: string;
|
||||
/**
|
||||
* title for the "clear" control when `multi` is true
|
||||
* @default "Clear all"
|
||||
*/
|
||||
clearAllText?: string;
|
||||
/**
|
||||
* Renders a custom clear to be shown in the right-hand side of the select when clearable true
|
||||
* @default undefined
|
||||
*/
|
||||
clearRenderer?: ClearRendererHandler;
|
||||
/**
|
||||
* title for the "clear" control
|
||||
* @default "Clear value"
|
||||
*/
|
||||
clearValueText?: string;
|
||||
/**
|
||||
* whether to close the menu when a value is selected
|
||||
* @default true
|
||||
*/
|
||||
closeOnSelect?: boolean;
|
||||
/**
|
||||
* whether it is possible to reset value. if enabled, an X button will appear at the right side.
|
||||
* @default true
|
||||
*/
|
||||
clearable?: boolean;
|
||||
/**
|
||||
* whether backspace removes an item if there is no text input
|
||||
* @default true
|
||||
*/
|
||||
deleteRemoves?: boolean;
|
||||
/**
|
||||
* delimiter to use to join multiple values
|
||||
* @default ","
|
||||
*/
|
||||
delimiter?: string;
|
||||
/**
|
||||
* whether the Select is disabled or not
|
||||
* @default false
|
||||
*/
|
||||
disabled?: boolean;
|
||||
/**
|
||||
* whether escape clears the value when the menu is closed
|
||||
* @default true
|
||||
*/
|
||||
escapeClearsValue?: boolean;
|
||||
/**
|
||||
* method to filter a single option
|
||||
*/
|
||||
filterOption?: FilterOptionHandler<TValue>;
|
||||
/**
|
||||
* method to filter the options array
|
||||
*/
|
||||
filterOptions?: FilterOptionsHandler<TValue>;
|
||||
/**
|
||||
* id for the underlying HTML input element
|
||||
* @default undefined
|
||||
*/
|
||||
id?: string;
|
||||
/**
|
||||
* whether to strip diacritics when filtering
|
||||
* @default true
|
||||
*/
|
||||
ignoreAccents?: boolean;
|
||||
/**
|
||||
* whether to perform case-insensitive filtering
|
||||
* @default true
|
||||
*/
|
||||
ignoreCase?: boolean;
|
||||
/**
|
||||
* custom attributes for the Input (in the Select-control) e.g: {'data-foo': 'bar'}
|
||||
* @default {}
|
||||
*/
|
||||
inputProps?: { [key: string]: any };
|
||||
/**
|
||||
* renders a custom input
|
||||
*/
|
||||
inputRenderer?: InputRendererHandler;
|
||||
/**
|
||||
* allows for synchronization of component id's on server and client.
|
||||
* @see https://github.com/JedWatson/react-select/pull/1105
|
||||
*/
|
||||
instanceId?: string;
|
||||
/**
|
||||
* whether the Select is loading externally or not (such as options being loaded).
|
||||
* if true, a loading spinner will be shown at the right side.
|
||||
* @default false
|
||||
*/
|
||||
isLoading?: boolean;
|
||||
/**
|
||||
* (legacy mode) joins multiple values into a single form field with the delimiter
|
||||
* @default false
|
||||
*/
|
||||
joinValues?: boolean;
|
||||
/**
|
||||
* the option property to use for the label
|
||||
* @default "label"
|
||||
*/
|
||||
labelKey?: string;
|
||||
/**
|
||||
* (any, start) match the start or entire string when filtering
|
||||
* @default "any"
|
||||
*/
|
||||
matchPos?: string;
|
||||
/**
|
||||
* (any, label, value) which option property to filter on
|
||||
* @default "any"
|
||||
*/
|
||||
matchProp?: string;
|
||||
/**
|
||||
* buffer of px between the base of the dropdown and the viewport to shift if menu doesnt fit in viewport
|
||||
* @default 0
|
||||
*/
|
||||
menuBuffer?: number;
|
||||
/**
|
||||
* optional style to apply to the menu container
|
||||
*/
|
||||
menuContainerStyle?: React.CSSProperties;
|
||||
/**
|
||||
* renders a custom menu with options
|
||||
*/
|
||||
menuRenderer?: MenuRendererHandler<TValue>;
|
||||
/**
|
||||
* optional style to apply to the menu
|
||||
*/
|
||||
menuStyle?: React.CSSProperties;
|
||||
/**
|
||||
* multi-value input
|
||||
* @default false
|
||||
*/
|
||||
multi?: boolean;
|
||||
/**
|
||||
* field name, for hidden `<input>` tag
|
||||
*/
|
||||
name?: string;
|
||||
/**
|
||||
* placeholder displayed when there are no matching search results or a falsy value to hide it
|
||||
* @default "No results found"
|
||||
*/
|
||||
noResultsText?: string | JSX.Element;
|
||||
/**
|
||||
* onBlur handler: function (event) {}
|
||||
*/
|
||||
onBlur?: OnBlurHandler;
|
||||
/**
|
||||
* whether to clear input on blur or not
|
||||
* @default true
|
||||
*/
|
||||
onBlurResetsInput?: boolean;
|
||||
/**
|
||||
* whether the input value should be reset when options are selected.
|
||||
* Also input value will be set to empty if 'onSelectResetsInput=true' and
|
||||
* Select will get new value that not equal previous value.
|
||||
* @default true
|
||||
*/
|
||||
onSelectResetsInput?: boolean;
|
||||
/**
|
||||
* whether to clear input when closing the menu through the arrow
|
||||
* @default true
|
||||
*/
|
||||
onCloseResetsInput?: boolean;
|
||||
/**
|
||||
* onChange handler: function (newValue) {}
|
||||
*/
|
||||
onChange?: OnChangeHandler<TValue>;
|
||||
/**
|
||||
* fires when the menu is closed
|
||||
*/
|
||||
onClose?: OnCloseHandler;
|
||||
/**
|
||||
* onFocus handler: function (event) {}
|
||||
*/
|
||||
onFocus?: OnFocusHandler;
|
||||
/**
|
||||
* onInputChange handler: function (inputValue) {}
|
||||
*/
|
||||
onInputChange?: OnInputChangeHandler;
|
||||
/**
|
||||
* onInputKeyDown handler: function (keyboardEvent) {}
|
||||
*/
|
||||
onInputKeyDown?: OnInputKeyDownHandler;
|
||||
/**
|
||||
* fires when the menu is scrolled to the bottom; can be used to paginate options
|
||||
*/
|
||||
onMenuScrollToBottom?: OnMenuScrollToBottomHandler;
|
||||
/**
|
||||
* fires when the menu is opened
|
||||
*/
|
||||
onOpen?: OnOpenHandler;
|
||||
/**
|
||||
* boolean to enable opening dropdown when focused
|
||||
* @default false
|
||||
*/
|
||||
openOnClick?: boolean;
|
||||
/**
|
||||
* open the options menu when the input gets focus (requires searchable = true)
|
||||
* @default true
|
||||
*/
|
||||
openOnFocus?: boolean;
|
||||
/**
|
||||
* className to add to each option component
|
||||
*/
|
||||
optionClassName?: string;
|
||||
/**
|
||||
* option component to render in dropdown
|
||||
*/
|
||||
optionComponent?: OptionComponentType<TValue>;
|
||||
/**
|
||||
* function which returns a custom way to render the options in the menu
|
||||
*/
|
||||
optionRenderer?: OptionRendererHandler<TValue>;
|
||||
/**
|
||||
* array of Select options
|
||||
* @default false
|
||||
*/
|
||||
options?: Options<TValue>;
|
||||
/**
|
||||
* number of options to jump when using page up/down keys
|
||||
* @default 5
|
||||
*/
|
||||
pageSize?: number;
|
||||
/**
|
||||
* field placeholder, displayed when there's no value
|
||||
* @default "Select..."
|
||||
*/
|
||||
placeholder?: string | JSX.Element;
|
||||
/**
|
||||
* whether the selected option is removed from the dropdown on multi selects
|
||||
* @default true
|
||||
*/
|
||||
removeSelected?: boolean;
|
||||
/**
|
||||
* applies HTML5 required attribute when needed
|
||||
* @default false
|
||||
*/
|
||||
required?: boolean;
|
||||
/**
|
||||
* value to use when you clear the control
|
||||
*/
|
||||
resetValue?: any;
|
||||
/**
|
||||
* use react-select in right-to-left direction
|
||||
* @default false
|
||||
*/
|
||||
rtl?: boolean;
|
||||
/**
|
||||
* whether the viewport will shift to display the entire menu when engaged
|
||||
* @default true
|
||||
*/
|
||||
scrollMenuIntoView?: boolean;
|
||||
/**
|
||||
* whether to enable searching feature or not
|
||||
* @default true;
|
||||
*/
|
||||
searchable?: boolean;
|
||||
/**
|
||||
* whether to select the currently focused value when the [tab] key is pressed
|
||||
*/
|
||||
tabSelectsValue?: boolean;
|
||||
/**
|
||||
* initial field value
|
||||
*/
|
||||
value?: Option<TValue> | Options<TValue> | string | string[] | number | number[] | boolean;
|
||||
/**
|
||||
* the option property to use for the value
|
||||
* @default "value"
|
||||
*/
|
||||
valueKey?: string;
|
||||
/**
|
||||
* function which returns a custom way to render the value selected
|
||||
* @default false
|
||||
*/
|
||||
valueRenderer?: ValueRendererHandler<TValue>;
|
||||
/**
|
||||
* optional style to apply to the control
|
||||
*/
|
||||
style?: React.CSSProperties;
|
||||
|
||||
/**
|
||||
* optional tab index of the control
|
||||
*/
|
||||
tabIndex?: string | number;
|
||||
|
||||
/**
|
||||
* value component to render
|
||||
*/
|
||||
valueComponent?: ValueComponentType<TValue>;
|
||||
|
||||
/**
|
||||
* optional style to apply to the component wrapper
|
||||
*/
|
||||
wrapperStyle?: React.CSSProperties;
|
||||
|
||||
/**
|
||||
* onClick handler for value labels: function (value, event) {}
|
||||
*/
|
||||
onValueClick?: OnValueClickHandler<TValue>;
|
||||
|
||||
/**
|
||||
* pass the value to onChange as a simple value (legacy pre 1.0 mode), defaults to false
|
||||
*/
|
||||
simpleValue?: boolean;
|
||||
}
|
||||
Loading…
Reference in a new issue