3 ms·

I like small libraries which are just a single file. That's why I am maintaining a fork of the original typeahead library from bootstrap. It is less than 400 li

by mg 3y ago

I like small libraries which are just a single file. That's why I am maintaining a fork of the original typeahead library from bootstrap. It is less than 400 lines of javascript: https://github.com/no-gravity/0g-typeahead https://github.com/no-gravity/0g-typeahead It is humming away nicely, doing hundreds of thousands of typeaheads each day across my websites. I always think I should finally do the work and get rid of the jquery dependency. But so far, I just did not got around doing it.

1337shadow 3y ago
Here's one in 228 lines with an additional 190 to support hidden <selects> https://yourlabs.io/oss/autocomplete-light/-/blob/master/autocomplete-light.js https://yourlabs.io/oss/autocomplete-light/-/blob/master/aut... It's a trivial web component in vanilla js, it's tested in python: https://yourlabs.io/oss/autocomplete-light/-/blob/master/test_alight.py https://yourlabs.io/oss/autocomplete-light/-/blob/master/tes...
lordofmoria 3y ago
I just went through looking for, and failing to find, a good typeahead library. I could not find one I liked. Typeahead is probably the most sophisticated UI element, and the most demanding in terms of what users expect. Two pro tips: 1. Apparently this is also called “combo box” - Tailwind has one: https://tailwindui.com/components/application-ui/forms/comboboxes https://tailwindui.com/components/application-ui/forms/combo... I eventually rolled my own using tailwind’s scaffold: it ended up being about 300 lines of JS to handle things like keyboard actions, pressing enter, focus/non-focus, denounce search. But the benefit? It does exactly what I want.
2Gkashmiri 3y ago
Nice. Your repo doesn't have a license.
- mg 3y ago
  Good point. The license for the actual library is on top of the file: https://github.com/no-gravity/0g-typeahead/blob/master/0g-typeahead.js https://github.com/no-gravity/0g-typeahead/blob/master/0g-ty... The project is pretty much that one file. Twitter put the license there, so it did never cross my mind to remove it and put it into an extra file. But it might make sense to put the whole repo (which is just the typeahead.js file plus a little demo) under that license to avoid confusion.

by mg 3y ago

1337shadow 3y ago

Here's one in 228 lines with an additional 190 to support hidden <selects> https://yourlabs.io/oss/autocomplete-light/-/blob/master/autocomplete-light.js https://yourlabs.io/oss/autocomplete-light/-/blob/master/aut... It's a trivial web component in vanilla js, it's tested in python: https://yourlabs.io/oss/autocomplete-light/-/blob/master/test_alight.py https://yourlabs.io/oss/autocomplete-light/-/blob/master/tes...

lordofmoria 3y ago

I just went through looking for, and failing to find, a good typeahead library. I could not find one I liked. Typeahead is probably the most sophisticated UI element, and the most demanding in terms of what users expect. Two pro tips: 1. Apparently this is also called “combo box” - Tailwind has one: https://tailwindui.com/components/application-ui/forms/comboboxes https://tailwindui.com/components/application-ui/forms/combo... I eventually rolled my own using tailwind’s scaffold: it ended up being about 300 lines of JS to handle things like keyboard actions, pressing enter, focus/non-focus, denounce search. But the benefit? It does exactly what I want.

2Gkashmiri 3y ago

Nice. Your repo doesn't have a license.

mg 3y ago
Good point. The license for the actual library is on top of the file: https://github.com/no-gravity/0g-typeahead/blob/master/0g-typeahead.js https://github.com/no-gravity/0g-typeahead/blob/master/0g-ty... The project is pretty much that one file. Twitter put the license there, so it did never cross my mind to remove it and put it into an extra file. But it might make sense to put the whole repo (which is just the typeahead.js file plus a little demo) under that license to avoid confusion.