Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add TypeAhead Component #17

Merged
merged 2 commits into from
Oct 1, 2015
Merged

Add TypeAhead Component #17

merged 2 commits into from
Oct 1, 2015

Conversation

bsbeeks
Copy link
Contributor

@bsbeeks bsbeeks commented Oct 1, 2015

This add a new TypeAhead component to be used to select multiple items from a list.

Example

<TypeAhead
  items={[
    'JPMorgan Chase',
    'Bank of America',
    'Citigroup',
    'Wells Fargo',
    'The Bank of New York Mellon',
    'U.S. Bancorp',
    'HSBC Bank USA',
    'Capital One',
    'PNC Financial Services',
    'State Street Corporation'
  ]}
  placeholderText='Select a Bank'
  preSelectedItems={[
    'Bank of America',
    'Wells Fargo'
  ]}
/>

Props

items Array required
An array of Strings used for the options list. Example:

[  
  'JPMorgan Chase',
  'Bank of America',
  'Citigroup',
   'Wells Fargo',
  'The Bank of New York Mellon'
  'U.S. Bancorp',
  'HSBC Bank USA',
  'Capital One',
  'PNC Financial Services',
  'State Street Corporation'
]

`onItemRemove` _Function_ **optional** A method to be called whenever an item is removed by the user. It will be passed 2 parameters: the item removed, an updated array of selected items. Example:
_handleItemRemoved (item, selectedItems) {
  console.log(item + ' was removed from the list');
}

<TypeAhead
  // ..other props
  onItemRemove={_handleItemRemoved)
/>

`onItemSelect` _Function_ **optional** A method to be called whenever an item is selected by the user. It will be passed 2 parameters: the item selected, an updated array of selected items. Example:
_handleItemSelected (item, selectedItems) {
  console.log(item + ' was selected from the list');
}

<TypeAhead
  // ..other props
  onItemSelect={_handleItemSelected)
/>

`placeholderText` _String_ **optional** Default: 'Select Filters' The text to display by default when no items have been selected.
`preSelectedItems` _Array_ **optional** An array of Strings to be displayed as selected options by default. These values should be contained in the `items` Array. These values will be the starting point of the TypeAhead's selected values state. Once the user begins interacting with the TypeAhead, they will be ignored.

@jmophoto
Copy link
Contributor

jmophoto commented Oct 1, 2015

Looks good to me. :shipit:

@bsbeeks bsbeeks closed this Oct 1, 2015
@bsbeeks bsbeeks reopened this Oct 1, 2015
bsbeeks added a commit that referenced this pull request Oct 1, 2015
@bsbeeks bsbeeks merged commit d60daf4 into master Oct 1, 2015
@bsbeeks bsbeeks deleted the type_ahead branch October 1, 2015 20:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants