feat(lookup): add lookup

[MaximBalaganskiy]

Demo is at the bottom https://maximbalaganskiy.github.io/aurelia-ux-demo/#/components

The dropdown pops up at the top if there is little space below.

[ben-girardet]

Love it. Great work.

I've done a quick tryout on your demo. I think it would help to have a little margin with the window. That would increase readability of the popup. Would be amazing to have it as a themable property

Also a question, what is the strategy for lookup with hundreds or thousands of options ? Would be helpful to have a little help regarding the usage that you have put in place. Seems like you have make it configurable but didn't understand yet.

[MaximBalaganskiy]

There is a templatable error part. If there are too many records a consumer would throw an error in the options function and this would display an error option with an error message

[MaximBalaganskiy]

The component supports either an array or a function returning a promise for an array

[MaximBalaganskiy]

@ben-girardet added more theme properties

One thing lookup and select still suffer from is scrolling - wheel event is fine, but not scrolling with the bar. window.scroll does not happen because router-view is being scrolled.

[MaximBalaganskiy]

Angular solves it by adding a backdrop which covers the whole window and catches all scrolling events.

[MaximBalaganskiy]

Haha, easy solution - capture the event :)

[bigopon]

@MaximBalaganskiy @ben-girardet i think for the list positioning, we better use the positioning service that was recently added. Thoughts?

Also, we need to take care of resize/orientation change event as well, to re-position the list

[MaximBalaganskiy]

@bigopon not sure which positioning service you have in mind

[MaximBalaganskiy]

@bigopon anchor is now updated on resize. Mind you, in some cases this causes scrolling which hides the popup

[bigopon]

Here is the PR that added it #254

For scrolling that hides popup, we can follow native on this I think. At the moment, any moment you scroll outside (we can capture this event) the popup of a <select/> hides immediately & completely.

[MaximBalaganskiy]

Then scrolling is already like native

[bigopon]

Oh I see what you meant. We can do extra bit (not sure 100%): after resizing/moving, we call optionElement.scrollIntoView()?

[MaximBalaganskiy]

Would need trickery to suppress scroll event

[bigopon]

Mind you, in some cases this causes scrolling which hides the popup

Did you meant when moving the popup/resizing it, sometimes it cause the popup to scroll and hide currently selected option?

[MaximBalaganskiy]

When window is resized the content is scrolled and popup closes

[bigopon]

Thanks @MaximBalaganskiy for the nice work