Menu below and above

Bug, feature request, or proposal:

The class names .mat-menu-below and .mat-menu-above are gone

What is the expected behavior?

The css names should be added to menus when positioned below/above

What is the current behavior?

Donesn't work anymore sine update to AM 6.1.0

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 6.1.0
Angular material 6.1.0

Is there anything else we should know?

See the previous working example how it works with .mat-menu-below and .mat-menu-above when the screen is too small the menu adds a class .mat-menu-above, but since the last version it's gone:

[crisbeto]

We used those classes to set the appropriate transform-origin depending on the menu's position, but we recently added an API to the CDK which does it automatically which is why we removed them. @jelbourn should we consider them a part of the public API now?

[jelbourn]

@teterovic what did you use the classes for?

@jelbourn I needed them for the ::before / ::after arrows as shown on the image. When the menu is below the menu dots to place them on top and vice versa, it's a slightly modified material design.

Without them it's not possible to implement the arrows for the menu if the menu is 'above' / the trigger element is at the bottom of the screen as shown on the image.

So any asymmetric CSS modifications on the menu frame are not possible because they won't work when the menu is positioned 'above'

If the element is near the bottom of the screen:

[jelbourn]

@crisbeto I could see adding them back for people to do stuff like that

Its also useful to add padding/margin based on the the trigger for the menu depending if the menu is below or above.
A lot of devs forget this case when using the library - the element can be placed at the bottom when scrolling.