diff --git a/types/react-bootstrap-typeahead/index.d.ts b/types/react-bootstrap-typeahead/index.d.ts index 9fa23ac5f5..2c0495ce03 100644 --- a/types/react-bootstrap-typeahead/index.d.ts +++ b/types/react-bootstrap-typeahead/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-bootstrap-typeahead 3.3 +// Type definitions for react-bootstrap-typeahead 3.4 // Project: https://github.com/ericgio/react-bootstrap-typeahead // Definitions by: Guymestef // Rajab Shakirov @@ -6,18 +6,23 @@ // Andreas Richter // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped // TypeScript Version: 2.8 -// TODO: , , , components +// TODO: components import * as React from 'react'; +import * as CSS from 'csstype'; export interface TypeaheadFilterbyProps { - filterBy: string[]; - labelKey: (string | (() => void)); - multiple: boolean; - selected: any[]; - caseSensitive: boolean; - ignoreDiacritics: boolean; - text: string; + filterBy: string[]; + labelKey: (string | (() => void)); + multiple: boolean; + selected: any[]; + caseSensitive: boolean; + ignoreDiacritics: boolean; + text: string; +} + +export interface TypeaheadMenuProps { + text: string; } export interface TypeaheadProps { @@ -149,7 +154,7 @@ export interface TypeaheadProps { renderMenu?: (results: Array, menuProps: any) => any; /* Provides a hook for customized rendering of menu item contents. */ - renderMenuItemChildren?: (option: T, props: TypeaheadProps, index: number) => any; + renderMenuItemChildren?: (option: T, props: TypeaheadMenuProps, index: number) => any; /* Provides a hook for customized rendering of tokens when multiple selections are enabled. */ renderToken?: (selectedItem: T | string, onRemove: () => void) => any; @@ -184,3 +189,34 @@ export interface AsyncTypeaheadProps extends TypeaheadProps { } export const AsyncTypeahead: React.ClassicComponentClass>; + +export interface HighligherProps { + key: string; + search: string; +} + +export const Highlighter: React.ClassicComponentClass>; + +export interface MenuProps { + id: string; + className?: string; + emptyLabel?: string; + innerRef?: string; + maxHeight?: string; + style?: CSS.Properties; +} + +export const Menu: React.ClassicComponentClass>; + +export interface MenuItemProps { + option: T; + position: number; + label?: string; + active?: boolean; + className?: string; + disabled?: boolean; + onClick?: (e: Event) => any; + onMouseDown?: (e: Event) => any; +} + +export const MenuItem: React.ClassicComponentClass>; diff --git a/types/react-bootstrap-typeahead/react-bootstrap-typeahead-tests.tsx b/types/react-bootstrap-typeahead/react-bootstrap-typeahead-tests.tsx index 6c9143dfea..5fcbe15328 100644 --- a/types/react-bootstrap-typeahead/react-bootstrap-typeahead-tests.tsx +++ b/types/react-bootstrap-typeahead/react-bootstrap-typeahead-tests.tsx @@ -1,5 +1,5 @@ import * as React from 'react'; -import { Typeahead } from 'react-bootstrap-typeahead'; +import { Typeahead, Highlighter, Menu, MenuItem } from 'react-bootstrap-typeahead'; const options = [ { name: 'Alabama', population: 4780127, capital: 'Montgomery', region: 'South' }, @@ -36,6 +36,31 @@ class BasicExample extends React.Component { filterBy={(option, props) => (props.text.indexOf(option) !== -1) } placeholder="Choose a state..." /> + + + {option.name} + + } + /> + + + {options.map((o, idx) => ( + + {o.name} + + ))} + + ); }