default filter as caseInsensitive ?

[Sharlaan]

default filter is set as caseSensistive in v0.4.1

Would not it be better as caseInsensitive by default ?
(would just have to add .toLowerCase() to the filter function)

[leMaik]

Indeed, that would be cool. You'd have to use .toLowerCase() on the value the user typed and the auto complete values for comparison, though.
Do you want to create a PR for this?

[Sharlaan]

me and PR = 2 ...

[leMaik]

@Sharlaan What? 😄

[Sharlaan]

Maybe something like this ?

static defaultProps = {
    ...
    filter: AutoComplete.caseInsensitiveFilter,
    ...
}

[leMaik]

The filter needs to match every value if the input is empty so that the dropdown menu opens automatically on focus. The default filters of AutoComplete don't do this. That's why we have to provide our own default filter.

[leMaik]

@Sharlaan Re-using AutoCompletes filters sounds good to me. I'll change the way the auto-open feature works (and resolve this issue while I'm on it). 👍

[Sharlaan]

Thanks but my current tests seem to show the filter property doesnot take any provided function:

<ChipInput
  filter={(search, key) => search === '' || key.toLowerCase().includes(search.toLowerCase())}
/>

... still gives caseSensistive behavior while should be insensitive.

[leMaik]

@Sharlaan I'm currently fixing that. 👍

[Sharlaan]

Impressive answer speed 👍

[leMaik]

This works now:

<ChipInput
  openOnFocus
  filter={AutoComplete.fuzzyFilter}
  dataSource={['alpha', 'beta']}
  hintText="Try typing apha..." //sic!
/>

[Sharlaan]

Great job, default caseInsensitive works perfect !

but... filter={AutoComplete.fuzzyFilter} means user has to import { AutoComplete } from 'material-ui' on top of importing material-chip-input....

That's why i suggested the enum in Issue #18 .

[leMaik]

@Sharlaan I don't wand to add any filter to this component. Importing AutoComplete adds no overhead at all, as this component also uses AutoComplete.

[Sharlaan]

import React from 'react'
import { AutoComplete } from 'material-ui'
import ChipInput from 'material-chip-input'

const Container = (props) => {
  return (
    <ChipInput filter={AutoComplete.fuzzyFilter} />
  )
}

compared to:

import React from 'react'
import ChipInput from 'material-chip-input'

const Container = (props) => {
  return (
    <ChipInput filter={'fuzzyFilter'} />
  )
}

[leMaik]

Wow, that's one line in your code vs. more code I have to maintain. 👎 I'm still not convinced. What's so bad about importing stuff? Using libraries and re-using code is great! 😄

[Sharlaan]

true it's more typing for you, i just meant AutoComplete reference should be purely internal.

[leMaik]

Oh, I see what you mean. You don't want to depend on AutoComplete because it's just an implementation detail? Just think of the filter function as of any function, where AutoComplete.fuzzyFilter (and the other functions) fortunately have the same interface and thus can be used as such any function. :)

It's much more flexible this way, as it allows to use any function and not just some fixed set of functions.

[Sharlaan]

Ok got it, sorry i didnot realize the "single interface for any filter function" pattern.
Fine with that.