dropdown fails inside scrollable table

[kikonen]

When dropdown is opened inside table, it may be cut-off by scrollable table boundaries.

Likely only way to fix this would be to make popup "absolute" and float it over whole page. That however affects scrolling behaviour, since browser won't automatically keep popup in sync with widget location.

Thus should make this "absolute" mode optional, to be applied only in the case when it's actually needed.

[kikonen]

Problem is actually even more tricky, since order to do this, popup must be opened in the context of approriate root (ex. document.body) otherwise it will be cut-off by scrollable viewport.

Not sure, svelte even supports doing such now.

[kikonen]

Sounds related: sveltejs/svelte#1133

[kikonen]

Plan

• Give separate "config.container" parameter to widget creation
• separate "select control" and "dropdown" into separate components
• insert "dropdown" component into "config.container" element, to be contain popup
• use some svelte store or (passing variables to "owned" components?!?) to pass "display list" to popup component.

[kikonen]

Actual plan

• "position:fixed" and event listening

Trying out this approach

[kikonen]

done

• "position: fixed" works reasonably (With minimal test setup)

todo

• only window scrolling handled, not scrolling of scrollpane where table is contained.