[menu] Menu is rendered outside viewport

[mvorisek]

Bug Report

Steps to reproduce

1. open https://ui.atk4.org/demos/data-action/jsactionsgrid.php
2. narrow the browser window height (to about half the table height, not critical)
3. notice, when the menu is opened above, the button are rendered above the current viewport and cannot be clicked

Actual result

Expected result

I would expect the menu to be opened above the source button only if it cannot fit below, but also if it cannot fit above.

If if cannot fit below (and not above), the page height should be extended.

Version

2.9.3 / latest

[lubber-de]

Can you provide a jsfiddle, because the atk page throws a 502 bad gateway

[lubber-de]

If if cannot fit below (and not above), the page height should be extended.

I don't think FUI should change the page height automatically on its own, because that's out of scopr of the dropdown component and most probably interferes with application logic. And we will not resize the browser window, that's part of the application and it's responsive design.

The logic ever since SUI is here

Fomantic-UI/src/definitions/modules/dropdown.js

Lines 3619 to 3628 in 6e78472

	if (onScreen.below) {
	module.verbose('Dropdown can fit in context downward', onScreen);
	canOpenDownward = true;
	} else if (!onScreen.below && !onScreen.above) {
	module.verbose('Dropdown cannot fit in either direction, favoring downward', onScreen);
	canOpenDownward = true;
	} else {
	module.verbose('Dropdown cannot fit below, opening upward', onScreen);
	canOpenDownward = false;
	}

In doubt, you can force a direction via the direction-setting

[mvorisek]

I have updated the repro link.