Skip to content

Releases: talk2rajeev/rt-autocomplete

0.1.0

29 Sep 14:16
Compare
Choose a tag to compare
  • Option provided to pass Custom List Item as props using callback renderCustomListItem={CustomListItem}
const CustomListItem = (props: Option) => {
    return (
        <div className="">
            {props.value}
        </div>
    )        
}

<AutoComplete 
      ...
      renderCustomListItem={CustomListItem}
      ....
  />
  • onSelect option provided
const onSelect = (item: Option) => {
   console.log(item.id, item.value)
}

<AutoComplete 
      ...
      onSelect={onSelect}
      ...
  />
  • image option provided with sub title
export type Option = {
  id: string;
  value: string;
  img?: string;
  secondaryValue?: string;
};


const CustomListItemWithImage = (props: Option) => {
    return (
        <div className="listitem">
            <div style={{display: 'grid', gridTemplateColumns: '50px auto', gridTemplateRows: 35}}>
                <div><img src={props.img} alt="" style={{borderRadius: '50%', height: 40}}/></div>
                <div>
                    <div style={{fontSize: 14}}>{props.value}</div>
                    <div style={{fontSize: 12, color: '#777'}}>{props.secondaryValue}</div>
                </div>
            </div>
        </div>
    )        
}

<AutoComplete 
      ...
      renderCustomListItem={CustomListItemWithImage}
      ...
  />

0.0.9

26 Sep 06:37
Compare
Choose a tag to compare

mire item link implemented

0.0.85

22 Sep 16:23
Compare
Choose a tag to compare

CustomDropdownIcon option

props type description
onkeypress function query: string, delay: number (optional)
onblur function optional, (query: string)
onfocus function optional,
listItems Array[] { value: string
defaultValue string optional, default value to pre-populate
maxItem number optional, show more items link if no
of items are large
showDropdownIcon boolean optional, show/hide icon
CustomDropdownIcon ReactElement optional,

0.0.83

21 Sep 15:41
Compare
Choose a tag to compare
props type description
onkeypress function query: string, delay: number (optional)
onblur function query: string
onfocus function
listItems Array[] { value: string
defaultValue string default value to pre-populate
maxItem number show maxItems if no of items are large
showDropdownIcon function show/hide showDropdownIcon