diff --git a/types/react-autosuggest/index.d.ts b/types/react-autosuggest/index.d.ts index 4c4d6caaed..78c11d6878 100644 --- a/types/react-autosuggest/index.d.ts +++ b/types/react-autosuggest/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-autosuggest 9.3.2 +// Type definitions for react-autosuggest 9.3 // Project: http://react-autosuggest.js.org/ // Definitions by: Nicolas Schmitt // Philip Ottesen @@ -9,11 +9,11 @@ // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.3 -import * as React from 'react' +import * as React from 'react'; declare class Autosuggest extends React.Component> {} -export = Autosuggest +export = Autosuggest; declare namespace Autosuggest { /** @@ -23,56 +23,56 @@ declare namespace Autosuggest { /** @internal */ type Diff = ({ [P in T]: P } & - { [P in U]: never } & { [x: string]: never })[T] + { [P in U]: never } & { [x: string]: never })[T]; /** @internal */ - type Omit = Pick> + type Omit = Pick>; - export interface SuggestionsFetchRequestedParams { - value: string + interface SuggestionsFetchRequestedParams { + value: string; reason: | 'input-changed' | 'input-focused' | 'escape-pressed' | 'suggestions-revealed' - | 'suggestion-selected' + | 'suggestion-selected'; } - export interface RenderSuggestionParams { - query: string - isHighlighted: boolean + interface RenderSuggestionParams { + query: string; + isHighlighted: boolean; } - export interface SuggestionHighlightedParams { - suggestion: any + interface SuggestionHighlightedParams { + suggestion: any; } - export interface ChangeEvent { - newValue: string - method: 'down' | 'up' | 'escape' | 'enter' | 'click' | 'type' + interface ChangeEvent { + newValue: string; + method: 'down' | 'up' | 'escape' | 'enter' | 'click' | 'type'; } - export interface BlurEvent { - highlightedSuggestion: TSuggestion + interface BlurEvent { + highlightedSuggestion: TSuggestion; } - export interface InputProps + interface InputProps extends Omit, 'onChange' | 'onBlur'> { - onChange(event: React.FormEvent, params?: ChangeEvent): void - onBlur?(event: React.FormEvent, params?: BlurEvent): void - value: string - [key: string]: any + onChange(event: React.FormEvent, params?: ChangeEvent): void; + onBlur?(event: React.FormEvent, params?: BlurEvent): void; + value: string; + [key: string]: any; } - export interface SuggestionSelectedEventData { - suggestion: TSuggestion - suggestionValue: string - suggestionIndex: number - sectionIndex: number | null - method: 'click' | 'enter' + interface SuggestionSelectedEventData { + suggestion: TSuggestion; + suggestionValue: string; + suggestionIndex: number; + sectionIndex: number | null; + method: 'click' | 'enter'; } - export type ThemeKey = + type ThemeKey = | 'container' | 'containerOpen' | 'input' @@ -86,120 +86,119 @@ declare namespace Autosuggest { | 'suggestionHighlighted' | 'sectionContainer' | 'sectionContainerFirst' - | 'sectionTitle' + | 'sectionTitle'; - export type Theme = + type Theme = | Record - | Partial> + | Partial>; - export type RenderSuggestionsContainerParams = { + interface RenderSuggestionsContainerParams { containerProps: { - id: string - key: string - ref: any - style: Object - } - children: React.ReactNode - query: string + id: string; + key: string; + ref: any; + style: any; + }; + children: React.ReactNode; + query: string; } - // export types for functions - allowing reuse externally - e.g. as props and bound in the constructor - export type GetSectionSuggestions = (section: any) => TSuggestion[] - export type GetSuggestionValue = (suggestion: TSuggestion) => string - export type OnSuggestionHighlighted = (params: SuggestionHighlightedParams) => void - export type SuggestionsFetchRequested = (request: SuggestionsFetchRequestedParams) => void - export type OnSuggestionsClearRequested = () => void - export type OnSuggestionSelected = ( + // types for functions - allowing reuse externally - e.g. as props and bound in the constructor + type GetSectionSuggestions = (section: any) => TSuggestion[]; + type GetSuggestionValue = (suggestion: TSuggestion) => string; + type OnSuggestionHighlighted = (params: SuggestionHighlightedParams) => void; + type SuggestionsFetchRequested = (request: SuggestionsFetchRequestedParams) => void; + type OnSuggestionsClearRequested = () => void; + type OnSuggestionSelected = ( event: React.FormEvent, data: SuggestionSelectedEventData, - ) => void - export type RenderInputComponent = ( - inputProps: InputProps, - ) => JSX.Element - export type RenderSuggestionsContainer = (params: RenderSuggestionsContainerParams) => JSX.Element - export type RenderSectionTitle = (section: any) => JSX.Element - export type RenderSuggestion = ( + ) => void; + type RenderInputComponent = (inputProps: InputProps) => JSX.Element; + type RenderSuggestionsContainer = (params: RenderSuggestionsContainerParams) => JSX.Element; + type RenderSectionTitle = (section: any) => JSX.Element; + type RenderSuggestion = ( suggestion: TSuggestion, params: RenderSuggestionParams, - ) => JSX.Element - export type ShouldRenderSuggestions = (value: string) => boolean + ) => JSX.Element; + type ShouldRenderSuggestions = (value: string) => boolean; - export interface AutosuggestProps { + interface AutosuggestProps { /** * Set it to true if you'd like to render suggestions even when the input is not focused. */ - alwaysRenderSuggestions?: boolean + alwaysRenderSuggestions?: boolean; /** * Set it to false if you don't want Autosuggest to keep the input focused when suggestions are clicked/tapped. */ - focusInputOnSuggestionClick?: boolean + focusInputOnSuggestionClick?: boolean; /** * Implement it to teach Autosuggest where to find the suggestions for every section. */ - getSectionSuggestions?: GetSectionSuggestions + getSectionSuggestions?: GetSectionSuggestions; /** * Implement it to teach Autosuggest what should be the input value when suggestion is clicked. */ - getSuggestionValue: GetSuggestionValue + getSuggestionValue: GetSuggestionValue; /** * Set it to true if you'd like Autosuggest to automatically highlight the first suggestion. */ - highlightFirstSuggestion?: boolean + highlightFirstSuggestion?: boolean; /** * Use it only if you have multiple Autosuggest components on a page. */ - id?: string + id?: string; /** * Pass through arbitrary props to the input. It must contain at least value and onChange. */ - inputProps: InputProps + inputProps: InputProps; /** * Set it to true if you'd like to display suggestions in multiple sections (with optional titles). */ - multiSection?: boolean + multiSection?: boolean; /** * Will be called every time the highlighted suggestion changes. */ - onSuggestionHighlighted?: OnSuggestionHighlighted + onSuggestionHighlighted?: OnSuggestionHighlighted; /** * Will be called every time you need to recalculate suggestions. */ - onSuggestionsFetchRequested: SuggestionsFetchRequested + onSuggestionsFetchRequested: SuggestionsFetchRequested; /** * Will be called every time you need to set suggestions to []. */ - onSuggestionsClearRequested?: OnSuggestionsClearRequested + onSuggestionsClearRequested?: OnSuggestionsClearRequested; /** * Will be called every time suggestion is selected via mouse or keyboard. */ - onSuggestionSelected?: OnSuggestionSelected + onSuggestionSelected?: OnSuggestionSelected; /** * Use it only if you need to customize the rendering of the input. */ - renderInputComponent?: RenderInputComponent + renderInputComponent?: RenderInputComponent; /** * Use it if you want to customize things inside the suggestions container beyond rendering the suggestions themselves. */ - renderSuggestionsContainer?: RenderSuggestionsContainer + renderSuggestionsContainer?: RenderSuggestionsContainer; /** * Use your imagination to define how section titles are rendered. */ - renderSectionTitle?: RenderSectionTitle + renderSectionTitle?: RenderSectionTitle; /** * Use your imagination to define how suggestions are rendered. */ - renderSuggestion: RenderSuggestion + renderSuggestion: RenderSuggestion; /** - * When the input is focused, Autosuggest will consult this function when to render suggestions. Use it, for example, if you want to display suggestions when input value is at least 2 characters long. + * When the input is focused, Autosuggest will consult this function when to render suggestions. + * Use it, for example, if you want to display suggestions when input value is at least 2 characters long. */ - shouldRenderSuggestions?: ShouldRenderSuggestions + shouldRenderSuggestions?: ShouldRenderSuggestions; /** * These are the suggestions that will be displayed. Items can take an arbitrary shape. */ - suggestions: TSuggestion[] + suggestions: TSuggestion[]; /** * Use your imagination to style the Autosuggest. */ - theme?: Theme + theme?: Theme; } } diff --git a/types/react-autosuggest/react-autosuggest-tests.tsx b/types/react-autosuggest/react-autosuggest-tests.tsx index a8a6268445..753af3a552 100644 --- a/types/react-autosuggest/react-autosuggest-tests.tsx +++ b/types/react-autosuggest/react-autosuggest-tests.tsx @@ -15,7 +15,7 @@ function escapeRegexCharacters(str: string): string { return str.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); } -const LanguageAutosuggest = Autosuggest as { new (): Autosuggest } +const LanguageAutosuggest = Autosuggest as { new (): Autosuggest }; export class ReactAutosuggestBasicTest extends React.Component { // region Fields @@ -347,7 +347,7 @@ interface Person { twitter: string; } -const PersonAutosuggest = Autosuggest as { new (): Autosuggest } +const PersonAutosuggest = Autosuggest as { new (): Autosuggest }; export class ReactAutosuggestCustomTest extends React.Component { // region Fields